[EuiDataGrid][bonus] remove all enzyme in favor of RTL

src/components/datagrid/body/header/__snapshots__/data_grid_header_cell.test.tsx.snap

@@ -1,117 +1,58 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`EuiDataGridHeaderCell renders 1`] = `
-<EuiDataGridHeaderCellWrapper
-  className="euiDataGridHeaderCell--numeric"
-  headerIsInteractive={false}
-  id="someColumn"
-  index={0}
-  width={50}
+<div
+  class="euiDataGridHeaderCell euiDataGridHeaderCell--numeric"
+  data-gridcell-column-id="someColumn"
+  data-gridcell-column-index="0"
+  data-gridcell-row-index="-1"
+  data-gridcell-visible-row-index="-1"
+  data-test-subj="dataGridHeaderCell-someColumn"
+  role="columnheader"
+  style="width: 50px;"
+  tabindex="-1"
 >
-  <EuiDataGridColumnResizer
-    columnId="someColumn"
-    columnWidth={50}
-    setColumnWidth={[MockFunction]}
+  <div
+    class="euiDataGridColumnResizer"
+    data-test-subj="dataGridColumnResizer"
+    style="margin-right: 0px;"
   />
-  <EuiPopover
-    anchorClassName="eui-fullWidth"
-    anchorPosition="downCenter"
-    button={
+  <div
+    class="euiPopover eui-fullWidth emotion-euiPopover"
+  >
+    <div
+      class="euiPopover__anchor eui-fullWidth css-16vtueo-render"
+    >
       <button
         aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-        className="euiDataGridHeaderCell__button"
-        onClick={[Function]}
+        class="euiDataGridHeaderCell__button"
+        data-euigrid-tab-managed="true"
+        tabindex="-1"
       >
         <div
-          className="euiDataGridHeaderCell__content"
+          class="euiDataGridHeaderCell__content"
           title="someColumn"
         >
           someColumn
         </div>
-        <EuiIcon
-          className="euiDataGridHeaderCell__icon"
+        <span
+          class="euiDataGridHeaderCell__icon"
           color="text"
+          data-euiicon-type="arrowDown"
           data-test-subj="dataGridHeaderCellActionButton-someColumn"
-          size="s"
-          type="arrowDown"
         />
       </button>
-    }
-    className="eui-fullWidth"
-    closePopover={[Function]}
-    display="inline-block"
-    hasArrow={true}
-    isOpen={false}
-    offset={7}
-    ownFocus={true}
-    panelPaddingSize="none"
-    panelProps={
-      Object {
-        "onKeyDown": [Function],
-      }
-    }
-    panelRef={[Function]}
-    popoverScreenReaderText={
-      <EuiI18n
-        default="To navigate through the list of column actions, press the Tab or Up and Down arrow keys."
-        token="euiDataGridHeaderCell.actionsPopoverScreenReaderText"
-      />
-    }
-    repositionToCrossAxis={true}
-  >
-    <EuiListGroup
-      data-test-subj="dataGridHeaderCellActionGroup-someColumn"
-      gutterSize="none"
-      listItems={
-        Array [
-          Object {
-            "color": "text",
-            "iconType": "eyeClosed",
-            "label": <EuiI18n
-              default="Hide column"
-              token="euiColumnActions.hideColumn"
-            />,
-            "onClick": [Function],
-            "size": "xs",
-          },
-          Object {
-            "color": "text",
-            "iconType": "sortLeft",
-            "isDisabled": false,
-            "label": <EuiI18n
-              default="Move left"
-              token="euiColumnActions.moveLeft"
-            />,
-            "onClick": [Function],
-            "size": "xs",
-          },
-          Object {
-            "color": "text",
-            "iconType": "sortRight",
-            "isDisabled": true,
-            "label": <EuiI18n
-              default="Move right"
-              token="euiColumnActions.moveRight"
-            />,
-            "onClick": [Function],
-            "size": "xs",
-          },
-        ]
-      }
-    />
-  </EuiPopover>
+    </div>
+  </div>
   <p
-    hidden={true}
+    hidden=""
     id="euiDataGridCellHeader_generated-id_sorting"
   />
   <p
-    hidden={true}
+    hidden=""
     id="euiDataGridCellHeader_generated-id_actions"
   >
-    <EuiI18n
-      default="Click to view column header actions"
-      token="euiDataGridHeaderCell.headerActions"
-    />
+    Click to view column header actions
   </p>
-</EuiDataGridHeaderCellWrapper>
+</div>
 `;

src/components/datagrid/body/header/data_grid_header_cell.test.tsx

@@ -7,8 +7,13 @@
  */
 
 import React, { ReactNode } from 'react';
-import { mount, shallow } from 'enzyme';
-import { render, renderHook } from '../../../../test/rtl';
+import { fireEvent } from '@testing-library/react';
+import {
+  render,
+  renderHook,
+  waitForEuiPopoverOpen,
+  waitForEuiPopoverClose,
+} from '../../../../test/rtl';
 
 import { DataGridFocusContext } from '../../utils/focus';
 import { mockFocusContext } from '../../utils/__mocks__/focus_context';
