diff --git a/packages/e2e/cypress/e2e/hash-preservation.cy.js b/packages/e2e/cypress/e2e/hash-preservation.cy.js new file mode 100644 index 00000000..2237eb25 --- /dev/null +++ b/packages/e2e/cypress/e2e/hash-preservation.cy.js @@ -0,0 +1,34 @@ +/// + +function runTest() { + cy.contains('#hydration-marker', 'hydrated').should('be.hidden') + cy.get('#string_set_a').click() + cy.location('search').should('eq', '?string=a') + cy.location('hash').should('eq', '#hash') + cy.get('#string_clear').click() + cy.location('hash').should('eq', '#hash') +} + +describe('hash preservation (app router)', () => { + it('works in standard routes', () => { + cy.visit('/app/useQueryState#hash') + runTest() + }) + + it('works in dynamic routes', () => { + cy.visit('/app/useQueryState/dynamic/route#hash') + runTest() + }) +}) + +describe('hash preservation (pages router)', () => { + it('works in standard routes', () => { + cy.visit('/pages/useQueryState#hash') + runTest() + }) + + it('works in dynamic routes', () => { + cy.visit('/pages/useQueryState/dynamic/route#hash') + runTest() + }) +}) diff --git a/packages/nuqs/src/update-queue.ts b/packages/nuqs/src/update-queue.ts index 4670ed28..3a813390 100644 --- a/packages/nuqs/src/update-queue.ts +++ b/packages/nuqs/src/update-queue.ts @@ -173,7 +173,7 @@ function flushUpdateQueue(router: Router): [URLSearchParams, null | unknown] { }) } else { // App router - const url = renderURL(location.href.split('?')[0] ?? '', search) + const url = renderURL(location.origin + location.pathname, search) debug('[nuqs queue (app)] Updating url: %s', url) // First, update the URL locally without triggering a network request, // this allows keeping a reactive URL if the network is slow. @@ -214,9 +214,10 @@ function flushUpdateQueue(router: Router): [URLSearchParams, null | unknown] { } function renderURL(base: string, search: URLSearchParams) { + const hashlessBase = base.split('#')[0] ?? '' const query = renderQueryString(search) const hash = location.hash - return base + query + hash + return hashlessBase + query + hash } export function compose(