diff --git a/src/antd/Checkbox.test.tsx b/src/antd/Checkbox.test.tsx new file mode 100644 index 0000000..c36801e --- /dev/null +++ b/src/antd/Checkbox.test.tsx @@ -0,0 +1,42 @@ +import { test, expect } from "vitest"; +import { screen } from "@testing-library/react"; +import { userEvent } from "@testing-library/user-event"; +import { render } from "../common/test-render"; + +test("renders Checkbox component with default label", async () => { + render({ + schema: { + type: "object", + properties: { name: { type: "boolean", title: "Name" } }, + }, + data: { name: true }, + }); + + const checkbox = await screen.findByLabelText("Name"); + expect(checkbox).toBeChecked(); +}); + +test("handles onChange event correctly", async () => { + let formData = { name: false }; + + render({ + schema: { + type: "object", + properties: { name: { type: "boolean", title: "Name" } }, + }, + data: formData, + onChange: (result) => {console.log(result); formData = result.data}, + }); + + const checkbox = await screen.findByLabelText("Name"); + expect(checkbox).not.toBeChecked(); + + await userEvent.click(checkbox); + expect(checkbox).toBeChecked(); + console.log(formData); + expect(formData.name).toBe(true); + + await userEvent.click(checkbox); + expect(checkbox).not.toBeChecked(); + expect(formData.name).toBe(false); +}); \ No newline at end of file diff --git a/src/antd/Checkbox.tsx b/src/antd/Checkbox.tsx index 6fda935..87de437 100644 --- a/src/antd/Checkbox.tsx +++ b/src/antd/Checkbox.tsx @@ -15,7 +15,7 @@ export function Checkbox({ data, className, id, enabled, uischema, schema, path, return ( handleChange(path, e.target.checked)} + onChange={(e: CheckboxChangeEvent) => {handleChange(path, e.target.checked)}} className={className} id={id} disabled={!enabled} diff --git a/src/controls/BooleanControl.test.tsx b/src/controls/BooleanControl.test.tsx new file mode 100644 index 0000000..d521659 --- /dev/null +++ b/src/controls/BooleanControl.test.tsx @@ -0,0 +1,23 @@ +import { test, expect} from "vitest"; +import { render } from "../common/test-render"; +import {screen} from "@testing-library/react"; + +test("renders the Checkbox component", async () => { + render( + { + schema: { + type: "object", + properties: { adult: { type: "boolean", title: "Adult"} }, + }, + } + ); + + const checkbox = await screen.findByLabelText("Adult"); + expect(checkbox).toBeInTheDocument(); + expect(checkbox).not.toBeChecked(); + expect(checkbox).toBeEnabled(); + // check that there is an checkbox + expect(checkbox.tagName).toBe("INPUT"); + expect(checkbox.getAttribute("type")).toBe("checkbox"); + +});