diff --git a/packages/use-query-params/src/__tests__/index.js b/packages/use-query-params/src/__tests__/index.js index 31057139b..822bb3d1f 100644 --- a/packages/use-query-params/src/__tests__/index.js +++ b/packages/use-query-params/src/__tests__/index.js @@ -239,4 +239,25 @@ describe('useQueryParam', () => { names: ['John', '', 'Jane', '', '', ''], }) }) + + test('should work correctly when search is empty', () => { + jest.useFakeTimers() + const { result } = renderHook(() => useQueryParam(), { + wrapper: wrapper({ search: '' }), + }) + + act(() => { + result.current.setQueryParams({ name: 'John' }) + }) + jest.runAllTimers() + expect(result.current.queryParams).toEqual({ + name: 'John', + }) + + act(() => { + result.current.replaceQueryparams({}) + }) + jest.runAllTimers() + expect(result.current.queryParams).toEqual({}) + }) }) diff --git a/packages/use-query-params/src/index.js b/packages/use-query-params/src/index.js index f08ff5bcc..66825e121 100644 --- a/packages/use-query-params/src/index.js +++ b/packages/use-query-params/src/index.js @@ -50,8 +50,11 @@ const useQueryParams = () => { useEffect(() => { const handler = setTimeout(() => { const stringifiedParams = stringyFormat(state) - if (search !== `?${stringifiedParams}`) + const searchToCompare = search || '?' + + if (searchToCompare !== `?${stringifiedParams}`) { replace(`${pathname}?${stringifiedParams}`) + } }, 500) return () => {