test(ComposedModal): add secondaryButtons test

carbon-design-system · Feb 19, 2021 · 2ef643a · 2ef643a
1 parent 5cf819e
commit 2ef643a
Showing 1 changed file with 45 additions and 4 deletions.
diff --git a/packages/react/src/components/ComposedModal/ComposedModal-test.js b/packages/react/src/components/ComposedModal/ComposedModal-test.js
@@ -13,6 +13,7 @@ import ComposedModal, {
   ModalBody,
   ModalFooter,
 } from '../ComposedModal';
+import InlineLoading from '../InlineLoading';
 import { settings } from 'carbon-components';
 
 const { prefix } = settings;
@@ -97,16 +98,28 @@ describe('<ModalFooter />', () => {
     });
   });
 
-  describe('Should render buttons only if appropriate prop passed in in', () => {
+  describe('Should render buttons only if appropriate prop passed in', () => {
     const wrapper = shallow(
       <ModalFooter className="extra-class">
         <p>Test</p>
       </ModalFooter>
     );
 
     const primaryWrapper = shallow(<ModalFooter primaryButtonText="test" />);
-    const secondaryWrapper = shallow(
-      <ModalFooter secondaryButtonText="test" />
+    const secondaryWrapper = mount(<ModalFooter secondaryButtonText="test" />);
+    const multipleSecondaryWrapper = mount(
+      <ModalFooter
+        secondaryButtons={[
+          {
+            buttonText: <InlineLoading />,
+            onClick: jest.fn(),
+          },
+          {
+            buttonText: 'Cancel',
+            onClick: jest.fn(),
+          },
+        ]}
+      />
     );
 
     it('does not render primary button if no primary text', () => {
@@ -128,15 +141,36 @@ describe('<ModalFooter />', () => {
       expect(buttonComponent.exists()).toBe(true);
       expect(buttonComponent.props().kind).toBe('secondary');
     });
+
+    it('correctly renders multiple secondary buttons', () => {
+      const buttonComponents = multipleSecondaryWrapper.find(Button);
+      expect(buttonComponents.length).toEqual(2);
+      expect(buttonComponents.at(0).props().kind).toBe('secondary');
+      expect(buttonComponents.at(1).props().kind).toBe('secondary');
+    });
   });
 
   describe('Should render the appropriate buttons when `danger` prop is true', () => {
     const primaryWrapper = shallow(
       <ModalFooter primaryButtonText="test" danger />
     );
-    const secondaryWrapper = shallow(
+    const secondaryWrapper = mount(
       <ModalFooter secondaryButtonText="test" danger />
     );
+    const multipleSecondaryWrapper = mount(
+      <ModalFooter
+        secondaryButtons={[
+          {
+            buttonText: <InlineLoading />,
+            onClick: jest.fn(),
+          },
+          {
+            buttonText: 'Cancel',
+            onClick: jest.fn(),
+          },
+        ]}
+      />
+    );
 
     it('renders danger button if primary text && danger', () => {
       const buttonComponent = primaryWrapper.find(Button);
@@ -149,6 +183,13 @@ describe('<ModalFooter />', () => {
       expect(buttonComponent.exists()).toBe(true);
       expect(buttonComponent.prop('kind')).toBe('secondary');
     });
+
+    it('correctly renders multiple secondary buttons', () => {
+      const buttonComponents = multipleSecondaryWrapper.find(Button);
+      expect(buttonComponents.length).toEqual(2);
+      expect(buttonComponents.at(0).props().kind).toBe('secondary');
+      expect(buttonComponents.at(1).props().kind).toBe('secondary');
+    });
   });
 });