{"library":"morfi-test-utils","title":"Morfi Test Utilities","description":"morfi-test-utils is a testing utility library specifically designed for forms built with the `morfi` React form library. It provides helpers to simplify the testing of both `morfi` forms and individual `morfi`-connected fields within React components. The library is currently at version 3.0.3 and appears to be actively maintained, with the last major release (v2.0.0) in July 2022. It integrates with `@testing-library/react` and `jest` to offer utilities like mocking form fields, interacting with form values and errors, and asserting field properties and form submissions in an `act`-wrapped manner. Its key differentiator is its tight coupling with `morfi`'s internal structure, providing a more streamlined testing experience compared to generic form testing approaches.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install morfi-test-utils"],"cli":null},"imports":["import { MorfiTestUtils } from 'morfi-test-utils';","MorfiTestUtil.Field","MorfiTestUtil.Form"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { render } from '@testing-library/react';\nimport { MorfiTestUtils } from 'morfi-test-utils';\nimport React from 'react';\n\n// Mock your morfi-connected input component\n// In a real scenario, this would be a path to your actual Input component\njest.mock('./Input', () => ({\n    Input: (arg) => MorfiTestUtil.Field(arg),\n}));\n\n// A minimal mock form component for demonstration\nconst MyForm = () => (\n    <form>\n        <Input name=\"userName\" label=\"Unique Username\" required={false} />\n    </form>\n);\n\ndescribe('MorfiTestUtils basic form interaction', () => {\n    it('interacts with my form fields and submits', async () => {\n        // mount the form\n        render(<MyForm />);\n        \n        // update some values (already wrapped into \"act\")\n        MorfiTestUtils.fields.userName.change('M4gic');\n        \n        // check for value and properties\n        expect(MorfiTestUtils.fields.userName.value).toBe('M4gic');\n        expect(MorfiTestUtils.fields.userName.dirty).toBe(true);\n        expect(MorfiTestUtils.fields.userName.required).toBe(false);\n        expect(MorfiTestUtils.fields.userName.props.label).toBe('Unique Username');\n\n        // In a real test, you'd trigger validation or submission and assert errors\n        // For simplicity, we'll just submit here.\n        await MorfiTestUtils.submit();\n        \n        // Add assertions for what happens after submit, e.g., an onSubmit mock being called.\n        // expect(someSubmitMock).toHaveBeenCalledWith({ userName: 'M4gic' });\n    });\n});","lang":"typescript","description":"Demonstrates how to mock a Morfi-connected input component, render a form, interact with a field using `MorfiTestUtils`, and assert its properties and values before submission.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}