diff --git a/components/table/__tests__/Table.expand.test.js b/components/table/__tests__/Table.expand.test.js
index 858a834ec0..652679082a 100644
--- a/components/table/__tests__/Table.expand.test.js
+++ b/components/table/__tests__/Table.expand.test.js
@@ -1,6 +1,6 @@
 /* eslint-disable react/no-multi-comp */
 import React from 'react';
-import { mount } from 'enzyme';
+import { render, fireEvent } from '../../../tests/utils';
 import Table from '..';
 
 const columns = [
@@ -39,13 +39,13 @@ const data = [
 
 describe('Table.expand', () => {
   it('click to expand', () => {
-    const wrapper = mount(<Table columns={columns} dataSource={data} />);
-    wrapper.find('.ant-table-row-expand-icon').last().simulate('click');
-    expect(wrapper.render()).toMatchSnapshot();
+    const { container, asFragment } = render(<Table columns={columns} dataSource={data} />);
+    fireEvent.click(container.querySelector('.ant-table-row-expand-icon'));
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('expandRowByClick should not block click icon', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table
         columns={columns}
         dataSource={[John, Jim]}
@@ -55,26 +55,15 @@ describe('Table.expand', () => {
         }}
       />,
     );
+    fireEvent.click(container.querySelector('.ant-table-row-expand-icon'));
+    expect(container.querySelector('.ant-table-row-expand-icon-expanded')).toBeTruthy();
 
-    wrapper.find('.ant-table-row-expand-icon').first().simulate('click');
-    expect(
-      wrapper
-        .find('.ant-table-row-expand-icon')
-        .first()
-        .hasClass('ant-table-row-expand-icon-expanded'),
-    ).toBeTruthy();
-
-    wrapper.find('.ant-table-row-expand-icon').first().simulate('click');
-    expect(
-      wrapper
-        .find('.ant-table-row-expand-icon')
-        .first()
-        .hasClass('ant-table-row-expand-icon-collapsed'),
-    ).toBeTruthy();
+    fireEvent.click(container.querySelector('.ant-table-row-expand-icon'));
+    expect(container.querySelector('.ant-table-row-expand-icon-collapsed')).toBeTruthy();
   });
 
   it('show expandIcon', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table
         columns={[{ dataIndex: 'key' }]}
         dataSource={[{ key: 233 }]}
@@ -83,23 +72,19 @@ describe('Table.expand', () => {
         }}
       />,
     );
-
-    expect(wrapper.find('.expand-icon')).toHaveLength(1);
+    expect(container.querySelectorAll('.expand-icon')).toHaveLength(1);
   });
 
   it('row indent padding should be 0px when indentSize defined as 0', () => {
-    const wrapper = mount(<Table indentSize={0} columns={columns} dataSource={data} />);
-    const button = wrapper.find('.ant-table-row-expand-icon').at(0);
-    button.simulate('click');
-    expect(wrapper.find('.indent-level-1').at(0).prop('style')).toHaveProperty(
-      'paddingLeft',
-      '0px',
-    );
+    const { container } = render(<Table indentSize={0} columns={columns} dataSource={data} />);
+
+    fireEvent.click(container.querySelector('.ant-table-row-expand-icon'));
+    expect(container.querySelector('.indent-level-1').style.paddingLeft).toEqual('0px');
   });
 
   describe('expandIconColumnIndex', () => {
     it('basic', () => {
-      const wrapper = mount(
+      const { container } = render(
         <Table
           columns={[{ dataIndex: 'key' }]}
           dataSource={[{ key: 'bamboo' }]}
@@ -110,12 +95,13 @@ describe('Table.expand', () => {
         />,
       );
 
-      expect(wrapper.find('td').at(0).text()).toEqual('bamboo');
-      expect(wrapper.find('td').at(1).find('.ant-table-row-expand-icon').length).toBeTruthy();
+      const tdNodeList = container.querySelectorAll('td');
+      expect(tdNodeList[0].textContent).toEqual('bamboo');
+      expect(tdNodeList[1].querySelector('.ant-table-row-expand-icon')).toBeTruthy();
     });
 
     it('work with selection', () => {
-      const wrapper = mount(
+      const { container } = render(
         <Table
           columns={[{ dataIndex: 'key' }]}
           dataSource={[{ key: 'bamboo' }]}
@@ -126,10 +112,10 @@ describe('Table.expand', () => {
           rowSelection={{}}
         />,
       );
-
-      expect(wrapper.find('td').at(0).find('.ant-checkbox-input').length).toBeTruthy();
-      expect(wrapper.find('td').at(1).text()).toEqual('bamboo');
-      expect(wrapper.find('td').at(2).find('.ant-table-row-expand-icon').length).toBeTruthy();
+      const tdNodeList = container.querySelectorAll('td');
+      expect(tdNodeList[0].querySelector('.ant-checkbox-input')).toBeTruthy();
+      expect(tdNodeList[1].textContent).toEqual('bamboo');
+      expect(tdNodeList[2].querySelector('.ant-table-row-expand-icon')).toBeTruthy();
     });
   });
 });
diff --git a/components/table/__tests__/Table.filter.test.js b/components/table/__tests__/Table.filter.test.js
index 569c6badfa..40555d3053 100644
--- a/components/table/__tests__/Table.filter.test.js
+++ b/components/table/__tests__/Table.filter.test.js
@@ -1,17 +1,13 @@
 /* eslint-disable react/no-multi-comp */
 import React from 'react';
-import { mount } from 'enzyme';
 import { act } from 'react-dom/test-utils';
-import { render, fireEvent } from '../../../tests/utils';
+import { render, fireEvent, waitFor } from '../../../tests/utils';
 import Table from '..';
 import Input from '../../input';
 import Tooltip from '../../tooltip';
 import Button from '../../button';
 import Select from '../../select';
-import Tree from '../../tree';
 import ConfigProvider from '../../config-provider';
-import Checkbox from '../../checkbox';
-import Menu from '../../menu';
 
 // https://github.com/Semantic-Org/Semantic-UI-React/blob/72c45080e4f20b531fda2e3e430e384083d6766b/test/specs/modules/Dropdown/Dropdown-test.js#L73
 const nativeEvent = { nativeEvent: { stopImmediatePropagation: () => {} } };
@@ -58,45 +54,55 @@ describe('Table.filter', () => {
     return <Table columns={[column]} dataSource={data} pagination={false} {...props} />;
   }
 
-  function renderedNames(wrapper) {
-    return wrapper.find('BodyRow').map(row => row.props().record.name);
+  function renderedNames(container) {
+    const namesList = [];
+    container
+      .querySelector('.ant-table-tbody')
+      .querySelectorAll('tr')
+      .forEach(tr => {
+        namesList.push(tr.querySelector('td').textContent);
+      });
+    return namesList;
   }
 
   it('not show filter icon when undefined', () => {
     const noFilterColumn = { ...column, filters: undefined };
     delete noFilterColumn.onFilter;
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [noFilterColumn],
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-column')).toHaveLength(0);
+    expect(container.querySelectorAll('.ant-table-filter-column')).toHaveLength(0);
   });
 
   // https://github.com/ant-design/ant-design/issues/26988
   it('not show filter icon when filter and filterDropdown is undefined', () => {
     const noFilterColumn = { ...column, filters: undefined, filterDropdown: undefined };
     delete noFilterColumn.onFilter;
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [noFilterColumn],
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-column')).toHaveLength(0);
+    expect(container.querySelectorAll('.ant-table-filter-column')).toHaveLength(0);
   });
 
   it('renders filter correctly', () => {
-    const wrapper = mount(createTable());
+    const { asFragment } = render(createTable());
 
-    expect(wrapper.render()).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
-  it('renders menu correctly', () => {
-    const wrapper = mount(createTable());
-    const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(dropdownWrapper.render()).toMatchSnapshot();
+  // async await 解决 Warning: An update to Item ran an effect, but was not wrapped in act(...).
+  it('renders menu correctly', async () => {
+    const { container } = render(createTable());
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
+    await waitFor(() =>
+      expect(container.querySelector('.ant-table-filter-dropdown')).toMatchSnapshot(),
+    );
   });
 
   it('renders empty menu correctly', () => {
@@ -127,8 +133,8 @@ describe('Table.filter', () => {
     jest.useRealTimers();
   });
 
-  it('renders radio filter correctly', () => {
-    const wrapper = mount(
+  it('renders radio filter correctly', async () => {
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -138,13 +144,15 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(dropdownWrapper.render()).toMatchSnapshot();
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
+    await waitFor(() =>
+      expect(container.querySelector('.ant-table-filter-dropdown')).toMatchSnapshot(),
+    );
   });
 
-  it('renders custom content correctly', () => {
+  it('renders custom content correctly', async () => {
     const filter = <div className="custom-filter-dropdown">custom filter</div>;
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -155,35 +163,42 @@ describe('Table.filter', () => {
       }),
     );
 
-    const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(dropdownWrapper.render()).toMatchSnapshot();
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
+    await waitFor(() =>
+      expect(container.querySelector('.ant-table-filter-dropdown')).toMatchSnapshot(),
+    );
   });
 
   it('override custom filter correctly', () => {
-    const filter = ({ prefixCls, setSelectedKeys, confirm, clearFilters }) => (
-      <div className={`${prefixCls}-view`} id="customFilter">
-        <span onClick={() => setSelectedKeys([42])} id="setSelectedKeys">
-          setSelectedKeys
-        </span>
-        <span onClick={() => confirm()} id="confirm">
-          Confirm
-        </span>
-        <span onClick={() => clearFilters()} id="reset">
-          Reset
-        </span>
-        <span
-          onClick={() => {
-            setSelectedKeys([43]);
-            confirm();
-          }}
-          id="simulateOnSelect"
-        >
-          SimulateOnSelect
-        </span>
-      </div>
-    );
+    let renderSelectedKeys = null;
+    const filter = ({ prefixCls, setSelectedKeys, selectedKeys, confirm, clearFilters }) => {
+      renderSelectedKeys = selectedKeys;
 
-    const wrapper = mount(
+      return (
+        <div className={`${prefixCls}-view`} id="customFilter">
+          <span onClick={() => setSelectedKeys([42])} id="setSelectedKeys">
+            setSelectedKeys
+          </span>
+          <span onClick={() => confirm()} id="confirm">
+            Confirm
+          </span>
+          <span onClick={() => clearFilters()} id="reset">
+            Reset
+          </span>
+          <span
+            onClick={() => {
+              setSelectedKeys([43]);
+              confirm();
+            }}
+            id="simulateOnSelect"
+          >
+            SimulateOnSelect
+          </span>
+        </div>
+      );
+    };
+
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -194,39 +209,37 @@ describe('Table.filter', () => {
       }),
     );
 
-    function getFilterMenu() {
-      return wrapper.find('FilterDropdown');
-    }
-
     // check if renderer well
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-    expect(wrapper.find('#customFilter')).toMatchSnapshot();
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
+    expect(container.querySelector('#customFilter')).toMatchSnapshot();
 
     // try to use reset btn
-    expect(getFilterMenu().props().filterState.filteredKeys).toBeFalsy();
-    wrapper.find('#setSelectedKeys').simulate('click');
-    wrapper.find('#confirm').simulate('click');
-    expect(getFilterMenu().props().filterState.filteredKeys).toEqual([42]);
-    wrapper.find('#reset').simulate('click');
-    wrapper.find('#confirm').simulate('click');
-    expect(getFilterMenu().props().filterState.filteredKeys).toBeFalsy();
+    expect(renderSelectedKeys).toHaveLength(0);
+    fireEvent.click(container.querySelector('#setSelectedKeys'));
+    fireEvent.click(container.querySelector('#confirm'));
+    expect(renderSelectedKeys).toEqual([42]);
+
+    // Reset
+    fireEvent.click(container.querySelector('#reset'));
+    fireEvent.click(container.querySelector('#confirm'));
+    expect(renderSelectedKeys).toHaveLength(0);
 
     // try to use confirm btn
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-    wrapper.find('#setSelectedKeys').simulate('click');
-    expect(getFilterMenu().find('Dropdown').first().props().visible).toBeTruthy();
-    wrapper.find('#confirm').simulate('click');
-    expect(getFilterMenu().props().filterState.filteredKeys).toEqual([42]);
-    expect(getFilterMenu().find('Dropdown').first().props().visible).toBeFalsy();
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('#setSelectedKeys'));
+    expect(container.querySelector('.ant-dropdown-open')).toBeTruthy();
+    fireEvent.click(container.querySelector('#confirm'));
+    expect(renderSelectedKeys).toEqual([42]);
+    expect(container.querySelector('.ant-dropdown-open')).toBeFalsy();
 
     // Simulate onSelect, setSelectedKeys & confirm
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-    wrapper.find('#simulateOnSelect').simulate('click');
-    expect(getFilterMenu().props().filterState.filteredKeys).toEqual([43]);
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('#simulateOnSelect'));
+    expect(renderSelectedKeys).toEqual([43]);
   });
 
   it('can be controlled by filterDropdownVisible', () => {
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [
           {
@@ -237,48 +250,72 @@ describe('Table.filter', () => {
       }),
     );
 
-    let dropdown = wrapper.find('Dropdown').first();
-    expect(dropdown.props().visible).toBe(true);
+    expect(container.querySelector('.ant-dropdown-open')).toBeTruthy();
 
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          filterDropdownVisible: false,
-        },
-      ],
-    });
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            filterDropdownVisible: false,
+          },
+        ],
+      }),
+    );
 
-    dropdown = wrapper.find('Dropdown').first();
-    expect(dropdown.props().visible).toBe(false);
+    expect(container.querySelector('.ant-dropdown-open')).toBeFalsy();
   });
 
   it('if the filter is visible it should ignore the selectedKeys changes', () => {
-    const wrapper = mount(
-      createTable({
-        columns: [
-          {
-            ...column,
-            filterDropdownVisible: true,
-          },
-        ],
-      }),
+    const myColumn = {
+      title: 'Name',
+      dataIndex: 'name',
+      filters: [{ text: 'J', value: 'J' }],
+      onFilter: (value, record) => record.name.includes(value),
+    };
+
+    const tableProps = {
+      columns: [
+        {
+          ...myColumn,
+          filterDropdownVisible: true,
+        },
+      ],
+    };
+
+    const { container, rerender } = render(createTable(tableProps));
+
+    const checkboxList = container
+      .querySelector('.ant-table-filter-dropdown')
+      .querySelectorAll('input[type="checkbox"]');
+    expect(checkboxList.length).toBeTruthy();
+    checkboxList.forEach(checkbox => {
+      expect(checkbox.checkbox).toBeFalsy();
+    });
+
+    fireEvent.click(
+      container.querySelector('.ant-table-filter-dropdown').querySelector('input[type="checkbox"]'),
+    );
+    fireEvent.click(
+      container
+        .querySelector('.ant-table-filter-dropdown')
+        .querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'),
     );
 
-    expect(wrapper.find('FilterDropdown').props().filterState.filteredKeys).toBeFalsy();
-    wrapper.find('FilterDropdown').find('input[type="checkbox"]').first().simulate('click');
-    wrapper
-      .find('FilterDropdown')
-      .find('.ant-table-filter-dropdown-btns .ant-btn-primary')
-      .simulate('click');
-    expect(wrapper.find('FilterDropdown').props().filterState.filteredKeys).toEqual(['boy']);
-    wrapper.setProps({ dataSource: [...data, { key: 999, name: 'Chris' }] });
-    expect(wrapper.find('FilterDropdown').props().filterState.filteredKeys).toEqual(['boy']);
+    expect(container.querySelectorAll('tbody tr')).toHaveLength(2);
+
+    rerender(
+      createTable({
+        ...tableProps,
+        dataSource: [...data, { key: 999, name: 'Jason' }],
+      }),
+    );
+    expect(container.querySelectorAll('tbody tr')).toHaveLength(3);
   });
 
   it('fires change event when visible change', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -288,14 +325,12 @@ describe('Table.filter', () => {
         ],
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
     expect(handleChange).toHaveBeenCalledWith(true);
   });
 
   it('can be controlled by filteredValue', () => {
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [
           {
@@ -306,48 +341,62 @@ describe('Table.filter', () => {
       }),
     );
 
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          filteredValue: [],
-        },
-      ],
-    });
-    expect(wrapper.find('tbody tr').length).toBe(4);
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            filteredValue: [],
+          },
+        ],
+      }),
+    );
+
+    expect(container.querySelectorAll('tbody tr').length).toBe(4);
   });
 
   it('should handle filteredValue and non-array filterValue as expected', () => {
-    const wrapper = mount(
+    let filterKeys = new Set();
+
+    const { rerender } = render(
       createTable({
         columns: [
           {
             ...column,
             filteredValue: ['Lucy', 12, true],
+            onFilter: value => {
+              filterKeys.add(value);
+              return false;
+            },
           },
         ],
       }),
     );
-    function getFilterMenu() {
-      return wrapper.find('FilterDropdown');
-    }
 
-    expect(getFilterMenu().props().filterState.filteredKeys).toEqual(['Lucy', '12', 'true']);
+    expect(Array.from(filterKeys)).toEqual(['Lucy', '12', 'true']);
 
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          filteredValue: null,
-        },
-      ],
-    });
-    expect(getFilterMenu().props().filterState.filteredKeys).toEqual(null);
+    filterKeys = new Set();
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            filteredValue: null,
+            onFilter: value => {
+              filterKeys.add(value);
+              return true;
+            },
+          },
+        ],
+      }),
+    );
+    expect(Array.from(filterKeys)).toHaveLength(0);
   });
 
   it('can be controlled by filteredValue null', () => {
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [
           {
@@ -358,21 +407,26 @@ describe('Table.filter', () => {
       }),
     );
 
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          filteredValue: null,
-        },
-      ],
-    });
-    expect(wrapper.find('tbody tr').length).toBe(4);
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            filteredValue: null,
+          },
+        ],
+      }),
+    );
+
+    expect(container.querySelectorAll('tbody tr').length).toBe(4);
   });
 
