{"_id":"@1pone/ant-design-testing","name":"@1pone/ant-design-testing","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@1pone/ant-design-testing","version":"1.0.0","description":"Easier testing for ant-design-based UI library with Jest and Vitest support","main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/cjs/index.d.ts","scripts":{"dev":"father dev","build":"father build && npm run generate","build:deps":"father prebundle","prepublishOnly":"father doctor && npm run build","generate":"node scripts/generate.js","test":"jest","test:jest":"jest","test:vitest":"vitest","migrate-tests":"node scripts/migrate-tests.js","lint":"eslint src/**","lint:fix":"prettier --write src/** && eslint --fix src/**","release":"standard-version","publish":"npm run publish","prepare":"husky install"},"repository":{"type":"git","url":"git+https://github.com/1pone/ant-design-testing.git"},"keywords":["Ant Design","UI library","Jest","Vitest","Unit Test","React Testing Library","Test Framework Agnostic"],"authors":["mortalYoung <yangwei1@outlook.com>","JackWang032 <w2522134117@outlook.com>"],"license":"MIT","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"peerDependencies":{"@testing-library/react":"*","antd":"5","jest":"*","vitest":"*"},"peerDependenciesMeta":{"jest":{"optional":true},"vitest":{"optional":true}},"devDependencies":{"@swc/core":"^1.3.58","@swc/jest":"^0.2.26","@testing-library/react":"^13.0.0","@types/jest":"^29.5.1","@vitest/ui":"3.2.4","antd":"5","bumpp":"^9.1.0","dayjs":"^1.11.8","eslint-plugin-jsdoc":"^46.8.2","father":"^4.3.0","husky":"^8.0.3","jest":"^29.5.0","jest-environment-jsdom":"^29.5.0","jsdom":"^23.0.0","ko-lint-config":"^2.2.20","lint-staged":"^13.2.2","moment":"^2.29.4","prettier":"^2.8.8","react":"^18.2.0","react-dom":"^18.2.0","standard-version":"^9.5.0","ts-morph":"^19.0.0","typescript":"^4.8.0","vitest":"^3.2.4"},"lint-staged":{"*.{ts,js,tsx}":["eslint --fix","prettier --write"]},"_id":"@1pone/ant-design-testing@1.0.0","gitHead":"706547016651d1425d1a364fea2bc6424907b3bb","bugs":{"url":"https://github.com/1pone/ant-design-testing/issues"},"homepage":"https://github.com/1pone/ant-design-testing#readme","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-McC0LzqIsS1e0mYghQJFoHWieiDTG0ug1jmdBPACHNfehU6x019AAlBo5G/T6/jQoyW2HSd2dYAorOxnXfDkUg==","shasum":"98ddcf9702f4dee9af6cf558e9459f5974c29156","tarball":"https://registry.npmjs.org/@1pone/ant-design-testing/-/ant-design-testing-1.0.0.tgz","fileCount":186,"unpackedSize":528835,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHtIwXjDpykRbyfyXg8KNUXw9olbu5hwyguS4UzG68rhAiBFSg7D8NJMnxMeTqQnKzDV0eNwbW8cHGYDKKGAN9GGMw=="}]},"_npmUser":{"name":"onepone","email":"wellpeng97@gmail.com"},"directories":{},"maintainers":[{"name":"onepone","email":"wellpeng97@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ant-design-testing_1.0.0_1756957126206_0.9834208202260493"},"_hasShrinkwrap":false}},"time":{"created":"2025-09-04T03:38:46.108Z","1.0.0":"2025-09-04T03:38:46.406Z","modified":"2025-09-04T03:38:46.718Z"},"maintainers":[{"name":"onepone","email":"wellpeng97@gmail.com"}],"description":"Easier testing for ant-design-based UI library with Jest and Vitest support","homepage":"https://github.com/1pone/ant-design-testing#readme","keywords":["Ant Design","UI library","Jest","Vitest","Unit Test","React Testing Library","Test Framework Agnostic"],"repository":{"type":"git","url":"git+https://github.com/1pone/ant-design-testing.git"},"bugs":{"url":"https://github.com/1pone/ant-design-testing/issues"},"license":"MIT","readme":"<div align=\"center\">ant-design-testing</div>\n\n_Easier testing for ant-design-based UI library with Jest and Vitest support_\n\nThis library is based on `React-Testing-Library` and supports both `Jest` and `Vitest` testing frameworks\n\n## Usage\n\nThe latest package supports antd v5.x version.\nIf you are using antd 4.x, please install `ant-design-testing@1.x` version.\n\n```shell\n$ npm install ant-design-testing -D\n#or\n$ yarn add ant-design-testing -D\n#or\n$ pnpm add ant-design-testing -D\n```\n\nThen, configure the library in your test setup file:\n\n```tsx\n// setupTests.ts\nimport { provider } from 'ant-design-testing';\n\n// Configure prefix class (default: 'ant')\n// Configure test framework (default: 'jest')\nprovider({ \n    prefixCls: 'ant',\n    testFramework: 'jest' // or 'vitest'\n});\n```\n\n### For Jest Users\n\nNo additional setup required. The library defaults to Jest compatibility.\n\n### For Vitest Users\n\nConfigure Vitest in your setup:\n\n```tsx\n// setupTests.ts\nimport { provider } from 'ant-design-testing';\n\nprovider({ \n    prefixCls: 'ant',\n    testFramework: 'vitest'\n});\n```\n\nOr create a `vitest.config.js`:\n\n```js\nimport { defineConfig } from 'vitest/config';\n\nexport default defineConfig({\n    test: {\n        environment: 'jsdom',\n        setupFiles: ['./tests/setupTests.ts'],\n        globals: true,\n    },\n});\n```\n\n## Basic Usage\n\n```tsx\n// yourInput.test.tsx\nimport { input, testFn } from 'ant-design-testing';\n\ndescribe(\"Test input's fire functions\", () => {\n    test('fireChange', () => {\n        const fn = testFn(); // Framework-agnostic mock function\n        const { container } = render(<Input onChange={fn} />);\n        input.fireChange(container, 'test');\n        expect(fn).toBeCalled();\n    });\n});\n```\n\nOtherwise, you can use query to find ant-design element quickly, like this\n\n```tsx\n// yourInput.test.tsx\nimport { input } from 'ant-design-testing';\n\ntest('query', () => {\n    const { container } = render(<div>\n        <Input />\n        <Input id='test' />\n    </div>);\n    const el = input.query(container, 1)\n    expect(el.id).toBe('test');\n});\n```\n\nA simple example form demo, like this\n\n```tsx\n// your form Component\nconst MyForm = ({ onSubmit }: any) => {\n    const [form] = Form.useForm();\n    return (\n        <Form form={form}>\n            <Form.Item name=\"username\">\n                <Input />\n            </Form.Item>\n            <Form.Item name=\"password\">\n                <Input type=\"password\" />\n            </Form.Item>\n            <Form.Item name=\"role\">\n                <Select>\n                    <Select.Option value=\"admin\">管理员</Select.Option>\n                </Select>\n            </Form.Item>\n            <Button\n                htmlType=\"submit\"\n                onClick={() => {\n                    onSubmit(form.getFieldsValue());\n                }}\n            >\n                提交\n            </Button>\n        </Form>\n    );\n};\n```\n\n```tsx\n// your test file\nimport { select, input, button, testFn } from 'ant-design-testing';\n\nit('test MyForm', () => {\n    const fn = testFn(); // Framework-agnostic mock function\n    const { container } = render(\n        <MyForm onSubmit={fn}/>\n    );\n    const userName = input.query(container)!;\n    const password = input.query(container, 1)!;\n    input.fireChange(userName, 'zhangsan')\n    input.fireChange(password, '123456')\n\n    select.fireOpen(container);\n    select.fireSelect(document.body, 0)\n\n    button.fireClick(container);\n\n    expect(fn).toBeCalledWith({username: 'zhangsan', password: '123456', role: 'admin'});\n});\n```\n\nAll query methods support chain calling\n\n```tsx\n// basic usage\nconst userName = input.query(container)!;\nconst password = input.query(container, 1)!;\ninput.fireChange(userName, 'zhangsan');\ninput.fireChange(password, '123456');\n\n// chain usage\ninput.query(container)?.fireChange('zhangsan');\ninput.query(container, 1)?.fireChange('123456');\n```\n\n## Test Framework Agnostic APIs\n\nThe library provides framework-agnostic APIs that work with both Jest and Vitest:\n\n### Mock Functions\n\n```tsx\nimport { testFn } from 'ant-design-testing';\n\nconst mockFn = testFn(); // Works with both Jest and Vitest\n```\n\n### Timer Control\n\n```tsx\nimport { useFakeTimers, useRealTimers, runAllTimers, advanceTimersByTime } from 'ant-design-testing';\n\n// Setup fake timers\nuseFakeTimers();\n\n// Advance timers\nrunAllTimers();\nadvanceTimersByTime(1000);\n\n// Restore real timers\nuseRealTimers();\n```\n\n### Spy Functions\n\n```tsx\nimport { spyOn } from 'ant-design-testing';\n\nconst spy = spyOn(console, 'log');\n```\n\n## Migration from Jest-only Code\n\nIf you have existing Jest-specific code, you can use our migration script:\n\n```bash\nnpm run migrate-tests\n```\n\nThis script will automatically update your test files to use framework-agnostic APIs.\n\n## Framework Configuration\n\n### Jest Configuration (jest.config.js)\n\n```js\nmodule.exports = {\n    setupFilesAfterEnv: ['./tests/setupTests.ts'],\n    testEnvironment: 'jsdom',\n    // ... other Jest config\n};\n```\n\n### Vitest Configuration (vitest.config.js)\n\n```js\nimport { defineConfig } from 'vitest/config';\n\nexport default defineConfig({\n    test: {\n        environment: 'jsdom',\n        setupFiles: ['./tests/setupTests.ts'],\n        globals: true,\n    },\n});\n```\n\n## Running Tests\n\n```bash\n# Run with Jest\nnpm run test:jest\n\n# Run with Vitest\nnpm run test:vitest\n\n# Default (Jest)\nnpm test\n```\n","readmeFilename":"README.md","_rev":"1-6ec7cac845c551f1753d564bf42e70b9"}