From 208665a11b276751ce6584fe8b77352409f46713 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Po=C5=9Bpiech?= <ptkpospiech@gmail.com>
Date: Fri, 9 Feb 2024 15:14:11 +0100
Subject: [PATCH 1/4] added tests to suites

---
 packages/uniforms-antd/__tests__/index.ts     |   2 +
 .../uniforms-bootstrap3/__tests__/index.ts    |   1 +
 .../uniforms-bootstrap4/__tests__/index.ts    |   1 +
 .../uniforms-bootstrap5/__tests__/index.ts    |   1 +
 packages/uniforms-material/__tests__/index.ts |   1 +
 packages/uniforms-mui/__tests__/index.ts      |   1 +
 packages/uniforms-semantic/__tests__/index.ts |   1 +
 packages/uniforms-unstyled/__tests__/index.ts |   1 +
 packages/uniforms/__suites__/ListField.tsx    | 113 +++++++++++++++++-
 9 files changed, 120 insertions(+), 2 deletions(-)

diff --git a/packages/uniforms-antd/__tests__/index.ts b/packages/uniforms-antd/__tests__/index.ts
index 8f0fbdb8b..205f5d766 100644
--- a/packages/uniforms-antd/__tests__/index.ts
+++ b/packages/uniforms-antd/__tests__/index.ts
@@ -47,6 +47,8 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('img', { name: 'plus-square' }),
+    testTooltip: true,
+    testStyle: true,
   });
   suites.testLongTextField(theme.LongTextField);
   // FIXME: AntD number input doesn't work with new RTL test implementation
diff --git a/packages/uniforms-bootstrap3/__tests__/index.ts b/packages/uniforms-bootstrap3/__tests__/index.ts
index 83ab14a6d..94fa7abc6 100644
--- a/packages/uniforms-bootstrap3/__tests__/index.ts
+++ b/packages/uniforms-bootstrap3/__tests__/index.ts
@@ -47,6 +47,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('button'),
+    disableInlineError: true,
   });
   suites.testLongTextField(theme.LongTextField);
   suites.testNestField(theme.NestField);
diff --git a/packages/uniforms-bootstrap4/__tests__/index.ts b/packages/uniforms-bootstrap4/__tests__/index.ts
index 0d7ded864..84249a4e7 100644
--- a/packages/uniforms-bootstrap4/__tests__/index.ts
+++ b/packages/uniforms-bootstrap4/__tests__/index.ts
@@ -47,6 +47,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('button'),
+    disableInlineError: true,
   });
   suites.testLongTextField(theme.LongTextField);
   suites.testNestField(theme.NestField);
diff --git a/packages/uniforms-bootstrap5/__tests__/index.ts b/packages/uniforms-bootstrap5/__tests__/index.ts
index bd1096e57..5248b5b72 100644
--- a/packages/uniforms-bootstrap5/__tests__/index.ts
+++ b/packages/uniforms-bootstrap5/__tests__/index.ts
@@ -47,6 +47,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('button'),
+    disableInlineError: true,
   });
   suites.testLongTextField(theme.LongTextField, {
     testMinMaxLength: true,
diff --git a/packages/uniforms-material/__tests__/index.ts b/packages/uniforms-material/__tests__/index.ts
index 5d81b6d44..c3e9643e9 100644
--- a/packages/uniforms-material/__tests__/index.ts
+++ b/packages/uniforms-material/__tests__/index.ts
@@ -49,6 +49,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByText(/\+/),
+    testError: false,
   });
   suites.testLongTextField(theme.LongTextField);
   suites.testNestField(theme.NestField, { skipInMuiTests: true });
diff --git a/packages/uniforms-mui/__tests__/index.ts b/packages/uniforms-mui/__tests__/index.ts
index bb7fdb5b8..a1c7dfdae 100644
--- a/packages/uniforms-mui/__tests__/index.ts
+++ b/packages/uniforms-mui/__tests__/index.ts
@@ -46,6 +46,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByText(/\+/),
+    testError: false,
   });
   suites.testLongTextField(theme.LongTextField);
   suites.testNestField(theme.NestField, { skipInMuiTests: true });
diff --git a/packages/uniforms-semantic/__tests__/index.ts b/packages/uniforms-semantic/__tests__/index.ts
index 1c5817f1a..0a4d2734d 100644
--- a/packages/uniforms-semantic/__tests__/index.ts
+++ b/packages/uniforms-semantic/__tests__/index.ts
@@ -45,6 +45,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('button'),
+    disableInlineError: true,
   });
   suites.testLongTextField(theme.LongTextField);
   suites.testNestField(theme.NestField);