+  // Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('render checked of checkbox correctly controlled by filteredValue', () => {
     ['Lucy', 23, false].forEach(val => {
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -384,12 +438,15 @@ describe('Table.filter', () => {
         }),
       );
 
-      wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-
-      expect(wrapper.find('FilterDropdown').find('Checkbox').at(0).props().checked).toEqual(true);
+      fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+      expect(
+        container
+          .querySelector('.ant-table-filter-dropdown')
+          .querySelectorAll('.ant-checkbox-input')[0].checked,
+      ).toEqual(true);
     });
 
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -400,13 +457,17 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
 
-    expect(wrapper.find('FilterDropdown').find('Checkbox').at(0).props().checked).toEqual(false);
+    expect(
+      container
+        .querySelector('.ant-table-filter-dropdown')
+        .querySelectorAll('.ant-checkbox-input')[0].checked,
+    ).toEqual(false);
   });
 
   it('can read defaults from defaultFilteredValue', () => {
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [
           {
@@ -416,56 +477,61 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    expect(wrapper.find('tbody tr').text()).toBe('Lucy');
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+    expect(container.querySelector('tbody tr').textContent).toBe('Lucy');
 
     // Should properly ignore further defaultFilteredValue changes
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          defaultFilteredValue: [],
-        },
-      ],
-    });
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    expect(wrapper.find('tbody tr').text()).toBe('Lucy');
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            defaultFilteredValue: [],
+          },
+        ],
+      }),
+    );
+
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+    expect(container.querySelector('tbody tr').textContent).toBe('Lucy');
 
     // Should properly be overidden by non-null filteredValue
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          defaultFilteredValue: ['Lucy'],
-          filteredValue: ['Tom'],
-        },
-      ],
-    });
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    expect(wrapper.find('tbody tr').text()).toBe('Tom');
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            defaultFilteredValue: ['Lucy'],
+            filteredValue: ['Tom'],
+          },
+        ],
+      }),
+    );
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+    expect(container.querySelector('tbody tr').textContent).toBe('Tom');
 
     // Should properly be overidden by a null filteredValue
-    wrapper.setProps({
-      columns: [
-        {
-          ...column,
-          defaultFilteredValue: ['Lucy'],
-          filteredValue: null,
-        },
-      ],
-    });
-    expect(wrapper.find('tbody tr').length).toBe(4);
+    rerender(
+      createTable({
+        columns: [
+          {
+            ...column,
+            defaultFilteredValue: ['Lucy'],
+            filteredValue: null,
+          },
+        ],
+      }),
+    );
+    expect(container.querySelectorAll('tbody tr').length).toBe(4);
   });
 
+  //  Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('fires change event', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(createTable({ onChange: handleChange }));
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('FilterDropdown').find('MenuItem').first().simulate('click');
-    wrapper
-      .find('FilterDropdown')
-      .find('.ant-table-filter-dropdown-btns .ant-btn-primary')
-      .simulate('click');
+    const { container } = render(createTable({ onChange: handleChange }));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[0]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
     expect(handleChange).toHaveBeenCalledWith(
       {},
       { name: ['boy'] },
@@ -477,32 +543,27 @@ describe('Table.filter', () => {
     );
   });
 
