diff --git a/src/components/catalog-search/__tests__/catalog-search.test.tsx b/src/components/catalog-search/__tests__/catalog-search.test.tsx index d36150bb..ff15933e 100644 --- a/src/components/catalog-search/__tests__/catalog-search.test.tsx +++ b/src/components/catalog-search/__tests__/catalog-search.test.tsx @@ -121,6 +121,25 @@ describe('CatalogSearch', () => { expect(queryInput()?.getAttribute('value')).toBe('linux'); }); + it('clears the catalog search filter when navigation removes the query param', async () => { + testState.location = { + pathname: '/mu/catalog', + search: '?q=linux', + }; + + await renderSearch(); + + testState.location = { + pathname: '/mu/catalog', + search: '', + }; + + await renderSearch(); + + expect(testState.clearSearchFilterMock).toHaveBeenCalled(); + expect(queryInput()).toBeNull(); + }); + it('toggles the search UI, updates the filter and URL, and closes via Escape', async () => { await renderSearch(); diff --git a/src/components/catalog-search/catalog-search.tsx b/src/components/catalog-search/catalog-search.tsx index a3427898..25ccd884 100644 --- a/src/components/catalog-search/catalog-search.tsx +++ b/src/components/catalog-search/catalog-search.tsx @@ -19,8 +19,11 @@ const CatalogSearch = () => { useEffect(() => { if (queryParam) { setSearchFilter(queryParam); + return; } - }, [queryParam, setSearchFilter]); + + clearSearchFilter(); + }, [queryParam, setSearchFilter, clearSearchFilter]); const updateURL = useCallback( (searchText: string) => {