Merge pull request #1 from eps1lon/test/Select/mousedown-response

Add tests for the new behavior
SarthakC · Oct 28, 2019 · 0280b6b · 0280b6b
2 parents 9ea08c0 + 94db22d
commit 0280b6b
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 17 deletions.
diff --git a/packages/material-ui/src/Select/Select.test.js b/packages/material-ui/src/Select/Select.test.js
@@ -440,7 +440,7 @@ describe('<Select />', () => {
         </Select>,
       );
 
-      fireEvent.click(getByRole('button'));
+      fireEvent.mouseDown(getByRole('button'));
       act(() => {
         clock.tick(99);
       });
@@ -539,7 +539,7 @@ describe('<Select />', () => {
       const { getByRole, queryByRole } = render(<ControlledWrapper />);
 
       act(() => {
-        getByRole('button').click();
+        fireEvent.mouseDown(getByRole('button'));
       });
 
       expect(getByRole('listbox')).to.be.ok;
@@ -580,9 +580,7 @@ describe('<Select />', () => {
       );
       stub(getByRole('button'), 'clientWidth').get(() => 14);
 
-      act(() => {
-        getByRole('button').click();
-      });
+      fireEvent.mouseDown(getByRole('button'));
 
       expect(getByTestId('paper').style).to.have.property('minWidth', '14px');
     });
@@ -595,9 +593,7 @@ describe('<Select />', () => {
       );
       stub(getByRole('button'), 'clientWidth').get(() => 14);
 
-      act(() => {
-        getByRole('button').click();
-      });
+      fireEvent.mouseDown(getByRole('button'));
 
       expect(getByTestId('paper').style).to.have.property('minWidth', '');
     });
@@ -716,7 +712,7 @@ describe('<Select />', () => {
         });
         const { getByRole, getAllByRole } = render(<ControlledSelectInput onChange={onChange} />);
 
-        fireEvent.click(getByRole('button'));
+        fireEvent.mouseDown(getByRole('button'));
         fireEvent.click(getAllByRole('option')[2]);
 
         expect(onChange.callCount).to.equal(1);
@@ -787,4 +783,26 @@ describe('<Select />', () => {
       expect(getByRole('button')).to.have.attribute('id', 'select-foo');
     });
   });
+
+  describe('prop: onMouseDown', () => {
+    it('is forwarded to the trigger button', () => {
+      const handleMouseDown = spy();
+      const { getByRole } = render(<Select onMouseDown={handleMouseDown} value="" />);
+
+      fireEvent.mouseDown(getByRole('button'));
+
+      expect(handleMouseDown.callCount).to.equal(1);
+    });
+  });
+
+  describe('prop: onClick', () => {
+    it('is forwarded to the trigger button', () => {
+      const handleClick = spy();
+      const { getByRole } = render(<Select onClick={handleClick} value="" />);
+
+      fireEvent.click(getByRole('button'));
+
+      expect(handleClick.callCount).to.equal(1);
+    });
+  });
 });
diff --git a/packages/material-ui/test/integration/Select.test.js b/packages/material-ui/test/integration/Select.test.js
@@ -42,10 +42,7 @@ describe('<Select> integration', () => {
     it('should focus the selected item', async () => {
       const { getByTestId, getAllByRole, getByRole, queryByRole } = render(<SelectAndDialog />);
 
-      // Let's open the select component
-      // in the browser user click also focuses
-      getByRole('button').focus();
-      getByRole('button').click();
+      fireEvent.mouseDown(getByRole('button'));
 
       expect(getAllByRole('option')[1]).to.be.focused;
 
@@ -60,10 +57,7 @@ describe('<Select> integration', () => {
       const { getAllByRole, getByRole, queryByRole } = render(<SelectAndDialog />);
       expect(getByRole('button')).to.have.text('Ten');
 
-      // Let's open the select component
-      // in the browser user click also focuses
-      getByRole('button').focus();
-      getByRole('button').click();
+      fireEvent.mouseDown(getByRole('button'));
 
       expect(getAllByRole('option')[1]).to.be.focused;