diff --git a/UNRELEASED.md b/UNRELEASED.md index d4c308a36e0..bd4c0c77a95 100644 --- a/UNRELEASED.md +++ b/UNRELEASED.md @@ -8,6 +8,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f ### Bug fixes +- Fixed `Navigation.Item` not calling `onClick` on small screens when `onNavigationDismiss` is undefined ([#603](https://github.com/Shopify/polaris-react/pull/603)) - Fixed `Autocomplete` empty state example Markdown not parsing correctly ([#592](https://github.com/Shopify/polaris-react/pull/592)) ### Documentation diff --git a/src/components/Navigation/components/Item/Item.tsx b/src/components/Navigation/components/Item/Item.tsx index 4b4bbff00d3..66fdaffd267 100644 --- a/src/components/Navigation/components/Item/Item.tsx +++ b/src/components/Navigation/components/Item/Item.tsx @@ -294,7 +294,7 @@ export class BaseItem extends React.Component { return; } - if (onClick && !navigationBarCollapsed().matches) { + if (onClick) { onClick(); } }; diff --git a/src/components/Navigation/components/Item/tests/Item.test.tsx b/src/components/Navigation/components/Item/tests/Item.test.tsx index 9e4495c5ee8..22ccc019d3d 100644 --- a/src/components/Navigation/components/Item/tests/Item.test.tsx +++ b/src/components/Navigation/components/Item/tests/Item.test.tsx @@ -358,6 +358,55 @@ describe('', () => { .exists(), ).toBe(true); }); + + describe('small screens', () => { + let matchMedia: jest.SpyInstance; + beforeEach(() => { + matchMedia = jest.spyOn(window, 'matchMedia'); + matchMedia.mockImplementation(() => { + return { + matches: true, + addListener() {}, + removeListener() {}, + }; + }); + }); + + afterEach(() => { + matchMedia.mockRestore(); + }); + + describe('onClick', () => { + it('will fire once on small screens when onNavigationDismiss is defined', () => { + const item = mountWithAppProvider( + , + { + context: { + location: 'bar', + onNavigationDismiss: noop, + }, + }, + ); + + item.find('button').simulate('click'); + expect(item.prop('onClick')).toHaveBeenCalledTimes(1); + }); + + it('will fire once on small screens when onNavigationDismiss is undefined', () => { + const item = mountWithAppProvider( + , + { + context: { + location: 'bar', + }, + }, + ); + + item.find('button').simulate('click'); + expect(item.prop('onClick')).toHaveBeenCalledTimes(1); + }); + }); + }); }); function itemForLocation(location: string, overrides: Partial = {}) {