diff --git a/.changeset/gentle-chefs-hear.md b/.changeset/gentle-chefs-hear.md new file mode 100644 index 00000000000..476548e6a6a --- /dev/null +++ b/.changeset/gentle-chefs-hear.md @@ -0,0 +1,5 @@ +--- +'@shopify/polaris': patch +--- + +Replaced mouse up and down events on Backdrop with onClick to close Modal diff --git a/polaris-react/src/components/Backdrop/Backdrop.tsx b/polaris-react/src/components/Backdrop/Backdrop.tsx index 4a0ca77d734..ed8319955d3 100644 --- a/polaris-react/src/components/Backdrop/Backdrop.tsx +++ b/polaris-react/src/components/Backdrop/Backdrop.tsx @@ -29,7 +29,7 @@ export function Backdrop(props: BackdropProps) { } }; - const handleMouseUp = () => { + const handleClick = () => { if (setClosing && onClick) { setClosing(false); onClick(); @@ -41,10 +41,9 @@ export function Backdrop(props: BackdropProps) {
); diff --git a/polaris-react/src/components/Backdrop/tests/Backdrop.test.tsx b/polaris-react/src/components/Backdrop/tests/Backdrop.test.tsx index 7a7d8fdf8f0..0e43260b0c5 100644 --- a/polaris-react/src/components/Backdrop/tests/Backdrop.test.tsx +++ b/polaris-react/src/components/Backdrop/tests/Backdrop.test.tsx @@ -4,11 +4,13 @@ import {mountWithApp} from 'tests/utilities'; import {Backdrop} from '..'; describe('', () => { - describe('onDismiss()', () => { + describe('onClick()', () => { it('is called when the backdrop is clicked', () => { const spy = jest.fn(); - const backdrop = mountWithApp(); - backdrop.find('div', {onClick: spy})!.trigger('onClick'); + const backdrop = mountWithApp( + {}} />, + ); + backdrop.find('div')!.trigger('onClick'); expect(spy).toHaveBeenCalled(); }); });