From 6e05d1460f78161468f2bb1451223322542eae3d Mon Sep 17 00:00:00 2001 From: Volodymyr Zakhovaiko Date: Fri, 24 May 2024 12:53:24 +0200 Subject: [PATCH] Moved a few tests into AntD and MUI packages --- .../uniforms-antd/__tests__/wrapField.tsx | 58 +++++++++ .../uniforms-bootstrap3/__tests__/index.ts | 1 - .../__tests__/wrapField.tsx | 20 +++ .../__tests__/wrapField.tsx | 20 +++ packages/uniforms-mui/__tests__/wrapField.tsx | 19 +++ packages/uniforms/__suites__/wrapField.tsx | 114 +----------------- 6 files changed, 121 insertions(+), 111 deletions(-) create mode 100644 packages/uniforms-antd/__tests__/wrapField.tsx create mode 100644 packages/uniforms-bootstrap4/__tests__/wrapField.tsx create mode 100644 packages/uniforms-bootstrap5/__tests__/wrapField.tsx create mode 100644 packages/uniforms-mui/__tests__/wrapField.tsx diff --git a/packages/uniforms-antd/__tests__/wrapField.tsx b/packages/uniforms-antd/__tests__/wrapField.tsx new file mode 100644 index 000000000..f9875f4b4 --- /dev/null +++ b/packages/uniforms-antd/__tests__/wrapField.tsx @@ -0,0 +1,58 @@ +import { screen } from '@testing-library/react'; +import React from 'react'; +import { wrapField } from 'uniforms-antd'; +import { renderWithZod } from 'uniforms/__suites__'; +import { z } from 'zod'; + +describe('wrapField tests', () => { + test(' - renders wrapper with extra style', () => { + renderWithZod({ + element: wrapField( + { wrapperStyle: { backgroundColor: 'red' } }, +
, + ), + schema: z.object({}), + }); + expect( + screen.getByTestId('x').closest('.ant-form-item')?.getAttribute('style'), + ).toBe('background-color: red;'); + }); + + test(' - renders wrapper with an error status (error)', () => { + const error = new Error(); + renderWithZod({ + element: wrapField({ error },
), + schema: z.object({}), + }); + expect( + screen + .getByTestId('x') + .closest('.ant-form-item-has-feedback.ant-form-item-has-error'), + ).toBeInTheDocument(); + }); + + test(' - renders wrapper with label and info', () => { + renderWithZod({ + element: wrapField({ label: 'Label', info: 'Info' },
), + schema: z.object({}), + }); + expect(screen.getByRole('img').getAttribute('aria-label')).toBe( + 'question-circle', + ); + }); + + test(' - renders wrapper with a custom validateStatus', () => { + renderWithZod({ + element: wrapField( + { validateStatus: 'success' }, +
, + ), + schema: z.object({}), + }); + expect( + screen + .getByTestId('x') + .closest('.ant-form-item-has-feedback.ant-form-item-has-success'), + ).toBeInTheDocument(); + }); +}); diff --git a/packages/uniforms-bootstrap3/__tests__/index.ts b/packages/uniforms-bootstrap3/__tests__/index.ts index 8c4e72d34..73501bc3f 100644 --- a/packages/uniforms-bootstrap3/__tests__/index.ts +++ b/packages/uniforms-bootstrap3/__tests__/index.ts @@ -63,5 +63,4 @@ describe('@RTL', () => { suites.testTextField(theme.TextField, { testWrapClassName: true }); suites.testValidatedForm(theme.ValidatedForm); suites.testValidatedQuickForm(theme.ValidatedQuickForm); - suites.testWrapField(theme.wrapField, { onlyForBootstrap3: true }); }); diff --git a/packages/uniforms-bootstrap4/__tests__/wrapField.tsx b/packages/uniforms-bootstrap4/__tests__/wrapField.tsx new file mode 100644 index 000000000..873a35d17 --- /dev/null +++ b/packages/uniforms-bootstrap4/__tests__/wrapField.tsx @@ -0,0 +1,20 @@ +import { screen } from '@testing-library/react'; +import React from 'react'; +import { wrapField } from 'uniforms-bootstrap4'; +import { renderWithZod } from 'uniforms/__suites__'; +import { z } from 'zod'; + +describe('wrapField tests', () => { + test(' - renders wrapper with correct class', () => { + renderWithZod({ + element: wrapField( + { wrapClassName: 'container' }, +
, + ), + schema: z.object({}), + }); + expect( + screen.getByTestId('x').parentElement?.classList.contains('container'), + ).toBe(true); + }); +}); diff --git a/packages/uniforms-bootstrap5/__tests__/wrapField.tsx b/packages/uniforms-bootstrap5/__tests__/wrapField.tsx new file mode 100644 index 000000000..34872ccca --- /dev/null +++ b/packages/uniforms-bootstrap5/__tests__/wrapField.tsx @@ -0,0 +1,20 @@ +import { screen } from '@testing-library/react'; +import React from 'react'; +import { wrapField } from 'uniforms-bootstrap5'; +import { renderWithZod } from 'uniforms/__suites__'; +import { z } from 'zod'; + +describe('wrapField tests', () => { + test(' - renders wrapper with correct class', () => { + renderWithZod({ + element: wrapField( + { wrapClassName: 'container' }, +
, + ), + schema: z.object({}), + }); + expect( + screen.getByTestId('x').parentElement?.classList.contains('container'), + ).toBe(true); + }); +}); diff --git a/packages/uniforms-mui/__tests__/wrapField.tsx b/packages/uniforms-mui/__tests__/wrapField.tsx new file mode 100644 index 000000000..052c017ee --- /dev/null +++ b/packages/uniforms-mui/__tests__/wrapField.tsx @@ -0,0 +1,19 @@ +import { screen } from '@testing-library/react'; +import React from 'react'; +import { wrapField } from 'uniforms-mui'; +import { renderWithZod } from 'uniforms/__suites__'; +import { z } from 'zod'; + +describe('wrapField tests', () => { + test(' - renders wrapper', () => { + renderWithZod({ + element: wrapField({},
), + schema: z.object({}), + }); + expect( + screen + .getByTestId('x') + .parentElement?.classList.contains('MuiFormControl-root'), + ).toBe(true); + }); +}); diff --git a/packages/uniforms/__suites__/wrapField.tsx b/packages/uniforms/__suites__/wrapField.tsx index 6ceea3120..13ecb7be8 100644 --- a/packages/uniforms/__suites__/wrapField.tsx +++ b/packages/uniforms/__suites__/wrapField.tsx @@ -10,40 +10,8 @@ export function testWrapField( options?: { skipForMUI?: boolean; skipForAntD?: boolean; - onlyForBootstrap3?: boolean; }, ) { - skipTestIf(!options?.onlyForBootstrap3)( - ' - renders wrapper with (feedbackable=true)', - () => { - const error = new Error(); - renderWithZod({ - element: wrapField( - { error, feedbackable: true }, -
, - ), - schema: z.object({}), - }); - const x = screen.getByTestId('x'); - expect(x.parentElement?.classList.contains('has-feedback')).toBe(true); - expect( - x.nextElementSibling?.classList.contains('form-control-feedback'), - ).toBe(true); - }, - ); - - skipTestIf(!options?.skipForMUI)(' - renders wrapper', () => { - renderWithZod({ - element: wrapField({},
), - schema: z.object({}), - }); - expect( - screen - .getByTestId('x') - .parentElement?.classList.contains('MuiFormControl-root'), - ).toBe(true); - }); - skipTestIf(options?.skipForMUI || options?.skipForAntD)( ' - renders wrapper with correct class', () => { @@ -86,7 +54,7 @@ export function testWrapField( }, ); - test(' - renders error block', () => { + test(' - renders error block (showInlineError=true)', () => { const error = new Error(); renderWithZod({ element: wrapField( @@ -140,43 +108,6 @@ export function testWrapField( }, ); - skipTestIf(!options?.skipForAntD)( - ' - renders wrapper with a custom validateStatus', - () => { - renderWithZod({ - element: wrapField( - { validateStatus: 'success' }, -
, - ), - schema: z.object({}), - }); - expect( - screen - .getByTestId('x') - .closest('.ant-form-item-has-feedback.ant-form-item-has-success'), - ).toBeInTheDocument(); - }, - ); - - skipTestIf(!options?.skipForAntD)( - ' - renders wrapper with extra style', - () => { - renderWithZod({ - element: wrapField( - { wrapperStyle: { backgroundColor: 'red' } }, -
, - ), - schema: z.object({}), - }); - expect( - screen - .getByTestId('x') - .closest('.ant-form-item') - ?.getAttribute('style'), - ).toBe('background-color: red;'); - }, - ); - skipTestIf(options?.skipForMUI)( ' - renders wrapper with extra text', () => { @@ -192,22 +123,6 @@ export function testWrapField( }, ); - skipTestIf(!options?.skipForAntD)( - ' - renders wrapper with an error status (error)', - () => { - const error = new Error(); - renderWithZod({ - element: wrapField({ error },
), - schema: z.object({}), - }); - expect( - screen - .getByTestId('x') - .closest('.ant-form-item-has-feedback.ant-form-item-has-error'), - ).toBeInTheDocument(); - }, - ); - skipTestIf(options?.skipForMUI)( ' - renders error block (showInlineError=false)', () => { @@ -220,30 +135,9 @@ export function testWrapField( schema: z.object({}), }); const x = screen.getByTestId('x'); - if (options?.skipForAntD) { - expect( - x.closest('.ant-form-item-has-feedback.ant-form-item-has-error'), - ).toBeInTheDocument(); - } else { - expect( - x.parentElement?.classList.contains( - options?.onlyForBootstrap3 ? 'has-error' : 'is-invalid', - ), - ).toBe(true); - } - }, - ); - - skipTestIf(!options?.skipForAntD)( - ' - renders wrapper with label and info', - () => { - renderWithZod({ - element: wrapField({ label: 'Label', info: 'Info' },
), - schema: z.object({}), - }); - expect(screen.getByRole('img').getAttribute('aria-label')).toBe( - 'question-circle', - ); + expect( + x.closest('.ant-form-item-has-error, .is-invalid'), + ).toBeInTheDocument(); }, ); }