diff --git a/packages/uniforms-unstyled/__tests__/index.ts b/packages/uniforms-unstyled/__tests__/index.ts
index 98de11a8e..a420e2333 100644
--- a/packages/uniforms-unstyled/__tests__/index.ts
+++ b/packages/uniforms-unstyled/__tests__/index.ts
@@ -45,6 +45,7 @@ describe('@RTL', () => {
   suites.testListDelField(theme.ListDelField);
   suites.testListField(theme.ListField, {
     getListAddField: screen => screen.getByRole('button'),
+    testError: false,
   });
   suites.testLongTextField(theme.LongTextField, {
     skipShowInlineErrorTests: true,
diff --git a/packages/uniforms/__suites__/ListField.tsx b/packages/uniforms/__suites__/ListField.tsx
index 1ff7fd040..f76ecd26a 100644
--- a/packages/uniforms/__suites__/ListField.tsx
+++ b/packages/uniforms/__suites__/ListField.tsx
@@ -6,7 +6,19 @@ import { render } from './render';
 
 export function testListField(
   ListField: ComponentType<any>,
-  { getListAddField }: { getListAddField: (screen: Screen) => HTMLElement },
+  {
+    getListAddField,
+    disableInlineError,
+    testError = true,
+    testStyle,
+    testTooltip,
+  }: {
+    getListAddField: (screen: Screen) => HTMLElement;
+    disableInlineError?: boolean;
+    testError?: boolean;
+    testStyle?: boolean;
+    testTooltip?: boolean;
+  },
 ) {
   test('<ListField> - renders ListAddField', () => {
     render(<ListField name="x" label="ListFieldLabel" />, {
@@ -27,7 +39,62 @@ export function testListField(
     expect(screen.getByText(/ListFieldLabel.*/)).toBeInTheDocument();
   });
 
-  test('<ListField> - renders correct numer of items with model (specified)', () => {
+  if (testStyle) {
+    test('<ListField> - renders correct error style', () => {
+      const error = new Error();
+
+      const { container } = render(
+        <ListField name="x" label="ListFieldLabel" error={error} />,
+        {
+          x: Array,
+          'x.$': String,
+        },
+      );
+
+      expect(container.getElementsByClassName('ant-list')[0]).toHaveStyle(
+        'borderColor: rgb(255, 85, 0)',
+      );
+    });
+
+    test('<ListField> - renders correct error style (with specified style prop)', () => {
+      const error = new Error();
+
+      const { container } = render(
+        <ListField
+          name="x"
+          label="ListFieldLabel"
+          error={error}
+          style={{ marginLeft: '8px' }}
+        />,
+        {
+          x: Array,
+          'x.$': String,
+        },
+      );
+
+      expect(container.getElementsByClassName('ant-list')[0]).toHaveStyle(
+        'marginLeft: 8px',
+      );
+    });
+  }
+
+  if (testTooltip) {
+    test('<ListField> - renders correct info (specified)', () => {
+      const { container } = render(
+        <ListField name="x" label="ListFieldLabel" info="ListFieldInfo" />,
+        {
+          x: Array,
+          'x.$': String,
+        },
+      );
+
+      expect(
+        container.getElementsByClassName('anticon-question-circle').length,
+      ).toBe(1);
+    });
+  }
+
+  test('<ListField> - renders correct number of items with model (specified)', () => {
     render(
       <ListField name="x" />,
       {
@@ -116,4 +183,46 @@ export function testListField(
     expect(onChange).toHaveBeenCalledTimes(1);
     expect(onChange).toHaveBeenLastCalledWith('x', [undefined]);
   });
+
+  if (testError) {
+    test('<ListField> - renders correct error text (specified)', async () => {
+      const error = new Error();
+
+      render(
+        <ListField
+          name="x"
+          error={error}
+          errorMessage="Error"
+          showInlineError
+        />,
+        {
+          x: Array,
+          'x.$': String,
+        },
+      );
+
+      expect(screen.getByText(/^Error$/)).toBeInTheDocument();
+    });
+  }
+
+  if (disableInlineError) {
+    test('<ListField> - renders correct error text (specified)', async () => {
+      const error = new Error();
+
+      render(
+        <ListField
+          name="x"
+          error={error}
+          errorMessage="Error"
+          showInlineError={false}
+        />,
+        {
+          x: Array,
+          'x.$': String,
+        },
+      );
+
+      expect(screen.queryByText(/^Error$/)).not.toBeInTheDocument();
+    });
+  }
 }

From 5b65e250bae12f611e0a82f38513453ec5e57c0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Po=C5=9Bpiech?= <ptkpospiech@gmail.com>
Date: Fri, 9 Feb 2024 15:17:50 +0100
Subject: [PATCH 2/4] removed enzyme ListField tests

---
 .../uniforms-antd/__tests__/ListField.tsx     | 183 ------------------
 .../__tests__/ListField.tsx                   | 175 -----------------
 .../__tests__/ListField.tsx                   | 175 -----------------
 .../__tests__/ListField.tsx                   | 175 -----------------
 .../uniforms-material/__tests__/ListField.tsx | 138 -------------
 packages/uniforms-mui/__tests__/ListField.tsx | 138 -------------
 .../uniforms-semantic/__tests__/ListField.tsx | 167 ----------------
 .../uniforms-unstyled/__tests__/ListField.tsx | 136 -------------
 8 files changed, 1287 deletions(-)
 delete mode 100644 packages/uniforms-antd/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-bootstrap3/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-bootstrap4/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-bootstrap5/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-material/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-mui/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-semantic/__tests__/ListField.tsx
 delete mode 100644 packages/uniforms-unstyled/__tests__/ListField.tsx

diff --git a/packages/uniforms-antd/__tests__/ListField.tsx b/packages/uniforms-antd/__tests__/ListField.tsx
deleted file mode 100644
index 0d91e4c9d..000000000
--- a/packages/uniforms-antd/__tests__/ListField.tsx
+++ /dev/null
@@ -1,183 +0,0 @@
-import Tooltip from 'antd/lib/tooltip';
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-antd';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label and info (specified)', () => {
-  const element = (
-    <ListField name="x" label="ListFieldLabel" info="ListFieldInfo" />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(Tooltip)).toHaveLength(1);
-  expect(wrapper.find(Tooltip).prop('title')).toBe('ListFieldInfo');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('div > div').at(0).text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct numer of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders correct error text (specified)', () => {
-  const error = new Error();
-  const element = (
-    <ListField name="x" error={error} errorMessage="Error" showInlineError />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array, label: '' }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('div > div').at(0).text()).toBe('Error');
-});
-
-test('<ListField> - renders correct error style', () => {
-  const error = new Error();
-  const element = <ListField name="x" error={error} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('div').at(0).prop('style')).toHaveProperty(
-    'borderColor',
-    'rgb(255, 85, 0)',
-  );
-});
-
-test('<ListField> - renders correct error style (with specified style prop)', () => {
-  const error = new Error();
-  const element = (
-    <ListField name="x" error={error} style={{ marginLeft: '8px' }} />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('div').at(0).prop('style')).toHaveProperty(
-    'marginLeft',
-    '8px',
-  );
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-bootstrap3/__tests__/ListField.tsx b/packages/uniforms-bootstrap3/__tests__/ListField.tsx
deleted file mode 100644
index 81e67ced7..000000000
--- a/packages/uniforms-bootstrap3/__tests__/ListField.tsx
+++ /dev/null
@@ -1,175 +0,0 @@
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-bootstrap3';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('label')).toHaveLength(1);
-  expect(wrapper.find('label').text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct numer of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders correct error text (specified)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.help-block').text()).toBe('Error');
-});
-
-test('<ListField> - renders correct error text (showInlineError=false)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError={false}
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.help-block')).toHaveLength(0);
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" addIcon="+" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-bootstrap4/__tests__/ListField.tsx b/packages/uniforms-bootstrap4/__tests__/ListField.tsx
deleted file mode 100644
index 4f6215222..000000000
--- a/packages/uniforms-bootstrap4/__tests__/ListField.tsx
+++ /dev/null
@@ -1,175 +0,0 @@
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-bootstrap4';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('label')).toHaveLength(1);
-  expect(wrapper.find('label').text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct numer of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders correct error text (specified)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.text-danger').text()).toBe('Error');
-});
-
-test('<ListField> - renders correct error text (showInlineError=false)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError={false}
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.text-danger')).toHaveLength(0);
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" addIcon="+" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-bootstrap5/__tests__/ListField.tsx b/packages/uniforms-bootstrap5/__tests__/ListField.tsx
deleted file mode 100644
index 72efa14fc..000000000
--- a/packages/uniforms-bootstrap5/__tests__/ListField.tsx
+++ /dev/null
@@ -1,175 +0,0 @@
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-bootstrap5';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('label')).toHaveLength(1);
-  expect(wrapper.find('label').text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct numer of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders correct error text (specified)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.text-danger').text()).toBe('Error');
-});
-
-test('<ListField> - renders correct error text (showInlineError=false)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      errorMessage="Error"
-      label
-      showInlineError={false}
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('.text-danger')).toHaveLength(0);
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" addIcon="+" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-material/__tests__/ListField.tsx b/packages/uniforms-material/__tests__/ListField.tsx
deleted file mode 100644
index 046235db6..000000000
--- a/packages/uniforms-material/__tests__/ListField.tsx
+++ /dev/null
@@ -1,138 +0,0 @@
-import IconButton from '@material-ui/core/IconButton';
-import ListSubheader from '@material-ui/core/ListSubheader';
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-material';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListSubheader)).toHaveLength(1);
-  expect(wrapper.find(ListSubheader).text()).toBe('ListFieldLabel');
-});
-
-test('<ListField> - renders correct number of items with model', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField)).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-  expect(
-    wrapper.find(ListAddField).find(IconButton).simulate('click'),
-  ).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-mui/__tests__/ListField.tsx b/packages/uniforms-mui/__tests__/ListField.tsx
deleted file mode 100644
index 4c10074d0..000000000
--- a/packages/uniforms-mui/__tests__/ListField.tsx
+++ /dev/null
@@ -1,138 +0,0 @@
-import IconButton from '@mui/material/IconButton';
-import ListSubheader from '@mui/material/ListSubheader';
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-mui';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListSubheader)).toHaveLength(1);
-  expect(wrapper.find(ListSubheader).text()).toBe('ListFieldLabel');
-});
-
-test('<ListField> - renders correct number of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField)).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-// Strange enzyme behavior
-// TypeError: Cannot read properties of null (reading '__reactFiber$my72orhzzz9')
-test.skip('<ListField> - renders proper number of optional values after add new value (with initialCount)', async () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-    ),
-  );
-
-  expect(
-    wrapper.find(ListAddField).find(IconButton).simulate('click'),
-  ).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-semantic/__tests__/ListField.tsx b/packages/uniforms-semantic/__tests__/ListField.tsx
deleted file mode 100644
index 2efb22d0f..000000000
--- a/packages/uniforms-semantic/__tests__/ListField.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-semantic';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('label')).toHaveLength(1);
-  expect(wrapper.find('label').text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct number of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders correct error text (specified)', () => {
-  const error = new Error();
-  const element = (
-    <ListField name="x" error={error} showInlineError errorMessage="Error" />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array, label: '' }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.children().first().text()).toBe('Error');
-});
-
-test('<ListField> - renders correct error text (showInlineError=false)', () => {
-  const error = new Error();
-  const element = (
-    <ListField
-      name="x"
-      error={error}
-      showInlineError={false}
-      errorMessage="Error"
-    />
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.children().first().text()).not.toBe('Error');
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});
diff --git a/packages/uniforms-unstyled/__tests__/ListField.tsx b/packages/uniforms-unstyled/__tests__/ListField.tsx
deleted file mode 100644
index 7c8dd726a..000000000
--- a/packages/uniforms-unstyled/__tests__/ListField.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import React from 'react';
-import { ListAddField, ListField, ListItemField } from 'uniforms-unstyled';
-
-import createContext from './_createContext';
-import mount from './_mount';
-
-test('<ListField> - works', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListField)).toHaveLength(1);
-});
-
-test('<ListField> - renders ListAddField', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find(ListAddField)).toHaveLength(1);
-  expect(wrapper.find(ListAddField).prop('name')).toBe('$');
-});
-
-test('<ListField> - renders correct label (specified)', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }),
-  );
-
-  expect(wrapper.find('label')).toHaveLength(1);
-  expect(wrapper.find('label').text()).toEqual(
-    expect.stringContaining('ListFieldLabel'),
-  );
-});
-
-test('<ListField> - renders correct numer of items with model (specified)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find('input')).toHaveLength(3);
-});
-
-test('<ListField> - passes itemProps to its children', () => {
-  const element = <ListField name="x" itemProps={{ 'data-xyz': 1 }} />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).first().prop('data-xyz')).toBe(1);
-});
-
-test('<ListField> - renders children (specified)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child />
-      PlainText
-    </ListField>
-  );
-  mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(Child).toHaveBeenCalledTimes(2);
-});
-
-test('<ListField> - renders children with correct name (children)', () => {
-  const Child = jest.fn(() => <div />) as React.FC<any>;
-
-  const element = (
-    <ListField name="x">
-      <Child name="$" />
-    </ListField>
-  );
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(Child).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(Child).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders children with correct name (value)', () => {
-  const element = <ListField name="x" />;
-  const wrapper = mount(
-    element,
-    createContext({ x: { type: Array }, 'x.$': { type: String } }, undefined, {
-      x: [undefined, undefined],
-    }),
-  );
-
-  expect(wrapper.find(ListItemField).at(0).prop('name')).toBe('0');
-  expect(wrapper.find(ListItemField).at(1).prop('name')).toBe('1');
-});
-
-test('<ListField> - renders proper number of optional values after add new value', () => {
-  const element = <ListField name="x" label="ListFieldLabel" />;
-  const onChange = jest.fn();
-  const wrapper = mount(
-    element,
-    createContext(
-      { x: { type: Array, optional: true }, 'x.$': { type: String } },
-      { onChange },
-      {
-        x: [undefined, undefined, undefined],
-      },
-    ),
-  );
-  expect(wrapper.find(ListAddField).simulate('click')).toBeTruthy();
-  expect(onChange).toHaveBeenNthCalledWith(1, 'x', [
-    undefined,
-    undefined,
-    undefined,
-    undefined,
-  ]);
-});

