diff --git a/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch-test-component.tsx b/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch-test-component.tsx new file mode 100644 index 0000000..317d440 --- /dev/null +++ b/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch-test-component.tsx @@ -0,0 +1,25 @@ +import { DeepPartial, OmitSafe } from "@ilbrando/utils"; + +import { FormSwitch, FormSwitchProps } from "../form-switch"; +import { TestFormFields, useTestForm, UseTestFormOptions } from "../../../test-components/form-utils"; +import { TestWrapper } from "../../../test-components/test-wrapper"; + +type FormSwitchTestComponentProps = Partial["fm"], "onChange">> & { + formOptions?: DeepPartial; + isSubmitting?: boolean; + formCheckboxProps?: OmitSafe, "formManager" | "fieldName">; +}; + +export const FormSwitchTestComponent = (props: FormSwitchTestComponentProps) => { + const { onChange, formOptions, isSubmitting, formCheckboxProps } = props; + + const { fm } = useTestForm(formOptions, isSubmitting); + + Object.assign(fm.onChange, onChange); + + return ( + + + + ); +}; diff --git a/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch.spec.tsx b/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch.spec.tsx new file mode 100644 index 0000000..4594d73 --- /dev/null +++ b/packages/simple-form-joy/src/form-components/form-switch/tests/form-switch.spec.tsx @@ -0,0 +1,52 @@ +import { expect, test } from "@playwright/experimental-ct-react"; + +import { alwaysErrorValidatorMessage } from "src/test-components/form-utils"; + +import { FormSwitchTestComponent } from "./form-switch-test-component"; + +test("updates form state when receiving input", async ({ mount }) => { + // Arrange + let booleanValue: boolean | null = null; + const expected = true; + + // Act + const component = await mount( + { + booleanValue = v; + } + }} + /> + ); + + const switchControl = component.getByRole("switch"); + await switchControl.click(); + + // Assert + expect(booleanValue).toBe(expected); +}); + +test("renders label", async ({ mount }) => { + // Arrange + const expected = "Label here"; + + // Act + const component = await mount(); + + // Assert + await expect(component).toContainText(expected); +}); + +test("renders error message", async ({ mount }) => { + // Act + const component = await mount(); + + // touch switch + const switchControl = component.getByRole("switch"); + await switchControl.click(); + await switchControl.click(); + + // Assert + await expect(component).toContainText(alwaysErrorValidatorMessage); +});