Added terra-enzyme-intl to jest config (#4025)

cerner · Feb 8, 2024 · fd160f6 · fd160f6
1 parent c55faac
commit fd160f6
Show file tree

Hide file tree

Showing 120 changed files with 1,067 additions and 1,159 deletions.
diff --git a/jest.enzymeSetup.js b/jest.enzymeSetup.js
@@ -1,10 +1,11 @@
 // Make Enzyme functions available in all test files without importing
 /* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable object-curly-newline */
 import Enzyme, { mount, render, shallow } from 'enzyme';
+import { mockIntl, mountWithIntl, renderWithIntl, shallowWithIntl } from 'terra-enzyme-intl';
 import Adapter from 'enzyme-adapter-react-16';
 
 Enzyme.configure({ adapter: new Adapter() });
 
-global.shallow = shallow;
-global.render = render;
-global.mount = mount;
+global.enzyme = { mount, render, shallow };
+global.enzymeIntl = { mockIntl, mountWithIntl, renderWithIntl, shallowWithIntl };
diff --git a/package.json b/package.json
@@ -29,7 +29,11 @@
     "extends @cerner/browserslist-config-terra"
   ],
   "eslintConfig": {
-    "extends": "@cerner/terra"
+    "extends": "@cerner/terra",
+    "globals": {
+      "enzyme":"readonly",
+      "enzymeIntl":"readonly"
+    }
   },
   "package-json-lint": {
     "extends": "@cerner/package-json-lint-config-terra/package-json-lint.config.js",

diff --git a/packages/terra-action-footer/tests/jest/ActionFooter.test.jsx b/packages/terra-action-footer/tests/jest/ActionFooter.test.jsx
@@ -6,12 +6,12 @@ describe('ActionFooter', () => {
   describe('Snapshot Tests', () => {
     it('should render an empty footer', () => {
       const component = <ActionFooter />;
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with only one start-actions button', () => {
       const component = <ActionFooter start={<button type="button">Start Button</button>} />;
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with only two start-actions buttons', () => {
@@ -25,12 +25,12 @@ describe('ActionFooter', () => {
 )}
         />
       );
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with only an end-actions button', () => {
       const component = <ActionFooter end={<button type="button">End Button</button>} />;
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with only two end-actions buttons', () => {
@@ -44,7 +44,7 @@ describe('ActionFooter', () => {
 )}
         />
       );
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with both start and end socket buttons', () => {
@@ -54,38 +54,38 @@ describe('ActionFooter', () => {
           end={<button type="button">End Button</button>}
         />
       );
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
   });
 
   // Prop Tests
   describe('Prop Tests', () => {
     describe('without start or end actions', () => {
-      const actionFooter = mount(<ActionFooter />);
+      const actionFooter = enzyme.mount(<ActionFooter />);
 
       it('should display no actions', () => (
         expect(actionFooter).toMatchSnapshot()
       ));
     });
 
     describe('with only a start action', () => {
-      const actionFooter = mount(<ActionFooter start="Start Action" />);
+      const actionFooter = enzyme.mount(<ActionFooter start="Start Action" />);
 
       it('should only display a start action', () => (
         expect(actionFooter).toMatchSnapshot()
       ));
     });
 
     describe('with only an end action', () => {
-      const actionFooter = mount(<ActionFooter end="End Action" />);
+      const actionFooter = enzyme.mount(<ActionFooter end="End Action" />);
 
       it('should only display an end action', () => (
         expect(actionFooter).toMatchSnapshot()
       ));
     });
 
     describe('with both start and end actions', () => {
-      const actionFooter = mount(<ActionFooter start="Start Action" end="End Action" />);
+      const actionFooter = enzyme.mount(<ActionFooter start="Start Action" end="End Action" />);
 
       it('should display both start and end actions', () => (
         expect(actionFooter).toMatchSnapshot()
@@ -96,7 +96,7 @@ describe('ActionFooter', () => {
   // Structure Tests
   describe('Structure Tests', () => {
     describe('without start or end actions', () => {
-      const actionFooter = shallow(<ActionFooter />);
+      const actionFooter = enzyme.shallow(<ActionFooter />);
 
       it("should render an 'BlockActionFooter'", () => (
         expect(actionFooter.find('BlockActionFooter').length).toBe(1)
@@ -112,7 +112,7 @@ describe('ActionFooter', () => {
     });
 
     describe('with only a start action', () => {
-      const actionFooter = shallow(<ActionFooter start="Start Action" />);
+      const actionFooter = enzyme.shallow(<ActionFooter start="Start Action" />);
 
       it("should render an 'BlockActionFooter'", () => (
         expect(actionFooter.find('BlockActionFooter').length).toBe(1)
@@ -128,7 +128,7 @@ describe('ActionFooter', () => {
     });
 
     describe('with only an end action', () => {
-      const actionFooter = shallow(<ActionFooter end="End Action" />);
+      const actionFooter = enzyme.shallow(<ActionFooter end="End Action" />);
 
       it("should render an 'BlockActionFooter'", () => (
         expect(actionFooter.find('BlockActionFooter').length).toBe(1)
@@ -144,7 +144,7 @@ describe('ActionFooter', () => {
     });
 
     describe('with both start and end actions', () => {
-      const actionFooter = shallow(<ActionFooter start="Start Action" end="End Action" />);
+      const actionFooter = enzyme.shallow(<ActionFooter start="Start Action" end="End Action" />);
 
       it("should render an 'BlockActionFooter'", () => (
         expect(actionFooter.find('BlockActionFooter').length).toBe(1)
@@ -165,7 +165,7 @@ describe('ActionFooter', () => {
       .mockReturnValue({
         className: 'orion-fusion-theme',
       });
-    const component = mount(
+    const component = enzyme.mount(
       <ActionFooter
         start={<button type="button">Start Button</button>}
         end={<button type="button">End Button</button>}

diff --git a/packages/terra-action-footer/tests/jest/BlockActionFooter.test.jsx b/packages/terra-action-footer/tests/jest/BlockActionFooter.test.jsx
@@ -6,19 +6,19 @@ describe('BlockActionFooter', () => {
   describe('Snapshot Tests', () => {
     it('should render an empty footer', () => {
       const blockActionFooter = <BlockActionFooter />;
-      expect(shallow(blockActionFooter)).toMatchSnapshot();
+      expect(enzyme.shallow(blockActionFooter)).toMatchSnapshot();
     });
 
     it('should render a footer with some actions', () => {
       const blockActionFooter = <BlockActionFooter>Some actions</BlockActionFooter>;
-      expect(shallow(blockActionFooter)).toMatchSnapshot();
+      expect(enzyme.shallow(blockActionFooter)).toMatchSnapshot();
     });
   });
 
   // Prop Tests
   describe('Prop Tests', () => {
     describe('without actions', () => {
-      const blockActionFooter = mount(<BlockActionFooter />);
+      const blockActionFooter = enzyme.mount(<BlockActionFooter />);
 
       it('should display no actions', () => (
         expect(blockActionFooter).toMatchSnapshot()
@@ -27,7 +27,7 @@ describe('BlockActionFooter', () => {
 
     describe('with actions', () => {
       const content = 'Some content';
-      const blockActionFooter = mount(<BlockActionFooter>{content}</BlockActionFooter>);
+      const blockActionFooter = enzyme.mount(<BlockActionFooter>{content}</BlockActionFooter>);
 
       it('should display no actions', () => (
         expect(blockActionFooter).toMatchSnapshot()
@@ -38,7 +38,7 @@ describe('BlockActionFooter', () => {
   // Structure Tests
   describe('Structure Tests', () => {
     describe('without actions', () => {
-      const blockActionFooter = shallow(<BlockActionFooter />);
+      const blockActionFooter = enzyme.shallow(<BlockActionFooter />);
 
       it('should contain the block-action-footer class', () => (
         expect(blockActionFooter.find('.block-action-footer').length).toBe(1)
@@ -55,7 +55,7 @@ describe('BlockActionFooter', () => {
           Some actions
         </BlockActionFooter>
       );
-      const blockActionFooter = shallow(component);
+      const blockActionFooter = enzyme.shallow(component);
 
       it('should contain the block-action-footer class', () => (
         expect(blockActionFooter.find('.block-action-footer').length).toBe(1)
@@ -72,7 +72,7 @@ describe('BlockActionFooter', () => {
       .mockReturnValue({
         className: 'orion-fusion-theme',
       });
-    const component = mount(
+    const component = enzyme.mount(
       <BlockActionFooter
         start={<button type="button">Start Button</button>}
         end={<button type="button">End Button</button>}

diff --git a/packages/terra-action-footer/tests/jest/CenteredActionFooter.test.jsx b/packages/terra-action-footer/tests/jest/CenteredActionFooter.test.jsx
@@ -6,12 +6,12 @@ describe('CenteredActionFooter', () => {
   describe('Snapshot Tests', () => {
     it('should render an empty footer', () => {
       const component = <CenteredActionFooter />;
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with an anchor', () => {
       const component = <CenteredActionFooter center={<a href="/">Test</a>} />;
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
 
     it('should render a footer with two buttons', () => {
@@ -25,22 +25,22 @@ describe('CenteredActionFooter', () => {
 )}
         />
       );
-      expect(shallow(component)).toMatchSnapshot();
+      expect(enzyme.shallow(component)).toMatchSnapshot();
     });
   });
 
   // Prop Tests
   describe('Prop Tests', () => {
     describe('without a center action', () => {
-      const centeredActionFooter = mount(<CenteredActionFooter />);
+      const centeredActionFooter = enzyme.mount(<CenteredActionFooter />);
 
       it('should display no actions', () => (
         expect(centeredActionFooter).toMatchSnapshot()
       ));
     });
 
     describe('with a center action', () => {
-      const centeredActionFooter = mount(<CenteredActionFooter center="Center Action" />);
+      const centeredActionFooter = enzyme.mount(<CenteredActionFooter center="Center Action" />);
 
       it('should display a center action', () => (
         expect(centeredActionFooter).toMatchSnapshot()
@@ -51,7 +51,7 @@ describe('CenteredActionFooter', () => {
   // Structure Tests
   describe('Structure Tests', () => {
     describe('without a center action', () => {
-      const centeredActionFooter = shallow(<CenteredActionFooter />);
+      const centeredActionFooter = enzyme.shallow(<CenteredActionFooter />);
 
       it('should contain the centered-action-footer class', () => (
         expect(centeredActionFooter.find('.centered-action-footer').length).toBe(1)
@@ -63,7 +63,7 @@ describe('CenteredActionFooter', () => {
     });
 
     describe('with a center action', () => {
-      const centeredActionFooter = shallow(<CenteredActionFooter center="Center Action" />);
+      const centeredActionFooter = enzyme.shallow(<CenteredActionFooter center="Center Action" />);
 
       it('should contain the centered-action-footer class', () => (
         expect(centeredActionFooter.find('.centered-action-footer').length).toBe(1)
@@ -80,7 +80,7 @@ describe('CenteredActionFooter', () => {
       .mockReturnValue({
         className: 'orion-fusion-theme',
       });
-    const component = mount(<CenteredActionFooter center="Center Action" />);
+    const component = enzyme.mount(<CenteredActionFooter center="Center Action" />);
     expect(component).toMatchSnapshot();
   });
 });
diff --git a/packages/terra-action-header/tests/jest/ActionHeader.test.jsx b/packages/terra-action-header/tests/jest/ActionHeader.test.jsx
@@ -1,51 +1,49 @@
 /* eslint-disable no-alert, no-console */
 import React from 'react';
 import Button from 'terra-button';
-/* eslint-disable-next-line import/no-extraneous-dependencies */
-import { shallowWithIntl } from 'terra-enzyme-intl';
 import ActionHeader from '../../src/ActionHeader';
 
 describe('ActionHeader', () => {
   // Snapshot Tests
   it('should render a default action header', () => {
     const actionHeader = <ActionHeader />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with title', () => {
     const actionHeader = <ActionHeader title="Action Header" />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with back button and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onBack={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with close button and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onClose={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with back and close buttons and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onBack={() => {}} onClose={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with level three header element and title', () => {
     const actionHeader = <ActionHeader title="Action Header" level={3} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with custom button and title', () => {
     const actionHeader = <ActionHeader title="Action Header"><Button text="Custom Button" onClick={() => alert('You clicked me!')} /></ActionHeader>;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
@@ -58,37 +56,37 @@ describe('ActionHeader', () => {
         </span>
       </ActionHeader>
     );
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with maximize button and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onMaximize={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with minimize button and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onMinimize={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with next and previous buttons and title', () => {
     const actionHeader = <ActionHeader title="Action Header" onNext={() => {}} onPrevious={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with title, enabled next button, and disabled previous button', () => {
     const actionHeader = <ActionHeader title="Action Header" onNext={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should render an action header with title, enabled previous button, and disabled next button', () => {
     const actionHeader = <ActionHeader title="Action Header" onPrevious={() => {}} />;
-    const wrapper = shallowWithIntl(actionHeader).dive();
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader).dive();
     expect(wrapper).toMatchSnapshot();
   });
 
@@ -106,7 +104,7 @@ describe('ActionHeader', () => {
         onClose={() => {}}
       />
     );
-    const wrapper = shallowWithIntl(actionHeader);
+    const wrapper = enzymeIntl.shallowWithIntl(actionHeader);
     const headerContainer = wrapper.dive().dive();
     expect(headerContainer).toMatchSnapshot();
   });