From 0acc523924911d5fdf5600ddc970f136b664db5a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Po=C5=9Bpiech?= <ptkpospiech@gmail.com>
Date: Wed, 14 Feb 2024 15:45:03 +0100
Subject: [PATCH 3/4] refactor

---
 packages/uniforms/__suites__/ListField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/uniforms/__suites__/ListField.tsx b/packages/uniforms/__suites__/ListField.tsx
index f76ecd26a..5940f5491 100644
--- a/packages/uniforms/__suites__/ListField.tsx
+++ b/packages/uniforms/__suites__/ListField.tsx
@@ -206,7 +206,7 @@ export function testListField(
   }
 
   if (disableInlineError) {
-    test('<ListField> - renders correct error text (specified)', async () => {
+    test('<ListField> - renders correct error text (showInlineError=false)', async () => {
       const error = new Error();
 
       render(

From 02b44d18b9d5e7cfaf25427a4c9ea56c2ced1b09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Po=C5=9Bpiech?= <ptkpospiech@gmail.com>
Date: Thu, 15 Feb 2024 07:53:07 +0100
Subject: [PATCH 4/4] refactor

---
 packages/uniforms/__suites__/ListField.tsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/packages/uniforms/__suites__/ListField.tsx b/packages/uniforms/__suites__/ListField.tsx
index 5940f5491..3c534102d 100644
--- a/packages/uniforms/__suites__/ListField.tsx
+++ b/packages/uniforms/__suites__/ListField.tsx
@@ -43,15 +43,20 @@ export function testListField(
     test('<ListField> - renders correct error style', () => {
       const error = new Error();
 
-      const { container } = render(
-        <ListField name="x" label="ListFieldLabel" error={error} />,
+      render(
+        <ListField
+          name="x"
+          label="ListFieldLabel"
+          error={error}
+          data-testid="field"
+        />,
         {
           x: Array,
           'x.$': String,
         },
       );
 
-      expect(container.getElementsByClassName('ant-list')[0]).toHaveStyle(
+      expect(screen.getByTestId('field')).toHaveStyle(
         'borderColor: rgb(255, 85, 0)',
       );
     });
@@ -59,12 +64,13 @@ export function testListField(
     test('<ListField> - renders correct error style (with specified style prop)', () => {
       const error = new Error();
 
-      const { container } = render(
+      render(
         <ListField
           name="x"
           label="ListFieldLabel"
           error={error}
           style={{ marginLeft: '8px' }}
+          data-testid="field"
         />,
         {
           x: Array,
@@ -72,9 +78,7 @@ export function testListField(
         },
       );
 
-      expect(container.getElementsByClassName('ant-list')[0]).toHaveStyle(
-        'marginLeft: 8px',
-      );
+      expect(screen.getByTestId('field')).toHaveStyle('marginLeft: 8px');
     });
   }
 
@@ -141,7 +145,7 @@ export function testListField(
   });
 
   test('<ListField> - renders children with correct name (children)', () => {
-    const Child = jest.fn(() => <div data-testid="field" />) as FC<any>;
+    const Child = jest.fn(() => <div />) as FC<any>;
     render(
       <ListField name="x">
         <Child name="$" />