@@ -37,8 +42,8 @@ describe('EuiDataGridHeaderCell', () => {
   };
 
   it('renders', () => {
-    const component = shallow(<EuiDataGridHeaderCell {...requiredProps} />);
-    expect(component).toMatchSnapshot();
+    const { container } = render(<EuiDataGridHeaderCell {...requiredProps} />);
+    expect(container.firstChild).toMatchSnapshot();
   });
 
   describe('sorting', () => {
@@ -197,60 +202,63 @@ describe('EuiDataGridHeaderCell', () => {
 
   describe('resizing', () => {
     it('renders a resizer', () => {
-      const component = shallow(<EuiDataGridHeaderCell {...requiredProps} />);
-      expect(component.find('EuiDataGridColumnResizer')).toHaveLength(1);
+      const { getByTestSubject } = render(
+        <EuiDataGridHeaderCell {...requiredProps} />
+      );
+      expect(getByTestSubject('dataGridColumnResizer')).toBeInTheDocument();
     });
 
     it('does not render a resizer if isResizable is false', () => {
-      const component = shallow(
+      const { queryByTestSubject } = render(
         <EuiDataGridHeaderCell
           {...requiredProps}
           column={{ id: 'test', isResizable: false }}
         />
       );
-      expect(component.find('EuiDataGridColumnResizer')).toHaveLength(0);
+      expect(
+        queryByTestSubject('dataGridColumnResizer')
+      ).not.toBeInTheDocument();
     });
 
     it('does not render a resizer if a column width cannot be found', () => {
-      const component = shallow(
+      const { queryByTestSubject } = render(
         <EuiDataGridHeaderCell
           {...requiredProps}
           columnWidths={{}}
           defaultColumnWidth={undefined}
         />
       );
-      expect(component.find('EuiDataGridColumnResizer')).toHaveLength(0);
+      expect(
+        queryByTestSubject('dataGridColumnResizer')
+      ).not.toBeInTheDocument();
     });
   });
 
   describe('popover', () => {
     it('does not render a popover if there are no column actions', () => {
-      const component = shallow(
+      const { container } = render(
         <EuiDataGridHeaderCell
           {...requiredProps}
           column={{ id: 'test', actions: false }}
         />
       );
-      expect(component.find('EuiPopover')).toHaveLength(0);
+      expect(container.querySelector('.euiPopover')).not.toBeInTheDocument();
     });
 
-    it('handles popover open', () => {
-      const component = mount(
+    it('handles popover open and close', () => {
+      const { container } = render(
         <DataGridFocusContext.Provider value={mockFocusContext}>
           <EuiDataGridHeaderCell {...requiredProps} />
         </DataGridFocusContext.Provider>
       );
-      component.find('.euiDataGridHeaderCell__button').simulate('click');
+      const toggle = container.querySelector('.euiDataGridHeaderCell__button')!;
 
-      expect(component.find('EuiPopover').prop('isOpen')).toEqual(true);
+      fireEvent.click(toggle);
+      waitForEuiPopoverOpen();
       expect(mockFocusContext.setFocusedCell).toHaveBeenCalledWith([0, -1]);
-    });
-
-    it('handles popover close', () => {
-      const component = shallow(<EuiDataGridHeaderCell {...requiredProps} />);
-      (component.find('EuiPopover').prop('closePopover') as Function)();
 
-      expect(component.find('EuiPopover').prop('isOpen')).toEqual(false);
+      fireEvent.click(toggle);
+      waitForEuiPopoverClose();
     });
 
     describe('keyboard arrow navigation', () => {

src/components/datagrid/utils/focus.test.tsx

@@ -7,8 +7,7 @@
  */
 
 import React from 'react';
-import { mount } from 'enzyme';
-import { renderHook, renderHookAct } from '../../../test/rtl';
+import { render, renderHook, renderHookAct } from '../../../test/rtl';
 import { keys } from '../../../services';
 import {
   DataGridFocusContext,
@@ -614,7 +613,7 @@ describe('useHeaderFocusWorkaround', () => {
   it('moves focus down from the header to the first data row if the header becomes uninteractive', () => {
     const focusedCell = [2, -1];
     const setFocusedCell = jest.fn();
-    mount(
+    render(
       <DataGridFocusContext.Provider
         value={{ focusedCell, setFocusedCell } as any}
       >
@@ -627,7 +626,7 @@ describe('useHeaderFocusWorkaround', () => {
   it('does nothing if the focus was not on the header when the header became uninteractive', () => {
     const focusedCell = [2, 0];
     const setFocusedCell = jest.fn();
-    mount(
+    render(
       <DataGridFocusContext.Provider
         value={{ focusedCell, setFocusedCell } as any}
       >