From f0ca35fd92594e8c36ec132d73e5b0d90a1b472d Mon Sep 17 00:00:00 2001
From: Alison Joseph <alison.joseph@us.ibm.com>
Date: Thu, 16 Feb 2023 10:17:53 -0600
Subject: [PATCH 1/3] test(TableToolbarMenu): update tests to RTL

---
 .../__tests__/TableToolbarMenu-test.js        |  75 +++---
 .../TableToolbarMenu-test.js.snap             | 234 ++++--------------
 2 files changed, 92 insertions(+), 217 deletions(-)

diff --git a/packages/react/src/components/DataTable/__tests__/TableToolbarMenu-test.js b/packages/react/src/components/DataTable/__tests__/TableToolbarMenu-test.js
index ef23bc64c8ef..653ae8e91242 100644
--- a/packages/react/src/components/DataTable/__tests__/TableToolbarMenu-test.js
+++ b/packages/react/src/components/DataTable/__tests__/TableToolbarMenu-test.js
@@ -1,40 +1,57 @@
 /**
- * Copyright IBM Corp. 2016, 2018
+ * Copyright IBM Corp. 2016, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 import React from 'react';
-import { mount } from 'enzyme';
+import TableToolbarMenu from '../TableToolbarMenu';
 import { Download } from '@carbon/icons-react';
-import { TableToolbarMenu } from '..';
-
-describe('DataTable.TableToolbarMenu', () => {
-  it('should render', () => {
-    const wrapper = mount(
-      <TableToolbarMenu
-        className="custom-class"
-        renderIcon={Download}
-        iconDescription="Add">
-        <span>test</span>
-      </TableToolbarMenu>
-    );
-    expect(wrapper).toMatchSnapshot();
-  });
-});
+import { render, screen } from '@testing-library/react';
+
+describe('TableToolbarMenu', () => {
+  describe('renders as expected - Component API', () => {
+    it('should render', () => {
+      const { container } = render(
+        <TableToolbarMenu
+          className="custom-class"
+          renderIcon={Download}
+          iconDescription="Add">
+          <span>test</span>
+        </TableToolbarMenu>
+      );
+
+      expect(container).toMatchSnapshot();
+    });
+
+    it('should support a custom `className` prop on the outermost element', () => {
+      render(
+        <TableToolbarMenu className="custom-class">
+          <span>test</span>
+        </TableToolbarMenu>
+      );
+      expect(screen.getByRole('button')).toHaveClass('custom-class');
+    });
+
+    it('should respect iconDescription prop', () => {
+      render(
+        <TableToolbarMenu iconDescription="Icon description">
+          <span>test</span>
+        </TableToolbarMenu>
+      );
+
+      expect(screen.getByText('Icon description')).toBeInTheDocument();
+    });
+
+    it('should respect renderIcon prop', () => {
+      render(
+        <TableToolbarMenu renderIcon={Download} iconDescription="Download">
+          <span>test</span>
+        </TableToolbarMenu>
+      );
 
-describe('Custom icon in DataTable.TableToolbarMenu', () => {
-  it('should render', () => {
-    const iconAction = mount(
-      <TableToolbarMenu renderIcon={Download} iconDescription="Download">
-        <span>test</span>
-      </TableToolbarMenu>
-    );
-    const originalIcon = mount(<Download />).find('svg');
-    const icon = iconAction.find('svg');
-    expect(icon.getDOMNode().querySelectorAll(':not(svg):not(title)')).toEqual(
-      originalIcon.getDOMNode().querySelectorAll(':not(svg):not(title)')
-    );
+      expect(screen.getByRole('img')).toHaveAttribute('aria-label', 'Download');
+    });
   });
 });
diff --git a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
index b0ba7b80a255..477e5b47f1e6 100644
--- a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
+++ b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
@@ -1,197 +1,55 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`DataTable.TableToolbarMenu should render 1`] = `
-<TableToolbarMenu
-  className="custom-class"
-  iconDescription="Add"
-  renderIcon={
-    Object {
-      "$$typeof": Symbol(react.forward_ref),
-      "propTypes": Object {
-        "size": [Function],
-      },
-      "render": [Function],
-    }
-  }
->
-  <ClassWrapper(OverflowMenu)
-    ariaLabel="Add"
-    className="custom-class cds--toolbar-action cds--overflow-menu"
-    flipped={true}
-    iconDescription="Add"
-    renderIcon={
-      Object {
-        "$$typeof": Symbol(react.forward_ref),
-        "propTypes": Object {
-          "size": [Function],
-        },
-        "render": [Function],
-      }
-    }
-    title="Add"
+exports[`TableToolbarMenu renders as expected - Component API should render 1`] = `
+<div>
+  <span
+    class="cds--overflow-menu__wrapper"
   >
-    <OverflowMenu
-      ariaLabel="Add"
-      className="custom-class cds--toolbar-action cds--overflow-menu"
-      direction="bottom"
-      flipped={true}
-      focusTrap={true}
-      iconDescription="Add"
-      menuOffset={[Function]}
-      menuOffsetFlip={[Function]}
-      onClick={[Function]}
-      onClose={[Function]}
-      onKeyDown={[Function]}
-      onOpen={[Function]}
-      open={false}
-      renderIcon={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "propTypes": Object {
-            "size": [Function],
-          },
-          "render": [Function],
-        }
-      }
-      selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
-      title="Add"
+    <span
+      class="cds--popover-container cds--popover--caret cds--popover--high-contrast cds--popover--top cds--tooltip cds--icon-tooltip"
     >
-      <ClickListener
-        onClickOutside={[Function]}
+      <button
+        aria-expanded="false"
+        aria-haspopup="true"
+        aria-labelledby="tooltip-2"
+        class="cds--btn--icon-only custom-class cds--toolbar-action cds--overflow-menu cds--overflow-menu cds--overflow-menu--md cds--btn cds--btn--md cds--btn--primary"
+        tabindex="0"
+        title="Add"
+        type="button"
+      >
+        <svg
+          aria-label="Add"
+          class="cds--overflow-menu__icon"
+          fill="currentColor"
+          focusable="false"
+          height="16"
+          preserveAspectRatio="xMidYMid meet"
+          role="img"
+          viewBox="0 0 16 16"
+          width="16"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M13 7L12.3 6.3 8.5 10.1 8.5 1 7.5 1 7.5 10.1 3.7 6.3 3 7 8 12zM13 12v2H3v-2H2v2l0 0c0 .6.4 1 1 1h10c.6 0 1-.4 1-1l0 0v-2H13z"
+          />
+        </svg>
+      </button>
+      <span
+        aria-hidden="true"
+        class="cds--popover"
+        id="tooltip-2"
+        role="tooltip"
       >
         <span
-          className="cds--overflow-menu__wrapper"
+          class="cds--popover-content cds--tooltip-content"
         >
-          <ForwardRef(IconButton)
-            aria-expanded={false}
-            aria-haspopup={true}
-            className="custom-class cds--toolbar-action cds--overflow-menu cds--overflow-menu cds--overflow-menu--md"
-            label="Add"
-            onClick={[Function]}
-            onClose={[Function]}
-            onKeyDown={[Function]}
-            open={false}
-            title="Add"
-            type="button"
-          >
-            <Tooltip
-              className="cds--icon-tooltip"
-              closeOnActivation={true}
-              defaultOpen={false}
-              label="Add"
-            >
-              <Popover
-                align="top"
-                className="cds--tooltip cds--icon-tooltip"
-                dropShadow={false}
-                highContrast={true}
-                onKeyDown={[Function]}
-                onMouseLeave={[Function]}
-                open={false}
-              >
-                <span
-                  className="cds--popover-container cds--popover--caret cds--popover--high-contrast cds--popover--top cds--tooltip cds--icon-tooltip"
-                  onKeyDown={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <Button
-                    aria-expanded={false}
-                    aria-haspopup={true}
-                    aria-labelledby="tooltip-2"
-                    className="cds--btn--icon-only custom-class cds--toolbar-action cds--overflow-menu cds--overflow-menu cds--overflow-menu--md"
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onClose={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onMouseEnter={[Function]}
-                    open={false}
-                    size="md"
-                    title="Add"
-                    type="button"
-                  >
-                    <button
-                      aria-describedby={null}
-                      aria-expanded={false}
-                      aria-haspopup={true}
-                      aria-labelledby="tooltip-2"
-                      aria-pressed={null}
-                      className="cds--btn--icon-only custom-class cds--toolbar-action cds--overflow-menu cds--overflow-menu cds--overflow-menu--md cds--btn cds--btn--md cds--btn--primary"
-                      disabled={false}
-                      onBlur={[Function]}
-                      onClick={[Function]}
-                      onClose={[Function]}
-                      onFocus={[Function]}
-                      onKeyDown={[Function]}
-                      onMouseEnter={[Function]}
-                      open={false}
-                      tabIndex={0}
-                      title="Add"
-                      type="button"
-                    >
-                      <ForwardRef(Download)
-                        aria-label="Add"
-                        className="cds--overflow-menu__icon"
-                      >
-                        <Icon
-                          aria-label="Add"
-                          className="cds--overflow-menu__icon"
-                          fill="currentColor"
-                          height={16}
-                          preserveAspectRatio="xMidYMid meet"
-                          viewBox="0 0 16 16"
-                          width={16}
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <svg
-                            aria-label="Add"
-                            className="cds--overflow-menu__icon"
-                            fill="currentColor"
-                            focusable="false"
-                            height={16}
-                            preserveAspectRatio="xMidYMid meet"
-                            role="img"
-                            viewBox="0 0 16 16"
-                            width={16}
-                            xmlns="http://www.w3.org/2000/svg"
-                          >
-                            <path
-                              d="M13 7L12.3 6.3 8.5 10.1 8.5 1 7.5 1 7.5 10.1 3.7 6.3 3 7 8 12zM13 12v2H3v-2H2v2l0 0c0 .6.4 1 1 1h10c.6 0 1-.4 1-1l0 0v-2H13z"
-                            />
-                          </svg>
-                        </Icon>
-                      </ForwardRef(Download)>
-                    </button>
-                  </Button>
-                  <ForwardRef(PopoverContent)
-                    aria-hidden="true"
-                    className="cds--tooltip-content"
-                    id="tooltip-2"
-                    role="tooltip"
-                  >
-                    <span
-                      aria-hidden="true"
-                      className="cds--popover"
-                      id="tooltip-2"
-                      role="tooltip"
-                    >
-                      <span
-                        className="cds--popover-content cds--tooltip-content"
-                      >
-                        Add
-                      </span>
-                      <span
-                        className="cds--popover-caret"
-                      />
-                    </span>
-                  </ForwardRef(PopoverContent)>
-                </span>
-              </Popover>
-            </Tooltip>
-          </ForwardRef(IconButton)>
+          Add
         </span>
-      </ClickListener>
-    </OverflowMenu>
-  </ClassWrapper(OverflowMenu)>
-</TableToolbarMenu>
+        <span
+          class="cds--popover-caret"
+        />
+      </span>
+    </span>
+  </span>
+</div>
 `;

From ba70992073d8df6d37ad87c1d2f94e92cf03b87d Mon Sep 17 00:00:00 2001
From: Alison Joseph <alisonejoseph@Gmail.com>
Date: Thu, 23 Feb 2023 10:18:03 -0600
Subject: [PATCH 2/3] Update TableToolbarMenu-test.js.snap

---
 .../__tests__/__snapshots__/TableToolbarMenu-test.js.snap       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
index 477e5b47f1e6..f868d3499074 100644
--- a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
+++ b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
@@ -52,4 +52,4 @@ exports[`TableToolbarMenu renders as expected - Component API should render 1`]
     </span>
   </span>
 </div>
-`;
+`; 

From a2a46fd3a36ec30ce1124c28aa29902f1236bad0 Mon Sep 17 00:00:00 2001
From: Alison Joseph <alison.joseph@us.ibm.com>
Date: Thu, 23 Feb 2023 10:30:01 -0600
Subject: [PATCH 3/3] chore: fix merge conflicts

---
 .../__tests__/__snapshots__/TableToolbarMenu-test.js.snap      | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
index b075dbe6cc56..b8b4c701697e 100644
--- a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
+++ b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableToolbarMenu-test.js.snap
@@ -13,7 +13,6 @@ exports[`TableToolbarMenu renders as expected - Component API should render 1`]
         aria-haspopup="true"
         aria-labelledby="tooltip-2"
         class="cds--btn--icon-only custom-class cds--toolbar-action cds--overflow-menu cds--overflow-menu cds--overflow-menu--md cds--btn cds--btn--md cds--btn--primary"
-        tabindex="0"
         title="Add"
         type="button"
       >
@@ -52,4 +51,4 @@ exports[`TableToolbarMenu renders as expected - Component API should render 1`]
     </span>
   </span>
 </div>
-`; 
\ No newline at end of file
+`;