From 0591bf34365ee07b242f0a208e4037e7e576f195 Mon Sep 17 00:00:00 2001
From: Josh Black <josh@josh.black>
Date: Wed, 25 May 2022 13:51:31 -0500
Subject: [PATCH] refactor(react): update table container tests to use
 testing-library

---
 .../__tests__/TableContainer-test.js          | 28 +++++++++++++------
 .../__snapshots__/TableContainer-test.js.snap | 21 --------------
 2 files changed, 20 insertions(+), 29 deletions(-)
 delete mode 100644 packages/react/src/components/DataTable/__tests__/__snapshots__/TableContainer-test.js.snap

diff --git a/packages/react/src/components/DataTable/__tests__/TableContainer-test.js b/packages/react/src/components/DataTable/__tests__/TableContainer-test.js
index 407046db82b2..5a6ecf274df0 100644
--- a/packages/react/src/components/DataTable/__tests__/TableContainer-test.js
+++ b/packages/react/src/components/DataTable/__tests__/TableContainer-test.js
@@ -5,18 +5,30 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { render } from '@testing-library/react';
 import React from 'react';
-import { mount } from 'enzyme';
 import { TableContainer } from '../';
 
-describe('DataTable.TableContainer', () => {
-  it('should render', () => {
-    const wrapper = mount(<TableContainer className="custom-class" />);
-    expect(wrapper).toMatchSnapshot();
+describe('TableContainer', () => {
+  it('should set the max-width class if stickyHeader is true', () => {
+    const { container } = render(<TableContainer stickyHeader />);
+    expect(container.firstChild).toHaveClass('cds--data-table--max-width');
   });
 
-  it('should support enable sticky header', () => {
-    const wrapper = mount(<TableContainer stickyHeader={true} />);
-    expect(wrapper).toMatchSnapshot();
+  it('should set the static class if useStaticWidth is true', () => {
+    const { container } = render(<TableContainer useStaticWidth />);
+    expect(container.firstChild).toHaveClass(
+      'cds--data-table-container--static'
+    );
+  });
+
+  it('should support a custom className on the outermost element', () => {
+    const { container } = render(<TableContainer className="custom-class" />);
+    expect(container.firstChild).toHaveClass('custom-class');
+  });
+
+  it('should spread props onto the <table> element', () => {
+    const { container } = render(<TableContainer data-testid="test" />);
+    expect(container.firstChild).toHaveAttribute('data-testid', 'test');
   });
 });
diff --git a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableContainer-test.js.snap b/packages/react/src/components/DataTable/__tests__/__snapshots__/TableContainer-test.js.snap
deleted file mode 100644
index f00a32ffe221..000000000000
--- a/packages/react/src/components/DataTable/__tests__/__snapshots__/TableContainer-test.js.snap
+++ /dev/null
@@ -1,21 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`DataTable.TableContainer should render 1`] = `
-<TableContainer
-  className="custom-class"
->
-  <div
-    className="custom-class cds--data-table-container"
-  />
-</TableContainer>
-`;
-
-exports[`DataTable.TableContainer should support enable sticky header 1`] = `
-<TableContainer
-  stickyHeader={true}
->
-  <div
-    className="cds--data-table-container cds--data-table--max-width"
-  />
-</TableContainer>
-`;