-  it('fires pagination change event', () => {
+  it('fires pagination change event', async () => {
     const onPaginationChange = jest.fn();
-    const wrapper = mount(createTable({ pagination: { onChange: onPaginationChange } }));
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('FilterDropdown').find('MenuItem').first().simulate('click');
-    wrapper
-      .find('FilterDropdown')
-      .find('.ant-table-filter-dropdown-btns .ant-btn-primary')
-      .simulate('click');
-
-    expect(onPaginationChange).toHaveBeenCalledWith(1, 10);
+    const { container } = render(createTable({ pagination: { onChange: onPaginationChange } }));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[0]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    await waitFor(() => expect(onPaginationChange).toHaveBeenCalledWith(1, 10));
   });
 
-  it('should not fire change event when close filterDropdown without changing anything', () => {
+  it('should not fire change event when close filterDropdown without changing anything', async () => {
     const handleChange = jest.fn();
-    const wrapper = mount(createTable({ onChange: handleChange }));
+    const { container } = render(createTable({ onChange: handleChange }));
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-
-    expect(handleChange).not.toHaveBeenCalled();
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    await waitFor(() => expect(handleChange).not.toHaveBeenCalled());
   });
 
-  it('should not fire change event when close a filtered filterDropdown without changing anything', () => {
+  it('should not fire change event when close a filtered filterDropdown without changing anything', async () => {
     const handleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange: handleChange,
         columns: [
@@ -513,14 +574,12 @@ describe('Table.filter', () => {
         ],
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-
-    expect(handleChange).not.toHaveBeenCalled();
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    await waitFor(() => expect(handleChange).not.toHaveBeenCalled());
   });
 
-  it('three levels menu', () => {
+  it('three levels menu', async () => {
     const onChange = jest.fn();
     const filters = [
       { text: 'Upper', value: 'Upper' },
@@ -543,7 +602,7 @@ describe('Table.filter', () => {
         ],
       },
     ];
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -556,13 +615,13 @@ describe('Table.filter', () => {
     );
     jest.useFakeTimers();
 
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
 
     // Open
-    wrapper.find('.ant-table-filter-trigger').simulate('click');
+    fireEvent.click(container.querySelector('.ant-table-filter-trigger'));
 
     function getFilterMenu() {
-      return wrapper.find('FilterDropdown');
+      return container.querySelector('.ant-table-filter-dropdown');
     }
 
     // Seems raf not trigger when in useEffect for async update
@@ -571,87 +630,109 @@ describe('Table.filter', () => {
       for (let i = 0; i < 3; i += 1) {
         act(() => {
           jest.runAllTimers();
-          wrapper.update();
         });
       }
     }
 
     // Open Level2
-    getFilterMenu().find('div.ant-dropdown-menu-submenu-title').at(0).simulate('mouseEnter');
+    fireEvent.mouseEnter(
+      getFilterMenu().querySelectorAll('div.ant-dropdown-menu-submenu-title')[0],
+    );
     refreshTimer();
 
     // Open Level3
-    getFilterMenu().find('div.ant-dropdown-menu-submenu-title').at(1).simulate('mouseEnter');
+    fireEvent.mouseEnter(
+      getFilterMenu().querySelectorAll('div.ant-dropdown-menu-submenu-title')[1],
+    );
     refreshTimer();
 
     // Select Level3 value
-    getFilterMenu().find('li.ant-dropdown-menu-item').last().simulate('click');
-    getFilterMenu().find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    const items = getFilterMenu().querySelectorAll('li.ant-dropdown-menu-item');
+    fireEvent.click(items[items.length - 1]);
+    fireEvent.click(
+      getFilterMenu().querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'),
+    );
     refreshTimer();
 
+    expect(onChange).toHaveBeenCalled();
     onChange.mock.calls.forEach(([, currentFilters]) => {
       const [, val] = Object.entries(currentFilters)[0];
       expect(val).toEqual(['Jack']);
     });
 
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
+    expect(renderedNames(container)).toEqual(['Jack']);
 
-    // What's this? Is that a coverage case?
-    getFilterMenu().find('li.ant-dropdown-menu-item').last().simulate('click');
+    // What's this? Is that a coverage case? Or check a crash?
+    const latestItems = getFilterMenu().querySelectorAll('li.ant-dropdown-menu-item');
+    fireEvent.click(latestItems[latestItems.length - 1]);
 
     jest.useRealTimers();
   });
 
   describe('should support value types', () => {
+    const filterKeys = new Set();
     [
       ['Light', 93],
       ['Bamboo', false],
     ].forEach(([text, value]) => {
-      it(`${typeof value} type`, () => {
-        const onFilter = jest.fn();
+      it(`${typeof value} type`, async () => {
+        jest.useFakeTimers();
         const onChange = jest.fn();
         const filters = [{ text, value }];
-        const wrapper = mount(
+        const { container } = render(
           createTable({
             columns: [
               {
                 ...column,
                 filters,
-                onFilter,
+                onFilter: val => {
+                  expect(val).toBe(value);
+                  filterKeys.add(val);
+                  return false;
+                },
               },
             ],
             onChange,
           }),
         );
 
-        wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+        fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
 
         jest.useFakeTimers();
-        wrapper.find('MenuItem').first().simulate('click');
+
+        fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[0]);
+
         // This test can be remove if refactor
-        wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-        wrapper.update();
-
-        expect(wrapper.find('FilterDropdown').find('Checkbox').at(0).props().checked).toEqual(true);
-
-        expect(typeof wrapper.find('FilterDropdown').props().filterState.filteredKeys[0]).toEqual(
-          'string',
+        fireEvent.click(
+          container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'),
         );
-        expect(onFilter.mock.calls.length > 0).toBeTruthy();
 
-        onFilter.mock.calls.forEach(([val]) => {
-          expect(val).toBe(value);
-        });
+        await waitFor(() =>
+          expect(
+            container
+              .querySelector('.ant-table-filter-dropdown')
+              .querySelectorAll('.ant-checkbox-input')[0].checked,
+          ).toEqual(true),
+        );
+
+        expect(typeof Array.from(filterKeys)[0]).toEqual('number');
+
+        expect(Array.from(filterKeys).length > 0).toBeTruthy();
+
         onChange.mock.calls.forEach(([, currentFilters]) => {
           const [, val] = Object.entries(currentFilters)[0];
           expect(val).toEqual([value]);
         });
         // Another time of Filter show
         // https://github.com/ant-design/ant-design/issues/15593
-        wrapper.find('MenuItem').first().simulate('click');
-        expect(wrapper.find('FilterDropdown').find('Checkbox').at(0).props().checked).toEqual(
-          false,
-        );
+
+        fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[0]);
+
+        expect(
+          container
+            .querySelector('.ant-table-filter-dropdown')
+            .querySelectorAll('.ant-checkbox-input')[0].checked,
+        ).toEqual(false);
         jest.useRealTimers();
       });
     });
@@ -659,7 +740,6 @@ describe('Table.filter', () => {
 
   it('works with JSX in controlled mode', () => {
     const { Column } = Table;
-
     class App extends React.Component {
       state = {
         filters: {},
@@ -689,24 +769,25 @@ describe('Table.filter', () => {
       }
     }
 
-    const wrapper = mount(<App />);
+    const { container } = render(<App />);
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    expect(wrapper.find('Dropdown').first().props().visible).toBe(true);
-    wrapper.find('MenuItem').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-    wrapper.update();
-    expect(wrapper.find('Dropdown').first().props().visible).toBe(false);
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    expect(container.querySelector('.ant-dropdown-open')).toBeTruthy();
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').simulate('click');
-    wrapper.update();
-    expect(wrapper.find('Dropdown').first().props().visible).toBe(true);
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    expect(wrapper.find('Dropdown').first().props().visible).toBe(false);
+    fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[0]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    expect(renderedNames(container)).toEqual(['Jack']);
+    expect(container.querySelector('.ant-dropdown-open')).toBeFalsy();
+
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link'));
+
+    expect(container.querySelector('.ant-dropdown-open')).toBeTruthy();
+    expect(renderedNames(container)).toEqual(['Jack']);
+
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(container.querySelector('.ant-dropdown-open')).toBeFalsy();
   });
 
   it('works with grouping columns in controlled mode', () => {
@@ -740,14 +821,15 @@ describe('Table.filter', () => {
       { key: 2, name: 'Tom', age: 21 },
       { key: 3, name: 'Jerry', age: 22 },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={testData} />);
+    const { container } = render(<Table columns={columns} dataSource={testData} />);
 
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
+    expect(renderedNames(container)).toEqual(['Jack']);
   });
 
+  // Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('confirm filter when dropdown hidden', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -761,10 +843,9 @@ describe('Table.filter', () => {
         onChange: handleChange,
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-dropdown-menu-item').first().simulate('click');
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
 
     expect(handleChange).toHaveBeenCalled();
     expect(handleChange.mock.calls[0][3].currentDataSource.length).toBe(1);
@@ -774,7 +855,7 @@ describe('Table.filter', () => {
     const filterIcon = filtered => (
       <span className="customize-icon">{filtered ? 'filtered' : 'unfiltered'}</span>
     );
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -784,21 +865,15 @@ describe('Table.filter', () => {
         ],
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-dropdown-menu-item').first().simulate('click');
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    expect(wrapper.find('.customize-icon').render()).toMatchSnapshot();
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-dropdown-menu-item').first().simulate('click');
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    expect(wrapper.find('.customize-icon').render()).toMatchSnapshot();
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    expect(container.querySelector('.customize-icon')).toMatchSnapshot();
   });
 
   it('renders custom filter icon as string correctly', () => {
     const filterIcon = () => 'string';
-    const wrapper = mount(
+    const { asFragment } = render(
       createTable({
         columns: [
           {
@@ -808,7 +883,7 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.render()).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('renders custom filter icon with right Tooltip title', () => {
@@ -817,7 +892,7 @@ describe('Table.filter', () => {
         Tooltip
       </Tooltip>
     );
-    const wrapper = mount(
+    const { asFragment } = render(
       createTable({
         columns: [
           {
@@ -827,12 +902,12 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.render()).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('renders custom filter icon as ReactNode', () => {
     const filterIcon = <span className="customize-icon" />;
-    const wrapper = mount(
+    const { container, asFragment } = render(
       createTable({
         columns: [
           {
@@ -842,8 +917,8 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.render()).toMatchSnapshot();
-    expect(wrapper.find('span.customize-icon').length).toBe(1);
+    expect(asFragment().firstChild).toMatchSnapshot();
+    expect(container.querySelector('span.customize-icon')).toBeTruthy();
   });
 
   // https://github.com/ant-design/ant-design/issues/13028
@@ -884,14 +959,13 @@ describe('Table.filter', () => {
       }
     }
 
-    const wrapper = mount(<Demo />);
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-input').simulate('change', { target: { value: 'test' } });
-    expect(wrapper.find('.ant-input').instance().value).toBe('test');
-    wrapper.find('.ant-btn').simulate('click');
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    expect(wrapper.find('.ant-input').instance().value).toBe('');
+    const { container } = render(<Demo />);
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.change(container.querySelector('.ant-input'), { target: { value: 'test' } });
+    expect(container.querySelector('.ant-input').value).toBe('test');
+    fireEvent.click(container.querySelector('.ant-btn'));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    expect(container.querySelector('.ant-input').value).toBe('');
   });
 
   // https://github.com/ant-design/ant-design/issues/17833
@@ -900,7 +974,7 @@ describe('Table.filter', () => {
     const filterDropdown = ({ setSelectedKeys }) => (
       <input onChange={e => setSelectedKeys([e.target.value])} />
     );
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange,
         columns: [
@@ -913,12 +987,9 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper
-      .find('input')
-      .first()
-      .simulate('change', { target: { value: 'whatevervalue' } });
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.change(container.querySelector('input'), { target: { value: 'whatevervalue' } });
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
     expect(onChange).not.toHaveBeenCalled();
   });
 
@@ -932,7 +1003,7 @@ describe('Table.filter', () => {
         </button>
       </div>
     );
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange,
         columns: [
@@ -945,12 +1016,11 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper
-      .find('input')
-      .first()
-      .simulate('change', { target: { value: 'test' } });
-    wrapper.find('.confirm-btn').first().simulate('click');
+
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.change(container.querySelector('input'), { target: { value: 'test' } });
+    fireEvent.click(container.querySelector('.confirm-btn'));
+
     expect(onChange).toHaveBeenCalled();
     onChange.mock.calls.forEach(([, currentFilters]) => {
       const [, val] = Object.entries(currentFilters)[0];
@@ -959,8 +1029,11 @@ describe('Table.filter', () => {
   });
 
   it('should work as expected with complex custom filterDropdown', () => {
+    let renderSelectedKeys = null;
     const onChange = jest.fn();
+
     const filterDropdown = ({ setSelectedKeys, selectedKeys, confirm }) => {
+      renderSelectedKeys = selectedKeys;
       const handleChange = selectedValues => {
         setSelectedKeys(selectedValues);
       };
@@ -1013,7 +1086,7 @@ describe('Table.filter', () => {
         label: 'Not Identified',
       },
     ];
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange,
         columns: [
@@ -1027,11 +1100,13 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.find('FilterDropdown').props().filterState.filteredKeys).toEqual(filteredValue);
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    wrapper.find('.ant-select-item-option').first().simulate('click');
-    wrapper.find('.confirm-btn').first().simulate('click');
+
+    expect(renderSelectedKeys).toEqual(filteredValue);
+
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    fireEvent.click(container.querySelector('.ant-select-item-option'));
+    fireEvent.click(container.querySelector('.confirm-btn'));
     expect(onChange).toHaveBeenCalled();
     onChange.mock.calls.forEach(([, currentFilters]) => {
       const [, val] = Object.entries(currentFilters)[0];
@@ -1065,7 +1140,7 @@ describe('Table.filter', () => {
       />
     );
 
-    const wrapper = mount(
+    const { container, rerender } = render(
       <Test
         filters={[
           {
@@ -1076,31 +1151,33 @@ describe('Table.filter', () => {
       />,
     );
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('MenuItem').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    // Warning: An update to Item ran an effect, but was not wrapped in act(...).
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
     expect(onChange).toHaveBeenCalled();
     onChange.mockReset();
     expect(onChange).not.toHaveBeenCalled();
+    rerender(
+      <Test
+        filters={[
+          {
+            text: 'Jim',
+            value: 'Jim',
+          },
+        ]}
+      />,
+    );
 
-    wrapper.setProps({
-      filters: [
-        {
-          text: 'Jim',
-          value: 'Jim',
-        },
-      ],
-    });
-
-    wrapper.find('MenuItem').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
     expect(onChange).toHaveBeenCalled();
   });
 
   it('should support getPopupContainer', () => {
     const getPopupContainer = jest.fn(node => node.parentNode);
 
-    mount(
+    render(
       createTable({
         columns: [
           {
@@ -1117,7 +1194,7 @@ describe('Table.filter', () => {
   it('should support getPopupContainer from ConfigProvider', () => {
     const getPopupContainer = jest.fn(node => node.parentNode);
 
-    mount(
+    render(
       <ConfigProvider getPopupContainer={getPopupContainer}>
         {createTable({
           columns: [
@@ -1154,7 +1231,7 @@ describe('Table.filter', () => {
       />
     );
 
-    mount(<Test />);
+    render(<Test />);
     expect(filterDropdownMock).toHaveBeenCalledWith(
       expect.objectContaining({
         visible: false,
@@ -1184,16 +1261,15 @@ describe('Table.filter', () => {
       />
     );
 
-    const wrapper = mount(<Test />);
+    const { container } = render(<Test />);
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
     expect(filterDropdownMock).toHaveBeenCalledWith(
       expect.objectContaining({
         visible: true,
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
     expect(filterDropdownMock).toHaveBeenCalledWith(
       expect.objectContaining({
         visible: false,
@@ -1203,17 +1279,17 @@ describe('Table.filter', () => {
 
   it('should reset pagination after filter', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange: handleChange,
         dataSource: longData,
         pagination: true,
       }),
     );
-
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('MenuItem').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    // Warning: An update to Item ran an effect, but was not wrapped in act(...).
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
 
     expect(handleChange).toHaveBeenCalledWith(
       {
@@ -1227,12 +1303,12 @@ describe('Table.filter', () => {
         action: 'filter',
       },
     );
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(0);
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(0);
   });
 
   it('should keep pagination current after filter', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange: handleChange,
         dataSource: longData,
@@ -1241,11 +1317,12 @@ describe('Table.filter', () => {
         },
       }),
     );
-    expect(wrapper.find('.ant-pagination-item-active').text()).toBe('3');
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('MenuItem').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    expect(container.querySelector('.ant-pagination-item-active').textContent).toBe('3');
+    // Warning: An update to Item ran an effect, but was not wrapped in act(...).
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
 
     expect(handleChange).toHaveBeenCalledWith(
       {
@@ -1286,14 +1363,14 @@ describe('Table.filter', () => {
       }
     }
 
-    mount(<TestTable />);
+    render(<TestTable />);
   });
 
   // https://github.com/ant-design/ant-design/issues/20854
   it('Not cache for onChange state', () => {
     const onChange = jest.fn();
 
-    const wrapper = mount(
+    const { container } = render(
       <Table
         columns={[
           {
@@ -1316,7 +1393,7 @@ describe('Table.filter', () => {
     );
 
     // Sort it
-    wrapper.find('.ant-table-column-sorters').simulate('click');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'), nativeEvent);
     expect(onChange).toHaveBeenCalledWith(
       expect.anything(),
       {
@@ -1337,9 +1414,11 @@ describe('Table.filter', () => {
 
     // Filter it
     onChange.mockReset();
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-    wrapper.find('.ant-dropdown-menu-item').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    // Warning: An update to Item ran an effect, but was not wrapped in act(...).
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'), nativeEvent);
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+
     expect(onChange).toHaveBeenCalledWith(
       expect.anything(),
       {
@@ -1360,7 +1439,7 @@ describe('Table.filter', () => {
   });
 
   it('locale should work', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         locale: { filterConfirm: 'Bamboo' },
         columns: [
@@ -1374,22 +1453,22 @@ describe('Table.filter', () => {
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').text()).toEqual(
-      'Bamboo',
-    );
-    expect(wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').last().text()).toEqual(
-      'Reset',
-    );
-    expect(wrapper.find('.ant-table-filter-dropdown-checkall').first().text()).toEqual(
+    expect(
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary').textContent,
+    ).toEqual('Bamboo');
+    expect(
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').textContent,
+    ).toEqual('Reset');
+    expect(container.querySelector('.ant-table-filter-dropdown-checkall').textContent).toEqual(
       'Select all items',
     );
-    expect(wrapper.find('.ant-input').getDOMNode().getAttribute('placeholder')).toEqual(
+    expect(container.querySelector('.ant-input').getAttribute('placeholder')).toEqual(
       'Search in filters',
     );
   });
 
   it('filtered should work', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -1400,11 +1479,13 @@ describe('Table.filter', () => {
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-trigger').hasClass('active')).toBeTruthy();
+    expect(
+      container.querySelector('.ant-table-filter-trigger').className.includes('active'),
+    ).toBeTruthy();
   });
 
   it('filteredValue with empty array should not active the filtered icon', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -1415,21 +1496,23 @@ describe('Table.filter', () => {
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-trigger').hasClass('active')).toBeFalsy();
+    expect(
+      container.querySelector('.ant-table-filter-trigger').className.includes('active'),
+    ).toBeFalsy();
   });
 
   it('with onFilter', () => {
     const onFilter = jest.fn((value, record) => record.key === value);
     const columns = [{ dataIndex: 'key', filteredValue: [5], onFilter }];
     const testData = [{ key: 1 }, { key: 3 }, { key: 5 }];
-    const wrapper = mount(<Table columns={columns} dataSource={testData} />);
+    const { container } = render(<Table columns={columns} dataSource={testData} />);
 
     expect(onFilter).toHaveBeenCalled();
-    expect(wrapper.find('tbody tr')).toHaveLength(1);
+    expect(container.querySelectorAll('tbody tr')).toHaveLength(1);
   });
 
   it('jsx work', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table dataSource={data}>
         <Table.Column
           title="Name"
@@ -1444,8 +1527,8 @@ describe('Table.filter', () => {
       </Table>,
     );
 
-    expect(wrapper.find('tbody tr')).toHaveLength(1);
-    expect(wrapper.find('tbody tr td').text()).toEqual('Jack');
+    expect(container.querySelectorAll('tbody tr')).toHaveLength(1);
+    expect(container.querySelector('tbody tr td').textContent).toEqual('Jack');
   });
 
   it(`shouldn't keep status when controlled filteredValue isn't change`, () => {
@@ -1459,21 +1542,15 @@ describe('Table.filter', () => {
       ],
       onFilter: filterFn,
     };
-    const wrapper = mount(createTable({ columns: [filterControlledColumn] }));
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('FilterDropdown').find('MenuItem').first().simulate('click');
-    wrapper // close drodown
-      .find('FilterDropdown')
-      .find('.ant-table-filter-dropdown-btns .ant-btn-primary')
-      .simulate('click');
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click'); // reopen
-    const checkbox = wrapper
-      .find('FilterDropdown')
-      .find('MenuItem')
-      .first()
-      .find('Checkbox')
-      .first();
-    expect(checkbox.props().checked).toEqual(false);
+    const { container } = render(createTable({ columns: [filterControlledColumn] }));
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary')); // close drodown
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger')); // reopen
+    const checkbox = container
+      .querySelector('.ant-dropdown-menu-item')
+      .querySelector('input[type=checkbox]');
+    expect(checkbox.checked).toEqual(false);
   });
 
   it('should not trigger onChange when filters is empty', () => {
@@ -1496,12 +1573,12 @@ describe('Table.filter', () => {
         ]}
       />
     );
-    const wrapper = mount(<Test filters={[]} />);
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
+    const { container, unmount } = render(<Test filters={[]} />);
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
     expect(onChange).not.toHaveBeenCalled();
     onChange.mockReset();
-    wrapper.unmount();
+    unmount();
   });
 
   it('filters in children should render', () => {
@@ -1553,16 +1630,17 @@ describe('Table.filter', () => {
         english2: 72,
       },
     ];
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns,
         dataSource,
       }),
     );
 
-    expect(wrapper.find('.ant-table-filter-column')).toHaveLength(3);
+    expect(container.querySelectorAll('.ant-table-filter-column')).toHaveLength(3);
   });
 
+  //  Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('should pagination.current be 1 after filtering', () => {
     const onChange = jest.fn();
     const columns = [
@@ -1599,24 +1677,25 @@ describe('Table.filter', () => {
       },
     ];
 
-    const wrapper = mount(
+    const { container } = render(
       <Table onChange={onChange} rowKey="name" columns={columns} dataSource={dataSource} />,
     );
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('FilterDropdown').find('MenuItem').at(0).simulate('click');
-    wrapper.find('.ant-btn-primary').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+
     expect(onChange.mock.calls[0][0].current).toBe(1);
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
-    wrapper.find('FilterDropdown').find('MenuItem').at(1).simulate('click');
-    wrapper.find('.ant-btn-primary').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
+    fireEvent.click(container.querySelectorAll('.ant-dropdown-menu-item')[1]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
     expect(onChange.mock.calls[1][0].current).toBe(1);
   });
 
   // https://github.com/ant-design/ant-design/issues/30454
   it('should not trigger onFilterDropdownVisibleChange when call confirm({ closeDropdown: false })', () => {
     const onFilterDropdownVisibleChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -1644,17 +1723,18 @@ describe('Table.filter', () => {
       }),
     );
 
-    wrapper.find('.ant-dropdown-trigger').first().simulate('click');
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger'));
     expect(onFilterDropdownVisibleChange).toHaveBeenCalledTimes(1);
 
-    wrapper.find('#confirm-only').simulate('click');
+    fireEvent.click(container.querySelector('#confirm-only'));
     expect(onFilterDropdownVisibleChange).toHaveBeenCalledTimes(1);
 
-    wrapper.find('#confirm-and-close').simulate('click');
+    fireEvent.click(container.querySelector('#confirm-and-close'));
     expect(onFilterDropdownVisibleChange).toHaveBeenCalledTimes(2);
     expect(onFilterDropdownVisibleChange).toHaveBeenLastCalledWith(false);
   });
 
+  // Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('Column with filter and children filters properly.', () => {
     class App extends React.Component {
       state = {
@@ -1736,20 +1816,24 @@ describe('Table.filter', () => {
       }
     }
 
-    const wrapper = mount(<App />);
+    const { container } = render(<App />);
 
-    expect(wrapper.find('.ant-table-tbody .ant-table-cell').first().text()).toEqual(`${32}`);
-    wrapper.find('.ant-dropdown-trigger.ant-table-filter-trigger').simulate('click');
-    wrapper.find('.ant-dropdown-menu-item').first().simulate('click');
-    wrapper.find('.ant-btn.ant-btn-primary.ant-btn-sm').simulate('click');
-    expect(wrapper.find('.ant-table-tbody .ant-table-cell').first().text()).toEqual(`${66}`);
+    expect(container.querySelector('.ant-table-tbody .ant-table-cell').textContent).toEqual(
+      `${32}`,
+    );
+    fireEvent.click(container.querySelector('.ant-dropdown-trigger.ant-table-filter-trigger'));
+    fireEvent.click(container.querySelector('.ant-dropdown-menu-item'));
+    fireEvent.click(container.querySelector('.ant-btn.ant-btn-primary.ant-btn-sm'));
+    expect(container.querySelector('.ant-table-tbody .ant-table-cell').textContent).toEqual(
+      `${66}`,
+    );
   });
 
   describe('filter tree mode', () => {
     it('supports filter tree', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1759,19 +1843,18 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Tree).length).toBe(1);
-      expect(wrapper.find('.ant-tree-checkbox').length).toBe(5);
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-tree').length).toBe(1);
+      expect(container.querySelectorAll('.ant-tree-checkbox').length).toBe(5);
     });
 
     it('supports search input in filter tree', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1782,23 +1865,19 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Tree).length).toBe(1);
-      expect(wrapper.find(Input).length).toBe(1);
-      wrapper
-        .find(Input)
-        .find('input')
-        .simulate('change', { target: { value: '111' } });
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-tree').length).toBe(1);
+      expect(container.querySelectorAll('.ant-input').length).toBe(1);
+      fireEvent.change(container.querySelector('.ant-input'), { target: { value: '111' } });
     });
 
     it('supports search input in filter menu', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1808,23 +1887,19 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Menu).length).toBe(1);
-      expect(wrapper.find(Input).length).toBe(1);
-      wrapper
-        .find(Input)
-        .find('input')
-        .simulate('change', { target: { value: '111' } });
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-search').length).toBe(1);
+      expect(container.querySelectorAll('.ant-input').length).toBe(1);
+      fireEvent.change(container.querySelector('.ant-input'), { target: { value: '111' } });
     });
 
     it('should skip search when filters[0].text is ReactNode', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1848,25 +1923,22 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Menu).length).toBe(1);
-      expect(wrapper.find(Input).length).toBe(1);
-      expect(wrapper.find('li.ant-dropdown-menu-item').length).toBe(3);
-      wrapper
-        .find(Input)
-        .find('input')
-        .simulate('change', { target: { value: '123' } });
-      expect(wrapper.find('li.ant-dropdown-menu-item').length).toBe(2);
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-search').length).toBe(1);
+      expect(container.querySelectorAll('.ant-input').length).toBe(1);
+      expect(container.querySelectorAll('li.ant-dropdown-menu-item').length).toBe(3);
+      fireEvent.change(container.querySelector('.ant-input'), { target: { value: '123' } });
+      expect(container.querySelectorAll('li.ant-dropdown-menu-item').length).toBe(2);
     });
 
     it('should supports filterSearch has type of function', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1890,25 +1962,21 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Menu).length).toBe(1);
-      expect(wrapper.find(Input).length).toBe(1);
-      expect(wrapper.find('li.ant-dropdown-menu-item').length).toBe(3);
-      wrapper
-        .find(Input)
-        .find('input')
-        .simulate('change', { target: { value: '456' } });
-      expect(wrapper.find('li.ant-dropdown-menu-item').length).toBe(2);
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-search').length).toBe(1);
+      expect(container.querySelectorAll('.ant-input').length).toBe(1);
+      expect(container.querySelectorAll('li.ant-dropdown-menu-item').length).toBe(3);
+      fireEvent.change(container.querySelector('.ant-input'), { target: { value: '456' } });
+      expect(container.querySelectorAll('li.ant-dropdown-menu-item').length).toBe(2);
     });
 
     it('supports check all items', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1919,30 +1987,29 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Checkbox).length).toBe(1);
-      expect(wrapper.find(Checkbox).text()).toBe('Select all items');
-      expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
-      wrapper
-        .find(Checkbox)
-        .find('input')
-        .simulate('change', { target: { checked: true } });
-      expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(5);
-      wrapper
-        .find(Checkbox)
-        .find('input')
-        .simulate('change', { target: { checked: false } });
-      expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-checkall').length).toBe(1);
+      expect(container.querySelector('.ant-table-filter-dropdown-checkall').textContent).toBe(
+        'Select all items',
+      );
+      expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
+
+      // fireEvent.change(container.querySelector('.ant-table-filter-dropdown-checkall input'), { target: { checked: true } });
+      // 为什么 fireEvent.change 模拟 checkbox 触发会失败
+      fireEvent.click(container.querySelector('.ant-table-filter-dropdown-checkall'));
+      expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(5);
+
+      fireEvent.click(container.querySelector('.ant-table-filter-dropdown-checkall'));
+      expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
     });
 
     it('supports check item by selecting it', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1953,28 +2020,32 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      expect(wrapper.find(Checkbox).length).toBe(1);
-      expect(wrapper.find(Checkbox).text()).toBe('Select all items');
-      wrapper.find('.ant-tree-node-content-wrapper').at(0).simulate('click');
-      expect(wrapper.find('.ant-tree-checkbox').at(0).hasClass('ant-tree-checkbox-checked')).toBe(
-        true,
+      expect(container.querySelectorAll('.ant-table-filter-dropdown-checkall').length).toBe(1);
+      expect(container.querySelector('.ant-table-filter-dropdown-checkall').textContent).toBe(
+        'Select all items',
       );
+      fireEvent.click(container.querySelector('.ant-tree-node-content-wrapper'));
+
       expect(
-        wrapper
-          .find('.ant-table-filter-dropdown-checkall .ant-checkbox')
-          .hasClass('ant-checkbox-indeterminate'),
+        container
+          .querySelector('.ant-tree-checkbox')
+          .className.includes('ant-tree-checkbox-checked'),
+      ).toBe(true);
+      expect(
+        container
+          .querySelector('.ant-table-filter-dropdown-checkall .ant-checkbox')
+          .className.includes('ant-checkbox-indeterminate'),
       ).toBe(true);
     });
 
     it('select-all checkbox should change when all items are selected', () => {
       jest.useFakeTimers();
       jest.spyOn(console, 'error').mockImplementation(() => undefined);
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -1988,17 +2059,17 @@ describe('Table.filter', () => {
           ],
         }),
       );
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
       act(() => {
         jest.runAllTimers();
-        wrapper.update();
       });
-      wrapper.find('.ant-tree-node-content-wrapper').at(0).simulate('click');
-      wrapper.find('.ant-tree-node-content-wrapper').at(1).simulate('click');
+      fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[0]);
+      fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[1]);
+
       expect(
-        wrapper
-          .find('.ant-table-filter-dropdown-checkall .ant-checkbox')
-          .hasClass('ant-checkbox-checked'),
+        container
+          .querySelector('.ant-table-filter-dropdown-checkall .ant-checkbox')
+          .className.includes('ant-checkbox-checked'),
       ).toBe(true);
     });
   });
@@ -2006,7 +2077,7 @@ describe('Table.filter', () => {
   it('filterMultiple is false - check item', () => {
     jest.useFakeTimers();
     jest.spyOn(console, 'error').mockImplementation(() => undefined);
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -2017,35 +2088,44 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
     act(() => {
       jest.runAllTimers();
-      wrapper.update();
     });
-    expect(wrapper.find('.ant-tree-checkbox').length).toBe(5);
-    expect(wrapper.find('.ant-table-filter-dropdown-checkall').exists()).toBe(false);
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
-    wrapper.find('.ant-tree-checkbox').at(2).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(2).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    wrapper.find('.ant-tree-checkbox').at(1).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(1).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    wrapper.find('.ant-tree-checkbox').at(1).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(1).hasClass('ant-tree-checkbox-checked')).toBe(
-      false,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
+    expect(container.querySelectorAll('.ant-tree-checkbox').length).toBe(5);
+    expect(container.querySelector('.ant-table-filter-dropdown-checkall')).toBe(null);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-checkbox')[2]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[2]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-checkbox')[1]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[1]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-checkbox')[1]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[1]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(false);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
   });
 
   it('filterMultiple is false - select item', () => {
     jest.useFakeTimers();
     jest.spyOn(console, 'error').mockImplementation(() => undefined);
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -2056,34 +2136,43 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
     act(() => {
       jest.runAllTimers();
-      wrapper.update();
     });
-    expect(wrapper.find('.ant-tree-checkbox').length).toBe(5);
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
-    wrapper.find('.ant-tree-node-content-wrapper').at(2).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(2).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    wrapper.find('.ant-tree-node-content-wrapper').at(1).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(1).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    wrapper.find('.ant-tree-node-content-wrapper').at(1).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(1).hasClass('ant-tree-checkbox-checked')).toBe(
-      false,
-    );
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
+
+    expect(container.querySelectorAll('.ant-tree-checkbox').length).toBe(5);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[2]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[2]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[1]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[1]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[1]);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[1]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(false);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
   });
 
   it('should select children when select parent', () => {
     jest.useFakeTimers();
     jest.spyOn(console, 'error').mockImplementation(() => undefined);
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -2105,30 +2194,40 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
     act(() => {
       jest.runAllTimers();
-      wrapper.update();
     });
     // check parentnode
-    wrapper.find('.ant-tree-checkbox').at(2).simulate('click');
-    expect(wrapper.find('.ant-tree-checkbox').at(2).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox').at(3).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    expect(wrapper.find('.ant-tree-checkbox').at(4).hasClass('ant-tree-checkbox-checked')).toBe(
-      true,
-    );
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
-    wrapper.find('.ant-tree-checkbox').at(2).simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    wrapper.find('.ant-tree-node-content-wrapper').at(2).simulate('click');
-    wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-checkbox')[2]);
+
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[2]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[3]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+    expect(
+      container
+        .querySelectorAll('.ant-tree-checkbox')[4]
+        .className.includes('ant-tree-checkbox-checked'),
+    ).toBe(true);
+
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    expect(renderedNames(container)).toEqual(['Jack']);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-checkbox')[2]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+
+    fireEvent.click(container.querySelectorAll('.ant-tree-node-content-wrapper')[2]);
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-primary'));
+    expect(renderedNames(container)).toEqual(['Jack']);
   });
 
   it('clearFilters should support params', () => {
@@ -2144,28 +2243,34 @@ describe('Table.filter', () => {
         false,
       ],
     ];
-    const filter = ({ prefixCls, setSelectedKeys, confirm, clearFilters }) => (
-      <div className={`${prefixCls}-view`} id="customFilter">
-        {filterConfig.map(([text, id, param]) => (
-          <>
-            <span
-              onClick={() => {
-                setSelectedKeys([text]);
-                confirm();
-              }}
-              id={`set${id}`}
-            >
-              setSelectedKeys
-            </span>
-            <span onClick={() => clearFilters(param)} id={`reset${id}`}>
-              Reset
-            </span>
-          </>
-        ))}
-      </div>
-    );
 
-    const wrapper = mount(
+    let renderSelectedKeys;
+    const filter = ({ prefixCls, setSelectedKeys, selectedKeys, confirm, clearFilters }) => {
+      renderSelectedKeys = selectedKeys;
+
+      return (
+        <div className={`${prefixCls}-view`} id="customFilter">
+          {filterConfig.map(([text, id, param]) => (
+            <>
+              <span
+                onClick={() => {
+                  setSelectedKeys([text]);
+                  confirm();
+                }}
+                id={`set${id}`}
+              >
+                setSelectedKeys
+              </span>
+              <span onClick={() => clearFilters(param)} id={`reset${id}`}>
+                Reset
+              </span>
+            </>
+          ))}
+        </div>
+      );
+    };
+
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -2176,25 +2281,20 @@ describe('Table.filter', () => {
       }),
     );
 
-    function getFilterMenu() {
-      return wrapper.find('FilterDropdown');
-    }
-
     // check if renderer well
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-    expect(wrapper.find('#customFilter')).toMatchSnapshot();
-    expect(getFilterMenu().props().filterState.filteredKeys).toBeFalsy();
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
+    expect(container.querySelector('#customFilter')).toMatchSnapshot();
+    expect(renderSelectedKeys).toHaveLength(0);
 
-    filterConfig.forEach(([text, id, , res1, res2]) => {
-      wrapper.find(`#set${id}`).simulate('click');
-      wrapper.update();
-      expect(renderedNames(wrapper)).toEqual([text]);
+    filterConfig.forEach(([text, id, , matchNames, visible]) => {
+      fireEvent.click(container.querySelector(`#set${id}`));
+      expect(renderedNames(container)).toEqual([text]);
 
-      wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
-      wrapper.find(`#reset${id}`).simulate('click');
-      wrapper.update();
-      expect(renderedNames(wrapper)).toEqual(res1);
-      expect(wrapper.find('Dropdown').first().props().visible).toBe(res2);
+      fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
+      fireEvent.click(container.querySelector(`#reset${id}`));
+      expect(renderedNames(container)).toEqual(matchNames);
+
+      expect(container.querySelector('.ant-dropdown-open'))[visible ? 'toBeTruthy' : 'toBeFalsy']();
     });
   });
 
@@ -2209,26 +2309,23 @@ describe('Table.filter', () => {
       defaultFilteredValue: ['girl'],
     };
 
-    let wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [columnFilter],
       }),
     );
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
     act(() => {
       jest.runAllTimers();
-      wrapper.update();
     });
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    wrapper
-      .find(Checkbox)
-      .find('input')
-      .simulate('change', { target: { checked: true } });
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(5);
-    wrapper.find('button.ant-btn-link').simulate('click', nativeEvent);
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(0);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
 
-    wrapper = mount(
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-checkall'));
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(5);
+    fireEvent.click(container.querySelector('button.ant-btn-link'), nativeEvent);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(0);
+
+    rerender(
       createTable({
         columns: [
           {
@@ -2238,19 +2335,16 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    wrapper.find('span.ant-dropdown-trigger').simulate('click', nativeEvent);
+
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'), nativeEvent);
     act(() => {
       jest.runAllTimers();
-      wrapper.update();
     });
-    wrapper
-      .find(Checkbox)
-      .find('input')
-      .simulate('change', { target: { checked: true } });
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(5);
-    wrapper.find('button.ant-btn-link').simulate('click', nativeEvent);
-    expect(wrapper.find('.ant-tree-checkbox-checked').length).toBe(1);
-    expect(wrapper.find('.ant-tree-checkbox-checked+span').text()).toBe('Girl');
+    fireEvent.click(container.querySelector('.ant-table-filter-dropdown-checkall'));
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(5);
+    fireEvent.click(container.querySelector('button.ant-btn-link'), nativeEvent);
+    expect(container.querySelectorAll('.ant-tree-checkbox-checked').length).toBe(1);
+    expect(container.querySelector('.ant-tree-checkbox-checked+span').textContent).toBe('Girl');
   });
 
   it('filteredKeys should all be controlled or not controlled', () => {
@@ -2306,8 +2400,9 @@ describe('Table.filter', () => {
     expect(errorSpy).not.toBeCalled();
   });
 
+  // Warning: An update to Item ran an effect, but was not wrapped in act(...).
   it('can reset if filterResetToDefaultFilteredValue and filter is changing', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -2322,36 +2417,37 @@ describe('Table.filter', () => {
         ],
       }),
     );
-    expect(wrapper.find('tbody tr').length).toBe(1);
-    expect(wrapper.find('tbody tr').text()).toBe('Jack');
+    expect(container.querySelectorAll('tbody tr').length).toBe(1);
+    expect(container.querySelector('tbody tr').textContent).toBe('Jack');
 
     // open filter
-    wrapper.find('span.ant-dropdown-trigger').first().simulate('click');
+
+    fireEvent.click(container.querySelector('span.ant-dropdown-trigger'));
     expect(
-      wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').props().disabled,
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').disabled,
     ).toBeTruthy();
-    expect(wrapper.find('li.ant-dropdown-menu-item').at(0).text()).toBe('Jack');
-    expect(wrapper.find('li.ant-dropdown-menu-item').at(1).text()).toBe('Lucy');
+    expect(container.querySelectorAll('li.ant-dropdown-menu-item')[0].textContent).toBe('Jack');
+    expect(container.querySelectorAll('li.ant-dropdown-menu-item')[1].textContent).toBe('Lucy');
 
     // deselect default
-    wrapper.find('li.ant-dropdown-menu-item').at(0).simulate('click');
+    fireEvent.click(container.querySelectorAll('li.ant-dropdown-menu-item')[0]);
     expect(
-      wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').props().disabled,
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').disabled,
     ).toBeFalsy();
     // select other one
-    wrapper.find('li.ant-dropdown-menu-item').at(1).simulate('click');
+    fireEvent.click(container.querySelectorAll('li.ant-dropdown-menu-item')[1]);
     expect(
-      wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').props().disabled,
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').disabled,
     ).toBeFalsy();
     // deselect other one
-    wrapper.find('li.ant-dropdown-menu-item').at(1).simulate('click');
+    fireEvent.click(container.querySelectorAll('li.ant-dropdown-menu-item')[1]);
     expect(
-      wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').props().disabled,
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').disabled,
     ).toBeFalsy();
     // select default
-    wrapper.find('li.ant-dropdown-menu-item').at(0).simulate('click');
+    fireEvent.click(container.querySelectorAll('li.ant-dropdown-menu-item')[0]);
     expect(
-      wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').props().disabled,
+      container.querySelector('.ant-table-filter-dropdown-btns .ant-btn-link').disabled,
     ).toBeTruthy();
   });
 });
diff --git a/components/table/__tests__/Table.order.test.js b/components/table/__tests__/Table.order.test.js
index 9a8b60ebc0..485475b018 100644
--- a/components/table/__tests__/Table.order.test.js
+++ b/components/table/__tests__/Table.order.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { render } from '../../../tests/utils';
 import Table from '..';
 import { resetWarned } from '../../_util/warning';
 
@@ -37,7 +37,7 @@ describe('Table.order', () => {
 
   it('warning if duplicated SELECTION_COLUMN', () => {
     resetWarned();
-    mount(
+    render(
       createTable({
         columns: [Table.SELECTION_COLUMN, Table.SELECTION_COLUMN],
         rowSelection: {},
@@ -53,7 +53,7 @@ describe('Table.order', () => {
   });
 
   it('auto fixed', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         columns: [
           {
@@ -69,8 +69,9 @@ describe('Table.order', () => {
       }),
     );
 
-    expect(wrapper.find('tr').last().find('td')).toHaveLength(3);
-    expect(wrapper.find('tr').last().find('td.ant-table-cell-fix-left')).toHaveLength(2);
-    wrapper.unmount();
+    expect(container.querySelectorAll('tr')[1].querySelectorAll('td')).toHaveLength(3);
+    expect(
+      container.querySelectorAll('tr')[1].querySelectorAll('td.ant-table-cell-fix-left'),
+    ).toHaveLength(2);
   });
 });
diff --git a/components/table/__tests__/Table.pagination.test.js b/components/table/__tests__/Table.pagination.test.js
index a49ef65dd3..53aa0fbc04 100644
--- a/components/table/__tests__/Table.pagination.test.js
+++ b/components/table/__tests__/Table.pagination.test.js
@@ -1,8 +1,9 @@
 /* eslint-disable import/first */
 jest.mock('../../_util/scrollTo');
 
-import { mount } from 'enzyme';
 import React from 'react';
+import { act } from 'react-dom/test-utils';
+import { render, fireEvent } from '../../../tests/utils';
 import Table from '..';
 import scrollTo from '../../_util/scrollTo';
 import { resetWarned } from '../../_util/warning';
@@ -33,54 +34,64 @@ describe('Table.pagination', () => {
     return <Table columns={columns} dataSource={data} pagination={pagination} {...props} />;
   }
 
-  function renderedNames(wrapper) {
-    return wrapper.find('BodyRow').map(row => row.props().record.name);
+  function renderedNames(contain) {
+    // --- reserve comment for code review ---
+    // return wrapper.find('BodyRow').map(row => row.props().record.name);
+    const namesList = [];
+    contain
+      .querySelector('.ant-table-tbody')
+      .querySelectorAll('tr')
+      .forEach(tr => {
+        namesList.push(tr.querySelector('td').textContent);
+      });
+    return namesList;
   }
 
   it('renders pagination correctly', () => {
-    const wrapper = mount(createTable());
-    expect(wrapper.render()).toMatchSnapshot();
+    const { asFragment } = render(createTable());
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('not crash when pageSize is undefined', () => {
     expect(() => {
-      mount(createTable({ pagination: { pageSize: undefined } }));
+      render(createTable({ pagination: { pageSize: undefined } }));
     }).not.toThrow();
   });
 
   it('should not show pager if pagination.hideOnSinglePage is true and only 1 page', () => {
-    const wrapper = mount(createTable({ pagination: { pageSize: 3, hideOnSinglePage: true } }));
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { pageSize: 3, hideOnSinglePage: false } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { pageSize: 4, hideOnSinglePage: true } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination: { pageSize: 4, hideOnSinglePage: false } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { pageSize: 5, hideOnSinglePage: true } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination: { pageSize: 5, hideOnSinglePage: false } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
+    const { container, rerender } = render(
+      createTable({ pagination: { pageSize: 3, hideOnSinglePage: true } }),
+    );
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    rerender(createTable({ pagination: { pageSize: 3, hideOnSinglePage: false } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    rerender(createTable({ pagination: { pageSize: 4, hideOnSinglePage: true } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+    rerender(createTable({ pagination: { pageSize: 4, hideOnSinglePage: false } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    rerender(createTable({ pagination: { pageSize: 5, hideOnSinglePage: true } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+    rerender(createTable({ pagination: { pageSize: 5, hideOnSinglePage: false } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
   });
 
   it('should use pageSize when defaultPageSize and pageSize are both specified', () => {
-    const wrapper = mount(createTable({ pagination: { pageSize: 3, defaultPageSize: 4 } }));
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
+    const { container } = render(createTable({ pagination: { pageSize: 3, defaultPageSize: 4 } }));
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(2);
   });
 
   it('paginate data', () => {
-    const wrapper = mount(createTable());
+    const { container } = render(createTable());
 
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy']);
-    wrapper.find('Pager').last().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Jerry']);
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy']);
+    fireEvent.click(container.querySelector('.ant-pagination-next'));
+    expect(renderedNames(container)).toEqual(['Tom', 'Jerry']);
   });
 
   it('repaginates when pageSize change', () => {
-    const wrapper = mount(createTable());
-
-    wrapper.setProps({ pagination: { pageSize: 1 } });
-    expect(renderedNames(wrapper)).toEqual(['Jack']);
+    const { container, rerender } = render(createTable());
+    rerender(createTable({ pagination: { pageSize: 1 } }));
+    expect(renderedNames(container)).toEqual(['Jack']);
   });
 
   // https://github.com/ant-design/ant-design/issues/33487
@@ -100,32 +111,32 @@ describe('Table.pagination', () => {
         />
       );
     }
-    const wrapper = mount(<App />);
-    expect(wrapper.render()).toMatchSnapshot();
+    const { asFragment } = render(<App />);
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('should accept pagination size', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: { size: 'small' },
       }),
     );
-    expect(wrapper.find('.ant-pagination.ant-pagination-mini')).toHaveLength(1);
+    expect(container.querySelectorAll('.ant-pagination.ant-pagination-mini')).toHaveLength(1);
   });
 
   it('should scroll to first row when page change', () => {
     scrollTo.mockReturnValue(null);
 
-    const wrapper = mount(
+    const { container } = render(
       createTable({ scroll: { y: 20 }, pagination: { showSizeChanger: true, pageSize: 2 } }),
     );
     expect(scrollTo).toHaveBeenCalledTimes(0);
 
-    wrapper.find('Pager').last().simulate('click');
+    fireEvent.click(container.querySelector('.ant-pagination-next'));
     expect(scrollTo).toHaveBeenCalledTimes(1);
 
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    wrapper.find('.ant-select-item').last().simulate('click');
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    fireEvent.click(container.querySelectorAll('.ant-select-item')[1]);
     expect(scrollTo).toHaveBeenCalledTimes(2);
   });
 
@@ -134,24 +145,23 @@ describe('Table.pagination', () => {
       expect(top).toBe(0);
       expect(getContainer().className).toBe('ant-table-body');
     });
-    const wrapper = mount(
+    const { container } = render(
       createTable({ scroll: { y: 20 }, pagination: { showSizeChanger: true, pageSize: 2 } }),
     );
-    wrapper.find('Pager').last().simulate('click');
+    fireEvent.click(container.querySelector('.ant-pagination-next'));
   });
 
   it('fires change event', () => {
     const handleChange = jest.fn();
     const handlePaginationChange = jest.fn();
     const noop = () => {};
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: { ...pagination, onChange: handlePaginationChange, onShowSizeChange: noop },
         onChange: handleChange,
       }),
     );
-
-    wrapper.find('Pager').last().simulate('click');
+    fireEvent.click(container.querySelector('.ant-pagination-next'));
 
     expect(handleChange).toHaveBeenCalledWith(
       {
@@ -178,50 +188,56 @@ describe('Table.pagination', () => {
   // https://github.com/ant-design/ant-design/issues/4532
   // https://codepen.io/afc163/pen/dVeNoP?editors=001
   it('should have pager when change pagination from false to undefined', () => {
-    const wrapper = mount(createTable({ pagination: false }));
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination: undefined });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    expect(wrapper.find('.ant-pagination-item-active')).toHaveLength(1);
+    const { container, rerender } = render(createTable({ pagination: false }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+
+    rerender(createTable({ pagination: undefined }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    expect(container.querySelectorAll('.ant-pagination-item-active')).toHaveLength(1);
   });
 
   // https://github.com/ant-design/ant-design/issues/4532
   // https://codepen.io/afc163/pen/pWVRJV?editors=001
   it('should display pagination as prop pagination change between true and false', () => {
-    const wrapper = mount(createTable());
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
-    wrapper.setProps({ pagination: false });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination });
-    wrapper.update();
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
-    wrapper.find('.ant-pagination-item-2').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Jerry']);
-    wrapper.setProps({ pagination: false });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination: undefined });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Jerry']);
+    const { container, rerender } = render(createTable());
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(2);
+
+    rerender(createTable({ pagination: false }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+
+    rerender(createTable({ pagination }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(2);
+    fireEvent.click(container.querySelector('.ant-pagination-item-2'));
+    expect(renderedNames(container)).toEqual(['Tom', 'Jerry']);
+
+    rerender(createTable({ pagination: false }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+
+    rerender(createTable({ pagination: undefined }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(2);
+    expect(renderedNames(container)).toEqual(['Tom', 'Jerry']);
   });
 
   // https://github.com/ant-design/ant-design/issues/5259
   it('change to correct page when data source changes', () => {
-    const wrapper = mount(createTable({ pagination: { pageSize: 1 } }));
-    wrapper.find('.ant-pagination-item-3').simulate('click');
-    wrapper.setProps({ dataSource: [data[0]] });
-    expect(wrapper.find('.ant-pagination-item-1').hasClass('ant-pagination-item-active')).toBe(
-      true,
-    );
+    const { container, rerender } = render(createTable({ pagination: { pageSize: 1 } }));
+    fireEvent.click(container.querySelector('.ant-pagination-item-3'));
+    rerender(createTable({ dataSource: [data[0]] }));
+    expect(
+      container
+        .querySelector('.ant-pagination-item-1')
+        .className.includes('ant-pagination-item-active'),
+    ).toBe(true);
   });
 
   // https://github.com/ant-design/ant-design/issues/24913
   it('should called onChange when pageSize change', () => {
     const onChange = jest.fn();
     const onShowSizeChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           current: 1,
@@ -232,28 +248,34 @@ describe('Table.pagination', () => {
         },
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    expect(wrapper.find('.ant-select-item-option').length).toBe(4);
-    wrapper.find('.ant-select-item-option').at(1).simulate('click');
+
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    expect(container.querySelectorAll('.ant-select-item-option').length).toBe(4);
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[1]);
     expect(onChange).toHaveBeenCalledWith(1, 20);
   });
 
   it('should not change page when pagination current is specified', () => {
-    const wrapper = mount(createTable({ pagination: { current: 2, pageSize: 1 } }));
-    expect(wrapper.find('.ant-pagination-item-2').hasClass('ant-pagination-item-active')).toBe(
-      true,
-    );
-    wrapper.find('.ant-pagination-item-3').simulate('click');
-    expect(wrapper.find('.ant-pagination-item-2').hasClass('ant-pagination-item-active')).toBe(
-      true,
-    );
+    const { container } = render(createTable({ pagination: { current: 2, pageSize: 1 } }));
+
+    expect(
+      container
+        .querySelector('.ant-pagination-item-2')
+        .className.includes('ant-pagination-item-active'),
+    ).toBe(true);
+    fireEvent.click(container.querySelector('.ant-pagination-item-3'));
+    expect(
+      container
+        .querySelector('.ant-pagination-item-2')
+        .className.includes('ant-pagination-item-active'),
+    ).toBe(true);
   });
 
   // https://github.com/ant-design/ant-design/issues/29175
   it('should change page to max page count when pageSize change without pagination.total', () => {
     const onChange = jest.fn();
     const onShowSizeChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           current: 10,
@@ -264,10 +286,13 @@ describe('Table.pagination', () => {
         dataSource: longData,
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    expect(wrapper.find('.ant-select-item-option').length).toBe(4);
-    wrapper.find('.ant-select-item-option').at(1).simulate('click');
-    const newPageSize = parseInt(wrapper.find('.ant-select-item-option').at(1).text(), 10);
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    expect(container.querySelectorAll('.ant-select-item-option').length).toBe(4);
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[1]);
+    const newPageSize = parseInt(
+      container.querySelectorAll('.ant-select-item-option')[1].textContent,
+      10,
+    );
     expect(onChange).toHaveBeenCalledWith(longData.length / newPageSize, 20);
   });
 
@@ -275,7 +300,7 @@ describe('Table.pagination', () => {
     const onChange = jest.fn();
     const onShowSizeChange = jest.fn();
     const total = 20000;
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           current: total / 10,
@@ -287,10 +312,14 @@ describe('Table.pagination', () => {
         dataSource: longData,
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    expect(wrapper.find('.ant-select-item-option').length).toBe(4);
-    wrapper.find('.ant-select-item-option').at(1).simulate('click');
-    const newPageSize = parseInt(wrapper.find('.ant-select-item-option').at(1).text(), 10);
+
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    expect(container.querySelectorAll('.ant-select-item-option').length).toBe(4);
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[1]);
+    const newPageSize = parseInt(
+      container.querySelectorAll('.ant-select-item-option')[1].textContent,
+      10,
+    );
     expect(onChange).toHaveBeenCalledWith(total / newPageSize, 20);
   });
 
@@ -298,7 +327,7 @@ describe('Table.pagination', () => {
   it('should not change page to max page if current is not greater max page when pageSize change', () => {
     const onChange = jest.fn();
     const onShowSizeChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           current: 4,
@@ -309,15 +338,15 @@ describe('Table.pagination', () => {
         dataSource: longData,
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    expect(wrapper.find('.ant-select-item-option').length).toBe(4);
-    wrapper.find('.ant-select-item-option').at(1).simulate('click');
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    expect(container.querySelectorAll('.ant-select-item-option').length).toBe(4);
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[1]);
     expect(onChange).toHaveBeenCalledWith(4, 20);
   });
 
   it('should reset current to max page when data length is cut', () => {
     const onChange = jest.fn();
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         pagination: {
           current: 10,
@@ -327,30 +356,59 @@ describe('Table.pagination', () => {
         dataSource: longData,
       }),
     );
-    expect(wrapper.find('.ant-pagination-item-active').text()).toBe('10');
-    wrapper.setProps({
-      dataSource: longData.filter(item => item.key < 60),
-    });
-    expect(wrapper.find('.ant-pagination-item-active').text()).toBe('6');
+    expect(container.querySelector('.ant-pagination-item-active').textContent).toBe('10');
+    rerender(
+      createTable({
+        pagination: {
+          current: 10,
+          pageSize: 10,
+          onChange,
+        },
+        dataSource: longData.filter(item => item.key < 60),
+      }),
+    );
+
+    expect(container.querySelector('.ant-pagination-item-active').textContent).toBe('6');
   });
 
   it('specify the position of pagination', () => {
-    const wrapper = mount(createTable({ pagination: { position: ['topLeft'] } }));
-    expect(wrapper.find('.ant-spin-container').children()).toHaveLength(2);
-    expect(wrapper.find('.ant-spin-container').childAt(0).find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { position: ['bottomRight'] } });
-    expect(wrapper.find('.ant-spin-container').children()).toHaveLength(2);
-    expect(wrapper.find('.ant-spin-container').childAt(1).find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { position: ['topLeft', 'bottomRight'] } });
-    expect(wrapper.find('.ant-spin-container').children()).toHaveLength(3);
-    expect(wrapper.find('.ant-spin-container').childAt(0).find('.ant-pagination')).toHaveLength(1);
-    expect(wrapper.find('.ant-spin-container').childAt(2).find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { position: ['none', 'none'] } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(0);
-    wrapper.setProps({ pagination: { position: ['invalid'] } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
-    wrapper.setProps({ pagination: { position: ['invalid', 'invalid'] } });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(1);
+    const { container, rerender } = render(createTable({ pagination: { position: ['topLeft'] } }));
+    expect(container.querySelector('.ant-spin-container').children).toHaveLength(2);
+    expect(
+      container
+        .querySelector('.ant-spin-container')
+        .children[0].className.includes('ant-pagination'),
+    ).toBe(true);
+
+    rerender(createTable({ pagination: { position: ['bottomRight'] } }));
+    expect(container.querySelector('.ant-spin-container').children).toHaveLength(2);
+    expect(
+      container
+        .querySelector('.ant-spin-container')
+        .children[1].className.includes('ant-pagination'),
+    ).toBe(true);
+
+    rerender(createTable({ pagination: { position: ['topLeft', 'bottomRight'] } }));
+    expect(container.querySelector('.ant-spin-container').children).toHaveLength(3);
+    expect(
+      container
+        .querySelector('.ant-spin-container')
+        .children[0].className.includes('ant-pagination'),
+    ).toBe(true);
+    expect(
+      container
+        .querySelector('.ant-spin-container')
+        .children[2].className.includes('ant-pagination'),
+    ).toBe(true);
+
+    rerender(createTable({ pagination: { position: ['none', 'none'] } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(0);
+
+    rerender(createTable({ pagination: { position: ['invalid'] } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
+
+    rerender(createTable({ pagination: { position: ['invalid', 'invalid'] } }));
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(1);
   });
 
   /**
@@ -358,15 +416,15 @@ describe('Table.pagination', () => {
    * to `pagination`, since they misunderstand that `pagination` can accept a boolean value.
    */
   it('Accepts pagination as true', () => {
-    const wrapper = mount(createTable({ pagination: true }));
-    expect(wrapper.render()).toMatchSnapshot();
+    const { asFragment } = render(createTable({ pagination: true }));
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('ajax render should keep display by the dataSource', () => {
     const onChange = jest.fn();
     const onPaginationChange = jest.fn();
 
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         onChange,
         pagination: {
@@ -376,9 +434,11 @@ describe('Table.pagination', () => {
       }),
     );
 
-    expect(wrapper.find('.ant-table-tbody tr.ant-table-row')).toHaveLength(data.length);
+    expect(container.querySelectorAll('.ant-table-tbody tr.ant-table-row')).toHaveLength(
+      data.length,
+    );
 
-    wrapper.find('.ant-pagination .ant-pagination-item-2').simulate('click');
+    fireEvent.click(container.querySelector('.ant-pagination .ant-pagination-item-2'));
     expect(onChange.mock.calls[0][0].current).toBe(2);
     expect(onChange).toHaveBeenCalledWith(
       { current: 2, pageSize: 10, total: 200 },
@@ -396,14 +456,16 @@ describe('Table.pagination', () => {
     );
     expect(onPaginationChange).toHaveBeenCalledWith(2, 10);
 
-    expect(wrapper.find('.ant-table-tbody tr.ant-table-row')).toHaveLength(data.length);
+    expect(container.querySelectorAll('.ant-table-tbody tr.ant-table-row')).toHaveLength(
+      data.length,
+    );
   });
 
   it('onShowSizeChange should trigger once', () => {
     jest.useFakeTimers();
     const onShowSizeChange = jest.fn();
     const onChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           total: 200,
@@ -413,11 +475,14 @@ describe('Table.pagination', () => {
         onChange,
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    jest.runAllTimers();
-    const dropdownWrapper = wrapper.find('Trigger');
-    expect(wrapper.find('.ant-select-item-option').length).toBe(4);
-    dropdownWrapper.find('.ant-select-item-option').at(3).simulate('click');
+
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    //  resolve Warning: An update to Align ran an effect, but was not wrapped in act(...)
+    act(() => {
+      jest.runAllTimers();
+    });
+    expect(container.querySelectorAll('.ant-select-item-option').length).toBe(4);
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[3]);
     expect(onShowSizeChange).toHaveBeenCalledTimes(1);
     expect(onShowSizeChange).toHaveBeenLastCalledWith(1, 100);
     expect(onChange).toHaveBeenCalled();
@@ -425,44 +490,47 @@ describe('Table.pagination', () => {
   });
 
   it('should support current in pagination', () => {
-    const wrapper = mount(createTable({ pagination: { current: 2, pageSize: 1 } }));
-    expect(wrapper.find('.ant-pagination-item-active').text()).toBe('2');
+    const { container } = render(createTable({ pagination: { current: 2, pageSize: 1 } }));
+    expect(container.querySelector('.ant-pagination-item-active').textContent).toBe('2');
   });
 
   it('should support defaultCurrent in pagination', () => {
-    const wrapper = mount(createTable({ pagination: { defaultCurrent: 2, pageSize: 1 } }));
-    expect(wrapper.find('.ant-pagination-item-active').text()).toBe('2');
+    const { container } = render(createTable({ pagination: { defaultCurrent: 2, pageSize: 1 } }));
+    expect(container.querySelector('.ant-pagination-item-active').textContent).toBe('2');
   });
 
   it('should support defaultPageSize in pagination', () => {
-    const wrapper = mount(createTable({ pagination: { defaultPageSize: 1 } }));
-    expect(wrapper.find('.ant-pagination-item')).toHaveLength(4);
+    const { container } = render(createTable({ pagination: { defaultPageSize: 1 } }));
+    expect(container.querySelectorAll('.ant-pagination-item')).toHaveLength(4);
   });
 
   // https://github.com/ant-design/ant-design/issues/19957
   it('ajax should work with pagination', () => {
-    const wrapper = mount(createTable({ pagination: { total: 100 } }));
-    wrapper.find('.ant-pagination-item-2').simulate('click');
-    wrapper.setProps({ pagination: { current: 2, total: 100 } });
+    const { container, rerender } = render(createTable({ pagination: { total: 100 } }));
+
+    fireEvent.click(container.querySelector('.ant-pagination-item-2'));
+    rerender(createTable({ pagination: { current: 2, total: 100 } }));
 
     expect(
-      wrapper.find('.ant-pagination-item-2').hasClass('ant-pagination-item-active'),
+      container
+        .querySelector('.ant-pagination-item-2')
+        .className.includes('ant-pagination-item-active'),
     ).toBeTruthy();
   });
 
   it('pagination should ignore invalidate total', () => {
-    const wrapper = mount(createTable({ pagination: { total: null } }));
-    expect(wrapper.find('.ant-pagination-item-1').length).toBeTruthy();
+    const { container } = render(createTable({ pagination: { total: null } }));
+    expect(container.querySelectorAll('.ant-pagination-item-1').length).toBeTruthy();
   });
 
   it('renders pagination topLeft and bottomRight', () => {
-    const wrapper = mount(createTable({ pagination: ['topLeft', 'bottomRight'] }));
-    expect(wrapper.render()).toMatchSnapshot();
+    const { asFragment } = render(createTable({ pagination: ['topLeft', 'bottomRight'] }));
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('should call onChange when change pagination size', () => {
     const onChange = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           total: 200,
@@ -471,10 +539,8 @@ describe('Table.pagination', () => {
         onChange,
       }),
     );
-    wrapper.find('.ant-select-selector').simulate('mousedown');
-    const dropdownWrapper = wrapper.find('Trigger');
-    dropdownWrapper.find('.ant-select-item-option').at(2).simulate('click');
-
+    fireEvent.mouseDown(container.querySelector('.ant-select-selector'));
+    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[2]);
     expect(onChange).toBeCalledTimes(1);
   });
 
@@ -490,14 +556,14 @@ describe('Table.pagination', () => {
       });
     }
 
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         dataSource: dynamicData,
         pagination: { total: 100, pageSize: 10, current: 2 },
       }),
     );
 
-    expect(wrapper.find('tbody tr')).toHaveLength(5);
+    expect(container.querySelectorAll('tbody tr')).toHaveLength(5);
 
     expect(errorSpy).toHaveBeenCalledWith(
       'Warning: [antd: Table] `dataSource` length is less than `pagination.total` but large than `pagination.pageSize`. Please make sure your config correct data with async mode.',
@@ -512,17 +578,19 @@ describe('Table.pagination', () => {
       current: total,
       position: ['topLeft', 'bottomLeft'],
     };
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         pagination: paginationProp,
       }),
     );
+    rerender(
+      createTable({
+        dataSource: data.slice(total - 1),
+        pagination: { ...paginationProp, total: total - 1 },
+      }),
+    );
 
-    wrapper.setProps({
-      dataSource: data.slice(total - 1),
-      pagination: { ...paginationProp, total: total - 1 },
-    });
-    expect(wrapper.find('.ant-pagination')).toHaveLength(2);
+    expect(container.querySelectorAll('.ant-pagination')).toHaveLength(2);
   });
 
   it('showTotal should hide when removed', () => {
@@ -549,16 +617,16 @@ describe('Table.pagination', () => {
       );
     };
 
-    const wrapper = mount(<Demo />);
-    expect(wrapper.find('.ant-pagination-total-text').text()).toEqual('>200<');
+    const { container } = render(<Demo />);
+    expect(container.querySelector('.ant-pagination-total-text').textContent).toEqual('>200<');
 
     // Should hide
-    wrapper.find('.ant-pagination-item-2').simulate('click');
-    expect(wrapper.find('.ant-pagination-total-text')).toHaveLength(0);
+    fireEvent.click(container.querySelector('.ant-pagination-item-2'));
+    expect(container.querySelectorAll('.ant-pagination-total-text')).toHaveLength(0);
   });
 
   it('should preserve table pagination className', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table
         data={[]}
         columns={[]}
@@ -570,7 +638,7 @@ describe('Table.pagination', () => {
         }}
       />,
     );
-    expect(wrapper.find('.ant-pagination').prop('className')).toEqual(
+    expect(container.querySelector('.ant-pagination').className).toEqual(
       'ant-pagination ant-table-pagination ant-table-pagination-right pagination',
     );
   });
diff --git a/components/table/__tests__/Table.sorter.test.js b/components/table/__tests__/Table.sorter.test.js
index d813c2ff4b..ed1623ec3f 100644
--- a/components/table/__tests__/Table.sorter.test.js
+++ b/components/table/__tests__/Table.sorter.test.js
@@ -1,6 +1,6 @@
 /* eslint-disable react/no-multi-comp */
 import React from 'react';
-import { render, mount } from 'enzyme';
+import { render, fireEvent, act } from '../../../tests/utils';
 import Table from '..';
 
 describe('Table.sorter', () => {
@@ -20,7 +20,7 @@ describe('Table.sorter', () => {
     { key: 3, name: 'Jerry' },
   ];
 
-  function createTable(tableProps, columnProps = {}) {
+  function createTable(tableProps = {}, columnProps = {}) {
     return (
       <Table
         columns={[
@@ -36,17 +36,24 @@ describe('Table.sorter', () => {
     );
   }
 
-  function renderedNames(wrapper) {
-    return wrapper.find('BodyRow').map(row => row.props().record.name);
+  function renderedNames(contain) {
+    const namesList = [];
+    contain
+      .querySelector('.ant-table-tbody')
+      .querySelectorAll('tr')
+      .forEach(tr => {
+        namesList.push(tr.querySelector('td').textContent);
+      });
+    return namesList;
   }
 
   it('renders sorter icon correctly', () => {
-    const wrapper = render(createTable());
-    expect(wrapper.find('thead')).toMatchSnapshot();
+    const { container } = render(createTable());
+    expect(container.querySelector('thead')).toMatchSnapshot();
   });
 
   it('default sort order ascend', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable(
         {},
         {
@@ -55,11 +62,11 @@ describe('Table.sorter', () => {
       ),
     );
 
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+    expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
   });
 
   it('default sort order descend', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable(
         {},
         {
@@ -68,14 +75,12 @@ describe('Table.sorter', () => {
       ),
     );
 
-    const getNameColumn = () => wrapper.find('th').at(0);
-
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(container.querySelector('th').getAttribute('aria-sort')).toEqual('descending');
   });
 
   it('should change aria-sort when default sort order is set to descend', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable(
         {
           sortDirections: ['descend', 'ascend'],
@@ -86,63 +91,62 @@ describe('Table.sorter', () => {
       ),
     );
 
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const getNameColumn = () => container.querySelector('th');
 
     // Test that it cycles through the order of sortDirections
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   it('sort records', () => {
-    const wrapper = mount(createTable());
-
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const { container } = render(createTable());
+    const getNameColumn = () => container.querySelector('th');
 
     // first assert default state
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
 
     // ascend
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
     // descend
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
   });
 
   it('sort records with keydown', () => {
-    const wrapper = mount(createTable());
+    const { container } = render(createTable());
 
     // ascend
-    wrapper.find('.ant-table-column-sorters').simulate('keydown', { keyCode: 13 });
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+    fireEvent.keyDown(container.querySelector('.ant-table-column-sorters'), { keyCode: 13 });
+    expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
 
     // descend
-    wrapper.find('.ant-table-column-sorters').simulate('keydown', { keyCode: 13 });
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    fireEvent.keyDown(container.querySelector('.ant-table-column-sorters'), { keyCode: 13 });
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
   });
 
   describe('can be controlled by sortOrder', () => {
     it('single', () => {
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [{ ...column, sortOrder: 'ascend' }],
         }),
       );
-      expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+      expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
     });
 
     it('invalidate mix with single & multiple sorters', () => {
-      const wrapper = mount(
+      const { container } = render(
         createTable({
           columns: [
             {
@@ -163,13 +167,13 @@ describe('Table.sorter', () => {
         }),
       );
 
-      expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+      expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
     });
   });
 
   it('provides sortOrder in the sorterFn', () => {
     let actualSortOrder;
-    mount(
+    render(
       createTable(
         {},
         {
@@ -185,39 +189,40 @@ describe('Table.sorter', () => {
   });
 
   it('can update column sortOrder', () => {
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({
         columns: [column],
       }),
     );
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    wrapper.setProps({
-      columns: [{ ...column, sortOrder: 'ascend' }],
-    });
-    wrapper.update();
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    rerender(
+      createTable({
+        columns: [{ ...column, sortOrder: 'ascend' }],
+      }),
+    );
+    expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
   });
 
   it('fires change event', () => {
     const handleChange = jest.fn();
-    const wrapper = mount(createTable({ onChange: handleChange }));
+    const { container } = render(createTable({ onChange: handleChange }));
 
     // ascent
-    wrapper.find('.ant-table-column-sorters').simulate('click');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
     const sorter1 = handleChange.mock.calls[0][2];
     expect(sorter1.column.dataIndex).toBe('name');
     expect(sorter1.order).toBe('ascend');
     expect(sorter1.field).toBe('name');
     expect(sorter1.columnKey).toBe('name');
 
-    wrapper.find('.ant-table-column-sorters').simulate('click');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
     const sorter2 = handleChange.mock.calls[1][2];
     expect(sorter2.column.dataIndex).toBe('name');
     expect(sorter2.order).toBe('descend');
     expect(sorter2.field).toBe('name');
     expect(sorter2.columnKey).toBe('name');
 
-    wrapper.find('.ant-table-column-sorters').simulate('click');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
     const sorter3 = handleChange.mock.calls[2][2];
     expect(sorter3.column).toBe(undefined);
     expect(sorter3.order).toBe(undefined);
@@ -228,71 +233,98 @@ describe('Table.sorter', () => {
   it('hover header show sorter tooltip', () => {
     // tooltip has delay
     jest.useFakeTimers();
-    const wrapper = mount(createTable({}));
+    const { container, rerender } = render(createTable());
+
     // default show sorter tooltip
-    wrapper.find('.ant-table-column-sorters').simulate('mouseenter');
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy();
-    wrapper.find('.ant-table-column-sorters').simulate('mouseout');
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
+    });
+
+    expect(container.querySelector('.ant-tooltip-open')).toBeTruthy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
 
     // set table props showSorterTooltip is false
-    wrapper.setProps({ showSorterTooltip: false });
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open')).toHaveLength(0);
+    rerender(createTable({ showSorterTooltip: false }));
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
+    });
+    expect(container.querySelector('.ant-tooltip-open')).toBeFalsy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
+
     // set table props showSorterTooltip is false, column showSorterTooltip is true
-    wrapper.setProps({
-      showSorterTooltip: false,
-      columns: [{ ...column, showSorterTooltip: true }],
+    rerender(
+      createTable({ showSorterTooltip: true, columns: [{ ...column, showSorterTooltip: true }] }),
+    );
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
     });
-    wrapper.find('.ant-table-column-sorters').simulate('mouseenter');
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy();
-    wrapper.find('.ant-table-column-sorters').simulate('mouseout');
+    expect(container.querySelector('.ant-tooltip-open')).toBeTruthy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
+
     // set table props showSorterTooltip is true, column showSorterTooltip is false
-    wrapper.setProps({
-      showSorterTooltip: true,
-      columns: [{ ...column, showSorterTooltip: false }],
+    rerender(
+      createTable({
+        showSorterTooltip: true,
+        columns: [{ ...column, showSorterTooltip: false }],
+      }),
+    );
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
     });
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open')).toHaveLength(0);
+    expect(container.querySelector('.ant-tooltip-open')).toBeFalsy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
   });
 
   it('should show correct tooltip when showSorterTooltip is an object', () => {
     // basically copied from 'hover header show sorter tooltip'
     jest.useFakeTimers();
-    const wrapper = mount(
+    const { container, rerender } = render(
       createTable({ showSorterTooltip: { placement: 'bottom', title: 'static title' } }),
     );
-    wrapper.find('.ant-table-column-sorters').simulate('mouseenter');
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy();
-    wrapper.find('.ant-table-column-sorters').simulate('mouseout');
 
-    wrapper.setProps({ showSorterTooltip: false });
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open')).toHaveLength(0);
-    wrapper.setProps({
-      showSorterTooltip: false,
-      columns: [{ ...column, showSorterTooltip: true }],
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
     });
-    wrapper.find('.ant-table-column-sorters').simulate('mouseenter');
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy();
-    wrapper.find('.ant-table-column-sorters').simulate('mouseout');
-    wrapper.setProps({
-      showSorterTooltip: true,
-      columns: [{ ...column, showSorterTooltip: false }],
+    expect(container.querySelector('.ant-tooltip-open')).toBeTruthy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
+
+    // Root to false
+    rerender(createTable({ showSorterTooltip: false }));
+    act(() => {
+      jest.runAllTimers();
     });
-    jest.runAllTimers();
-    wrapper.update();
-    expect(wrapper.find('.ant-tooltip-open')).toHaveLength(0);
+    expect(container.querySelector('.ant-tooltip-open')).toBeFalsy();
+
+    // Column to true
+    rerender(
+      createTable({
+        showSorterTooltip: false,
+        columns: [{ ...column, showSorterTooltip: true }],
+      }),
+    );
+    fireEvent.mouseEnter(container.querySelector('.ant-table-column-sorters'));
+    act(() => {
+      jest.runAllTimers();
+    });
+    expect(container.querySelector('.ant-tooltip-open')).toBeTruthy();
+    fireEvent.mouseOut(container.querySelector('.ant-table-column-sorters'));
+
+    // Column to false
+    rerender(
+      createTable({
+        showSorterTooltip: true,
+        columns: [{ ...column, showSorterTooltip: false }],
+      }),
+    );
+    act(() => {
+      jest.runAllTimers();
+    });
+    expect(container.querySelector('.ant-tooltip-open')).toBeFalsy();
   });
 
   it('works with grouping columns in controlled mode', () => {
@@ -322,9 +354,9 @@ describe('Table.sorter', () => {
       { key: 2, name: 'Tom', age: 21 },
       { key: 3, name: 'Jerry', age: 22 },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={testData} />);
+    const { container } = render(<Table columns={columns} dataSource={testData} />);
 
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
   });
 
   // https://github.com/ant-design/ant-design/issues/11246#issuecomment-405009167
@@ -343,12 +375,12 @@ describe('Table.sorter', () => {
       { key: 2, name: 'Tom', age: 21 },
       { key: 3, name: 'Jerry', age: 22 },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={testData} />);
-    expect(wrapper.find('.custom-title').text()).toEqual('');
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(wrapper.find('.custom-title').text()).toEqual('ascend');
-    wrapper.find('.ant-table-column-sorters').simulate('click');
-    expect(wrapper.find('.custom-title').text()).toEqual('descend');
+    const { container } = render(<Table columns={columns} dataSource={testData} />);
+    expect(container.querySelector('.custom-title').textContent).toEqual('');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(container.querySelector('.custom-title').textContent).toEqual('ascend');
+    fireEvent.click(container.querySelector('.ant-table-column-sorters'));
+    expect(container.querySelector('.custom-title').textContent).toEqual('descend');
   });
 
   // https://github.com/ant-design/ant-design/pull/12264#discussion_r218053034
@@ -371,26 +403,26 @@ describe('Table.sorter', () => {
       { key: 2, name: 'Tom', age: 21 },
       { key: 3, name: 'Jerry', age: 22 },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={testData} />);
+    const { container } = render(<Table columns={columns} dataSource={testData} />);
 
-    const getNameColumn = () => wrapper.find('.ant-table-column-has-sorters').at(0);
-    const getAgeColumn = () => wrapper.find('.ant-table-column-has-sorters').at(1);
-    const getNameIcon = name => getNameColumn().find(`.ant-table-column-sorter-${name}`).first();
-    const getAgeIcon = name => getAgeColumn().find(`.ant-table-column-sorter-${name}`).first();
+    const getNameColumn = () => container.querySelectorAll('.ant-table-column-has-sorters')[0];
+    const getAgeColumn = () => container.querySelectorAll('.ant-table-column-has-sorters')[1];
+    const getNameIcon = name => getNameColumn().querySelector(`.ant-table-column-sorter-${name}`);
+    const getAgeIcon = name => getAgeColumn().querySelector(`.ant-table-column-sorter-${name}`);
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getNameIcon('up').hasClass('active')).toBeTruthy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
-    expect(getAgeIcon('up').hasClass('active')).toBeFalsy();
-    expect(getAgeColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(getNameIcon('up').className.includes('active')).toBeTruthy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
+    expect(getAgeIcon('up').className.includes('active')).toBeFalsy();
+    expect(getAgeColumn().getAttribute('aria-sort')).toEqual(null);
 
     // sort age
-    getAgeColumn().simulate('click');
-    expect(getNameIcon('up').hasClass('active')).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
-    expect(getAgeIcon('up').hasClass('active')).toBeTruthy();
-    expect(getAgeColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(getAgeColumn());
+    expect(getNameIcon('up').className.includes('active')).toBeFalsy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
+    expect(getAgeIcon('up').className.includes('active')).toBeTruthy();
+    expect(getAgeColumn().getAttribute('aria-sort')).toEqual('ascending');
   });
 
   // https://github.com/ant-design/ant-design/issues/12571
@@ -430,31 +462,31 @@ describe('Table.sorter', () => {
       }
     }
 
-    const wrapper = mount(<TableTest />);
+    const { container } = render(<TableTest />);
 
-    const getNameColumn = () => wrapper.find('th').at(0);
-    const getIcon = name => getNameColumn().find(`.ant-table-column-sorter-${name}`).first();
+    const getNameColumn = () => container.querySelector('th');
+    const getIcon = name => getNameColumn().querySelector(`.ant-table-column-sorter-${name}`);
 
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeTruthy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeTruthy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeTruthy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeTruthy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   // https://github.com/ant-design/ant-design/issues/12737
@@ -497,31 +529,31 @@ describe('Table.sorter', () => {
       }
     }
 
-    const wrapper = mount(<TableTest />);
+    const { container } = render(<TableTest />);
 
-    const getNameColumn = () => wrapper.find('th').at(0);
-    const getIcon = name => getNameColumn().find(`.ant-table-column-sorter-${name}`).first();
+    const getNameColumn = () => container.querySelector('th');
+    const getIcon = name => getNameColumn().querySelector(`.ant-table-column-sorter-${name}`);
 
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeTruthy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeTruthy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeTruthy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeTruthy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // sort name
-    getNameColumn().simulate('click');
-    expect(getIcon('up').hasClass('active')).toBeFalsy();
-    expect(getIcon('down').hasClass('active')).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(getIcon('up').className.includes('active')).toBeFalsy();
+    expect(getIcon('down').className.includes('active')).toBeFalsy();
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   // https://github.com/ant-design/ant-design/issues/12870
@@ -565,96 +597,96 @@ describe('Table.sorter', () => {
       }
     }
 
-    const wrapper = mount(<TableTest />);
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const { container } = render(<TableTest />);
+    const getNameColumn = () => container.querySelector('th');
     expect(
-      getNameColumn().find('.ant-table-column-sorter-up').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-up').className.includes('active'),
     ).toBeFalsy();
     expect(
-      getNameColumn().find('.ant-table-column-sorter-down').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-down').className.includes('active'),
     ).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
 
     // sort name
-    getNameColumn().simulate('click');
+    fireEvent.click(getNameColumn());
     expect(
-      getNameColumn().find('.ant-table-column-sorter-up').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-up').className.includes('active'),
     ).toBeTruthy();
     expect(
-      getNameColumn().find('.ant-table-column-sorter-down').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-down').className.includes('active'),
     ).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
     // sort name
-    getNameColumn().simulate('click');
+    fireEvent.click(getNameColumn());
     expect(
-      getNameColumn().find('.ant-table-column-sorter-up').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-up').className.includes('active'),
     ).toBeFalsy();
     expect(
-      getNameColumn().find('.ant-table-column-sorter-down').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-down').className.includes('active'),
     ).toBeTruthy();
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // sort name
-    getNameColumn().simulate('click');
+    fireEvent.click(getNameColumn());
     expect(
-      getNameColumn().find('.ant-table-column-sorter-up').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-up').className.includes('active'),
     ).toBeFalsy();
     expect(
-      getNameColumn().find('.ant-table-column-sorter-down').at(0).hasClass('active'),
+      getNameColumn().querySelector('.ant-table-column-sorter-down').className.includes('active'),
     ).toBeFalsy();
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   it('should first sort by descend, then ascend, then cancel sort', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         sortDirections: ['descend', 'ascend'],
       }),
     );
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const getNameColumn = () => container.querySelector('th');
 
     // descend
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // ascend
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
 
     // cancel sort
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   it('should first sort by descend, then cancel sort', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         sortDirections: ['descend'],
       }),
     );
 
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const getNameColumn = () => container.querySelector('th');
 
     // default
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
 
     // descend
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // cancel sort
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   it('should first sort by descend, then cancel sort. (column prop)', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable(
         {},
         {
@@ -663,27 +695,27 @@ describe('Table.sorter', () => {
       ),
     );
 
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const getNameColumn = () => container.querySelector('th');
 
     // default
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
 
     // descend
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual('descending');
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('descending');
 
     // cancel sort
-    getNameColumn().simulate('click');
-    expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    fireEvent.click(getNameColumn());
+    expect(renderedNames(container)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
   });
 
   it('pagination back', () => {
     const onPageChange = jest.fn();
     const onChange = jest.fn();
 
-    const wrapper = mount(
+    const { container } = render(
       createTable({
         pagination: {
           pageSize: 2,
@@ -694,27 +726,27 @@ describe('Table.sorter', () => {
       }),
     );
 
-    const getNameColumn = () => wrapper.find('th').at(0);
+    const getNameColumn = () => container.querySelector('th');
 
-    expect(getNameColumn().prop('aria-sort')).toEqual(undefined);
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual(null);
 
-    getNameColumn().simulate('click');
+    fireEvent.click(getNameColumn());
     expect(onChange.mock.calls[0][0].current).toBe(2);
     expect(onPageChange).not.toHaveBeenCalled();
-    expect(getNameColumn().prop('aria-sort')).toEqual('ascending');
+    expect(getNameColumn().getAttribute('aria-sort')).toEqual('ascending');
   });
 
   it('should support onHeaderCell in sort column', () => {
     const onClick = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       <Table columns={[{ title: 'title', onHeaderCell: () => ({ onClick }), sorter: true }]} />,
     );
-    wrapper.find('th').simulate('click');
+    fireEvent.click(container.querySelector('th'));
     expect(onClick).toHaveBeenCalled();
   });
 
   it('could sort data with children', () => {
-    const wrapper = mount(
+    const { container } = render(
       createTable(
         {
           defaultExpandAllRows: true,
@@ -755,7 +787,7 @@ describe('Table.sorter', () => {
       ),
     );
 
-    expect(renderedNames(wrapper)).toEqual(['Brown', 'Green', 'Mike', 'Alex', 'Petter', 'Zoe']);
+    expect(renderedNames(container)).toEqual(['Brown', 'Green', 'Mike', 'Alex', 'Petter', 'Zoe']);
   });
 
   // https://github.com/ant-design/ant-design/issues/19443
@@ -774,22 +806,22 @@ describe('Table.sorter', () => {
       }
     }
     expect(() => {
-      mount(<Demo />);
+      render(<Demo />);
     }).not.toThrow();
   });
 
   it('should support defaultOrder in Column', () => {
-    const wrapper = mount(
+    const { asFragment } = render(
       <Table dataSource={[{ key: '1', age: 1 }]}>
         <Table.Column title="Age" dataIndex="age" sorter defaultSortOrder="ascend" key="age" />
       </Table>,
     );
-    expect(wrapper.render()).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   // https://github.com/ant-design/ant-design/issues/20096
   it('invalidate sorter should not display sorter button', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table
         columns={[
           {
@@ -814,12 +846,12 @@ describe('Table.sorter', () => {
       />,
     );
 
-    expect(wrapper.find('.ant-table-column-sorter-inner')).toHaveLength(0);
+    expect(container.querySelectorAll('.ant-table-column-sorter-inner')).toHaveLength(0);
   });
 
   // https://github.com/ant-design/ant-design/issues/21193
   it('table with sugar column', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table>
         <Table.Column
           title="Chinese Score"
@@ -840,20 +872,24 @@ describe('Table.sorter', () => {
       </Table>,
     );
 
-    wrapper.find('th').first().simulate('click');
+    fireEvent.click(container.querySelector('th'));
 
-    expect(wrapper.find('th.ant-table-column-sort')).toHaveLength(1);
+    expect(container.querySelectorAll('th.ant-table-column-sort')).toHaveLength(1);
   });
 
   it('surger should support sorterOrder', () => {
-    const wrapper = mount(
+    const { container } = render(
       <Table>
         <Table.Column key="name" title="Name" dataIndex="name" sortOrder="ascend" sorter />
       </Table>,
     );
 
-    expect(wrapper.find('.ant-table-column-sorter-up').last().hasClass('active')).toBeTruthy();
-    expect(wrapper.find('.ant-table-column-sorter-down').last().hasClass('active')).toBeFalsy();
+    expect(
+      container.querySelector('.ant-table-column-sorter-up').className.includes('active'),
+    ).toBeTruthy();
+    expect(
+      container.querySelector('.ant-table-column-sorter-down').className.includes('active'),
+    ).toBeFalsy();
   });
 
   it('controlled multiple group', () => {
@@ -888,23 +924,19 @@ describe('Table.sorter', () => {
       },
     ];
 
-    const wrapper = mount(<Table columns={groupColumns} data={groupData} />);
-    wrapper.update();
+    const { container } = render(<Table columns={groupColumns} data={groupData} />);
+
     expect(
-      wrapper
-        .find('.ant-table-column-sorter-full')
-        .first()
-        .find('.ant-table-column-sorter-up')
-        .first()
-        .hasClass('active'),
+      container
+        .querySelectorAll('.ant-table-column-sorter-full')[0]
+        .querySelector('.ant-table-column-sorter-up')
+        .className.includes('active'),
     ).toBeTruthy();
     expect(
-      wrapper
-        .find('.ant-table-column-sorter-full')
-        .last()
-        .find('.ant-table-column-sorter-down')
-        .first()
-        .hasClass('active'),
+      container
+        .querySelectorAll('.ant-table-column-sorter-full')[1]
+        .querySelector('.ant-table-column-sorter-down')
+        .className.includes('active'),
     ).toBeTruthy();
   });
 
@@ -933,10 +965,12 @@ describe('Table.sorter', () => {
     ];
 
     const onChange = jest.fn();
-    const wrapper = mount(<Table columns={groupColumns} data={groupData} onChange={onChange} />);
+    const { container } = render(
+      <Table columns={groupColumns} data={groupData} onChange={onChange} />,
+    );
 
     function clickToMatchExpect(index, sorter) {
-      wrapper.find('.ant-table-column-sorters').at(index).simulate('click');
+      fireEvent.click(container.querySelectorAll('.ant-table-column-sorters')[index]);
 
       expect(onChange).toHaveBeenCalledWith(
         expect.anything(),
diff --git a/components/table/__tests__/Table.test.js b/components/table/__tests__/Table.test.js
index 789fd99210..c01015869e 100644
--- a/components/table/__tests__/Table.test.js
+++ b/components/table/__tests__/Table.test.js
@@ -1,9 +1,8 @@
 import React from 'react';
-import { mount } from 'enzyme';
 import Table from '..';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
-import { sleep, render } from '../../../tests/utils';
+import { sleep, render, fireEvent } from '../../../tests/utils';
 
 const { Column, ColumnGroup } = Table;
 
@@ -33,7 +32,7 @@ describe('Table', () => {
       },
     ];
 
-    const wrapper = mount(
+    const { asFragment } = render(
       <Table dataSource={data} pagination={false}>
         <ColumnGroup title="Name">
           <Column title="First Name" dataIndex="firstName" key="firstName" />
@@ -45,7 +44,7 @@ describe('Table', () => {
       </Table>,
     );
 
-    expect(wrapper.render()).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('updates columns when receiving props', () => {
@@ -56,7 +55,8 @@ describe('Table', () => {
         dataIndex: 'name',
       },
     ];
-    const wrapper = mount(<Table columns={columns} />);
+    const { container, rerender } = render(<Table columns={columns} />);
+
     const newColumns = [
       {
         title: 'Title',
@@ -64,9 +64,8 @@ describe('Table', () => {
         dataIndex: 'title',
       },
     ];
-    wrapper.setProps({ columns: newColumns });
-
-    expect(wrapper.find('th').text()).toEqual('Title');
+    rerender(<Table columns={newColumns} />);
+    expect(container.querySelector('th').textContent).toEqual('Title');
   });
 
   it('loading with Spin', async () => {
@@ -74,32 +73,34 @@ describe('Table', () => {
       spinning: false,
       delay: 500,
     };
-    const wrapper = mount(<Table loading={loading} />);
-    expect(wrapper.find('.ant-spin')).toHaveLength(0);
-    expect(wrapper.find('.ant-table-placeholder').hostNodes().text()).not.toEqual('');
+    const { container, rerender } = render(<Table loading={loading} />);
+    expect(container.querySelectorAll('.ant-spin')).toHaveLength(0);
+    expect(container.querySelector('.ant-table-placeholder').textContent).not.toEqual('');
 
     loading.spinning = true;
-    wrapper.setProps({ loading });
-    expect(wrapper.find('.ant-spin')).toHaveLength(0);
+    rerender(<Table loading={loading} />);
+    expect(container.querySelectorAll('.ant-spin')).toHaveLength(0);
     await sleep(500);
-    wrapper.update();
-    expect(wrapper.find('.ant-spin')).toHaveLength(1);
+    rerender(<Table loading />);
+    expect(container.querySelectorAll('.ant-spin')).toHaveLength(1);
   });
 
   // https://github.com/ant-design/ant-design/issues/22733
   it('support loading tip', async () => {
-    const wrapper = mount(<Table loading={{ tip: 'loading...' }} />);
+    const { container, rerender } = render(<Table loading={{ tip: 'loading...' }} />);
     await sleep(500);
-    wrapper.update();
-    expect(wrapper.find('.ant-spin')).toHaveLength(1);
+    rerender(<Table loading={{ tip: 'loading...', loading: true }} />);
+    expect(container.querySelectorAll('.ant-spin')).toHaveLength(1);
   });
 
   it('renders custom components correctly when it changes', () => {
     const BodyWrapper1 = props => <tbody id="wrapper1" {...props} />;
     const BodyWrapper2 = props => <tbody id="wrapper2" {...props} />;
-    const wrapper = mount(<Table components={{ body: { wrapper: BodyWrapper1 } }} />);
-    wrapper.setProps({ components: { body: { wrapper: BodyWrapper2 } } });
-    expect(wrapper.find('tbody').props().id).toBe('wrapper2');
+    const { container, rerender } = render(
+      <Table components={{ body: { wrapper: BodyWrapper1 } }} />,
+    );
+    rerender(<Table components={{ body: { wrapper: BodyWrapper2 } }} />);
+    expect(container.querySelector('tbody').id).toBe('wrapper2');
   });
 
   it('props#columnsPageRange and props#columnsPageSize do not warn anymore', () => {
@@ -118,7 +119,7 @@ describe('Table', () => {
 
     const columnsPageRange = jest.fn();
     const columnsPageSize = jest.fn();
-    mount(
+    render(
       <Table
         dataSource={data}
         rowkey="key"
@@ -139,15 +140,15 @@ describe('Table', () => {
 
   it('support onHeaderCell', () => {
     const onClick = jest.fn();
-    const wrapper = mount(
+    const { container } = render(
       <Table columns={[{ title: 'title', onHeaderCell: () => ({ onClick }) }]} />,
     );
-    wrapper.find('th').simulate('click');
+    fireEvent.click(container.querySelector('th'));
     expect(onClick).toHaveBeenCalled();
   });
 
   it('should not crash when column children is empty', () => {
-    mount(
+    render(
       <Table
         columns={[
           {
@@ -161,7 +162,7 @@ describe('Table', () => {
   });
 
   it('should not crash when dataSource is array with none-object items', () => {
-    mount(
+    render(
       <Table
         columns={[
           {
@@ -174,7 +175,9 @@ describe('Table', () => {
   });
 
   it('prevent touch event', () => {
-    const wrapper = mount(
+    // prevent touch event, 原来的用例感觉是少了 touchmove 调用判断
+    const touchmove = jest.fn();
+    const { container } = render(
       <Table
         columns={[
           {
@@ -185,7 +188,8 @@ describe('Table', () => {
         dataSource={[]}
       />,
     );
-    wrapper.simulate('touchmove');
+    fireEvent.touchMove(container.querySelector('.ant-table'));
+    expect(touchmove).not.toHaveBeenCalled();
   });
 
   it('renders ellipsis by showTitle option', () => {
@@ -203,9 +207,9 @@ describe('Table', () => {
       { title: 'id', dataKey: 'id', ellipsis: { showTitle: false } },
       { title: 'age', dataKey: 'age', ellipsis: { showTitle: false } },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={data} />);
-    wrapper.find('td').forEach(td => {
-      expect(td.hasClass('ant-table-cell-ellipsis')).toBeTruthy();
+    const { container } = render(<Table columns={columns} dataSource={data} />);
+    container.querySelectorAll('td').forEach(td => {
+      expect(td.className.includes('ant-table-cell-ellipsis')).toBe(true);
     });
   });
 
@@ -224,14 +228,13 @@ describe('Table', () => {
       { title: 'id', dataKey: 'id', ellipsis: { showTitle: true } },
       { title: 'age', dataKey: 'age', ellipsis: { showTitle: true } },
     ];
-    const wrapper = mount(<Table columns={columns} dataSource={data} />);
 
-    wrapper.find('.ant-table-thead th').forEach(td => {
-      expect(td.getDOMNode().attributes.getNamedItem('title')).toBeTruthy();
+    const { container } = render(<Table columns={columns} dataSource={data} />);
+    container.querySelectorAll('.ant-table-thead th').forEach(td => {
+      expect(td.attributes.title).toBeTruthy();
     });
-
-    wrapper.find('.ant-table-tbody td').forEach(td => {
-      expect(td.getDOMNode().attributes.getNamedItem('title')).toBeFalsy();
+    container.querySelectorAll('.ant-table-tbody td').forEach(td => {
+      expect(td.attributes.title).toBeFalsy();
     });
   });
 
@@ -244,7 +247,7 @@ describe('Table', () => {
         dataIndex: 'name',
       },
     ];
-    mount(<Table columns={columns} rowKey={(record, index) => record + index} />);
+    render(<Table columns={columns} rowKey={(record, index) => record + index} />);
     expect(warnSpy).toBeCalledWith(
       'Warning: [antd: Table] `index` parameter of `rowKey` function is deprecated. There is no guarantee that it will work as expected.',
     );
diff --git a/components/table/__tests__/__snapshots__/Table.filter.test.js.snap b/components/table/__tests__/__snapshots__/Table.filter.test.js.snap
index ef090d042c..52417d5f30 100644
--- a/components/table/__tests__/__snapshots__/Table.filter.test.js.snap
+++ b/components/table/__tests__/__snapshots__/Table.filter.test.js.snap
@@ -2,54 +2,46 @@
 
 exports[`Table.filter clearFilters should support params 1`] = `
 <div
-  className="ant-dropdown-custom-view"
+  class="ant-dropdown-custom-view"
   id="customFilter"
 >
   <span
     id="setNoParams"
-    onClick={[Function]}
   >
     setSelectedKeys
   </span>
   <span
     id="resetNoParams"
-    onClick={[Function]}
   >
     Reset
   </span>
   <span
     id="setConfirm"
-    onClick={[Function]}
   >
     setSelectedKeys
   </span>
   <span
     id="resetConfirm"
-    onClick={[Function]}
   >
     Reset
   </span>
   <span
     id="setClose"
-    onClick={[Function]}
   >
     setSelectedKeys
   </span>
   <span
     id="resetClose"
-    onClick={[Function]}
   >
     Reset
   </span>
   <span
     id="setParams"
-    onClick={[Function]}
   >
     setSelectedKeys
   </span>
   <span
     id="resetParams"
-    onClick={[Function]}
   >
     Reset
   </span>
@@ -58,37 +50,43 @@ exports[`Table.filter clearFilters should support params 1`] = `
 
 exports[`Table.filter override custom filter correctly 1`] = `
 <div
-  className="ant-dropdown-custom-view"
+  class="ant-dropdown-custom-view"
   id="customFilter"
 >
   <span
     id="setSelectedKeys"
-    onClick={[Function]}
   >
     setSelectedKeys
   </span>
   <span
     id="confirm"
-    onClick={[Function]}
   >
     Confirm
   </span>
   <span
     id="reset"
-    onClick={[Function]}
   >
     Reset
   </span>
   <span
     id="simulateOnSelect"
-    onClick={[Function]}
   >
     SimulateOnSelect
   </span>
 </div>
 `;
 
-exports[`Table.filter renders custom content correctly 1`] = `<div />`;
+exports[`Table.filter renders custom content correctly 1`] = `
+<div
+  class="ant-table-filter-dropdown"
+>
+  <div
+    class="custom-filter-dropdown"
+  >
+    custom filter
+  </div>
+</div>
+`;
 
 exports[`Table.filter renders custom filter icon as ReactNode 1`] = `
 <div
@@ -304,14 +302,6 @@ exports[`Table.filter renders custom filter icon correctly 1`] = `
 </span>
 `;
 
-exports[`Table.filter renders custom filter icon correctly 2`] = `
-<span
-  class="customize-icon"
->
-  unfiltered
-</span>
-`;
-
 exports[`Table.filter renders custom filter icon with right Tooltip title 1`] = `
 <div
   class="ant-table-wrapper"
@@ -562,6 +552,286 @@ exports[`Table.filter renders filter correctly 1`] = `
 </div>
 `;
 
-exports[`Table.filter renders menu correctly 1`] = `<div />`;
+exports[`Table.filter renders menu correctly 1`] = `
+<div
+  class="ant-table-filter-dropdown"
+>
+  <ul
+    class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
+    data-menu-list="true"
+    role="menu"
+    tabindex="0"
+  >
+    <li
+      class="ant-dropdown-menu-item"
+      data-menu-id="rc-menu-uuid-test-boy"
+      role="menuitem"
+      tabindex="-1"
+    >
+      <span
+        class="ant-dropdown-menu-title-content"
+      >
+        <label
+          class="ant-checkbox-wrapper"
+        >
+          <span
+            class="ant-checkbox"
+          >
+            <input
+              class="ant-checkbox-input"
+              type="checkbox"
+              value=""
+            />
+            <span
+              class="ant-checkbox-inner"
+            />
+          </span>
+        </label>
+        <span>
+          Boy
+        </span>
+      </span>
+    </li>
+    <li
+      class="ant-dropdown-menu-item"
+      data-menu-id="rc-menu-uuid-test-girl"
+      role="menuitem"
+      tabindex="-1"
+    >
+      <span
+        class="ant-dropdown-menu-title-content"
+      >
+        <label
+          class="ant-checkbox-wrapper"
+        >
+          <span
+            class="ant-checkbox"
+          >
+            <input
+              class="ant-checkbox-input"
+              type="checkbox"
+              value=""
+            />
+            <span
+              class="ant-checkbox-inner"
+            />
+          </span>
+        </label>
+        <span>
+          Girl
+        </span>
+      </span>
+    </li>
+    <li
+      class="ant-dropdown-menu-submenu ant-dropdown-menu-submenu-vertical"
+      role="none"
+    >
+      <div
+        aria-controls="rc-menu-uuid-test-title-popup"
+        aria-expanded="false"
+        aria-haspopup="true"
+        class="ant-dropdown-menu-submenu-title"
+        data-menu-id="rc-menu-uuid-test-title"
+        role="menuitem"
+        tabindex="-1"
+      >
+        <span
+          class="ant-dropdown-menu-title-content"
+        >
+          Title
+        </span>
+        <span
+          class="ant-dropdown-menu-submenu-expand-icon"
+        >
+          <span
+            aria-label="right"
+            class="anticon anticon-right ant-dropdown-menu-submenu-arrow-icon"
+            role="img"
+          >
+            <svg
+              aria-hidden="true"
+              data-icon="right"
+              fill="currentColor"
+              focusable="false"
+              height="1em"
+              viewBox="64 64 896 896"
+              width="1em"
+            >
+              <path
+                d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+              />
+            </svg>
+          </span>
+        </span>
+      </div>
+    </li>
+  </ul>
+  <div
+    aria-hidden="true"
+    style="display: none;"
+  />
+  <div
+    class="ant-table-filter-dropdown-btns"
+  >
+    <button
+      class="ant-btn ant-btn-link ant-btn-sm"
+      disabled=""
+      type="button"
+    >
+      <span>
+        Reset
+      </span>
+    </button>
+    <button
+      class="ant-btn ant-btn-primary ant-btn-sm"
+      type="button"
+    >
+      <span>
+        OK
+      </span>
+    </button>
+  </div>
+</div>
+`;
 
-exports[`Table.filter renders radio filter correctly 1`] = `<div />`;
+exports[`Table.filter renders radio filter correctly 1`] = `
+<div
+  class="ant-table-filter-dropdown"
+>
+  <ul
+    class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
+    data-menu-list="true"
+    role="menu"
+    tabindex="0"
+  >
+    <li
+      class="ant-dropdown-menu-item"
+      data-menu-id="rc-menu-uuid-test-boy"
+      role="menuitem"
+      tabindex="-1"
+    >
+      <span
+        class="ant-dropdown-menu-title-content"
+      >
+        <label
+          class="ant-radio-wrapper"
+        >
+          <span
+            class="ant-radio"
+          >
+            <input
+              class="ant-radio-input"
+              type="radio"
+              value=""
+            />
+            <span
+              class="ant-radio-inner"
+            />
+          </span>
+        </label>
+        <span>
+          Boy
+        </span>
+      </span>
+    </li>
+    <li
+      class="ant-dropdown-menu-item"
+      data-menu-id="rc-menu-uuid-test-girl"
+      role="menuitem"
+      tabindex="-1"
+    >
+      <span
+        class="ant-dropdown-menu-title-content"
+      >
+        <label
+          class="ant-radio-wrapper"
+        >
+          <span
+            class="ant-radio"
+          >
+            <input
+              class="ant-radio-input"
+              type="radio"
+              value=""
+            />
+            <span
+              class="ant-radio-inner"
+            />
+          </span>
+        </label>
+        <span>
+          Girl
+        </span>
+      </span>
+    </li>
+    <li
+      class="ant-dropdown-menu-submenu ant-dropdown-menu-submenu-vertical"
+      role="none"
+    >
+      <div
+        aria-controls="rc-menu-uuid-test-title-popup"
+        aria-expanded="false"
+        aria-haspopup="true"
+        class="ant-dropdown-menu-submenu-title"
+        data-menu-id="rc-menu-uuid-test-title"
+        role="menuitem"
+        tabindex="-1"
+      >
+        <span
+          class="ant-dropdown-menu-title-content"
+        >
+          Title
+        </span>
+        <span
+          class="ant-dropdown-menu-submenu-expand-icon"
+        >
+          <span
+            aria-label="right"
+            class="anticon anticon-right ant-dropdown-menu-submenu-arrow-icon"
+            role="img"
+          >
+            <svg
+              aria-hidden="true"
+              data-icon="right"
+              fill="currentColor"
+              focusable="false"
+              height="1em"
+              viewBox="64 64 896 896"
+              width="1em"
+            >
+              <path
+                d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+              />
+            </svg>
+          </span>
+        </span>
+      </div>
+    </li>
+  </ul>
+  <div
+    aria-hidden="true"
+    style="display: none;"
+  />
+  <div
+    class="ant-table-filter-dropdown-btns"
+  >
+    <button
+      class="ant-btn ant-btn-link ant-btn-sm"
+      disabled=""
+      type="button"
+    >
+      <span>
+        Reset
+      </span>
+    </button>
+    <button
+      class="ant-btn ant-btn-primary ant-btn-sm"
+      type="button"
+    >
+      <span>
+        OK
+      </span>
+    </button>
+  </div>
+</div>
+`;
diff --git a/components/table/__tests__/__snapshots__/empty.test.js.snap b/components/table/__tests__/__snapshots__/empty.test.js.snap
index 2b41d2ddc2..ce90c11240 100644
--- a/components/table/__tests__/__snapshots__/empty.test.js.snap
+++ b/components/table/__tests__/__snapshots__/empty.test.js.snap
@@ -20,7 +20,7 @@ exports[`Table renders empty table 1`] = `
             class="ant-table-content"
           >
             <table
-              style="table-layout:auto"
+              style="table-layout: auto;"
             >
               <colgroup />
               <thead
@@ -157,7 +157,7 @@ exports[`Table renders empty table with custom emptyText 1`] = `
             class="ant-table-content"
           >
             <table
-              style="table-layout:auto"
+              style="table-layout: auto;"
             >
               <colgroup />
               <thead
@@ -247,17 +247,17 @@ exports[`Table renders empty table with fixed columns 1`] = `
         >
           <div
             class="ant-table-content"
-            style="overflow-x:auto;overflow-y:hidden"
+            style="overflow-x: auto; overflow-y: hidden;"
           >
             <table
-              style="width:1px;min-width:100%;table-layout:fixed"
+              style="width: 1px; min-width: 100%; table-layout: fixed;"
             >
               <colgroup>
                 <col
-                  style="width:100px"
+                  style="width: 100px;"
                 />
                 <col
-                  style="width:100px"
+                  style="width: 100px;"
                 />
                 <col />
                 <col />
@@ -268,7 +268,7 @@ exports[`Table renders empty table with fixed columns 1`] = `
                 <col />
                 <col />
                 <col
-                  style="width:100px"
+                  style="width: 100px;"
                 />
               </colgroup>
               <thead
@@ -277,13 +277,13 @@ exports[`Table renders empty table with fixed columns 1`] = `
                 <tr>
                   <th
                     class="ant-table-cell ant-table-cell-fix-left"
-                    style="position:sticky;left:0"
+                    style="position: sticky; left: 0px;"
                   >
                     Full Name
                   </th>
                   <th
                     class="ant-table-cell ant-table-cell-fix-left ant-table-cell-fix-left-last"
-                    style="position:sticky;left:0"
+                    style="position: sticky; left: 0px;"
                   >
                     Age
                   </th>
@@ -329,7 +329,7 @@ exports[`Table renders empty table with fixed columns 1`] = `
                   </th>
                   <th
                     class="ant-table-cell ant-table-cell-fix-right ant-table-cell-fix-right-first"
-                    style="position:sticky;right:0"
+                    style="position: sticky; right: 0px;"
                   >
                     Action
                   </th>
@@ -341,103 +341,103 @@ exports[`Table renders empty table with fixed columns 1`] = `
                 <tr
                   aria-hidden="true"
                   class="ant-table-measure-row"
-                  style="height:0;font-size:0"
+                  style="height: 0px; font-size: 0px;"
                 >
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
                   </td>
                   <td
-                    style="padding:0;border:0;height:0"
+                    style="padding: 0px; border: 0px; height: 0px;"
                   >
                     <div
-                      style="height:0;overflow:hidden"
+                      style="height: 0px; overflow: hidden;"
                     >
                        
                     </div>
@@ -452,7 +452,7 @@ exports[`Table renders empty table with fixed columns 1`] = `
                   >
                     <div
                       class="ant-table-expanded-row-fixed"
-                      style="width:0;position:sticky;left:0;overflow:hidden"
+                      style="width: 0px; position: sticky; left: 0px; overflow: hidden;"
                     >
                       <div
                         class="ant-empty ant-empty-normal"
@@ -557,7 +557,7 @@ exports[`Table renders empty table without emptyText when loading 1`] = `
             class="ant-table-content"
           >
             <table
-              style="table-layout:auto"
+              style="table-layout: auto;"
             >
               <colgroup />
               <thead
diff --git a/components/table/__tests__/empty.test.js b/components/table/__tests__/empty.test.js
index 1e584613a3..25873e9ff9 100644
--- a/components/table/__tests__/empty.test.js
+++ b/components/table/__tests__/empty.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render } from 'enzyme';
+import { render } from '../../../tests/utils';
 import Table from '..';
 
 const columns = [
@@ -46,19 +46,19 @@ const columnsFixed = [
 
 describe('Table', () => {
   it('renders empty table', () => {
-    const wrapper = render(<Table dataSource={[]} columns={columns} pagination={false} />);
-    expect(wrapper).toMatchSnapshot();
+    const { asFragment } = render(<Table dataSource={[]} columns={columns} pagination={false} />);
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('renders empty table with fixed columns', () => {
-    const wrapper = render(
+    const { asFragment } = render(
       <Table dataSource={[]} columns={columnsFixed} pagination={false} scroll={{ x: 1 }} />,
     );
-    expect(wrapper).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('renders empty table with custom emptyText', () => {
-    const wrapper = render(
+    const { asFragment } = render(
       <Table
         dataSource={[]}
         columns={columns}
@@ -66,11 +66,11 @@ describe('Table', () => {
         locale={{ emptyText: 'custom empty text' }}
       />,
     );
-    expect(wrapper).toMatchSnapshot();
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('renders empty table without emptyText when loading', () => {
-    const wrapper = render(<Table dataSource={[]} columns={columns} loading />);
-    expect(wrapper).toMatchSnapshot();
+    const { asFragment } = render(<Table dataSource={[]} columns={columns} loading />);
+    expect(asFragment().firstChild).toMatchSnapshot();
   });
 });