diff --git a/packages/next/shared/lib/router/router.ts b/packages/next/shared/lib/router/router.ts index babffab9d11eb..e403f3239a0ba 100644 --- a/packages/next/shared/lib/router/router.ts +++ b/packages/next/shared/lib/router/router.ts @@ -817,7 +817,7 @@ export default class Router implements BaseRouter { this.isReady = true } - let localeChange = options.locale !== this.locale + const prevLocale = this.locale if (process.env.__NEXT_I18N_SUPPORT) { this.locale = @@ -927,6 +927,8 @@ export default class Router implements BaseRouter { ) this._inFlightRoute = as + let localeChange = prevLocale !== this.locale + // If the url change is only related to a hash change // We should not proceed. We should only change the state. diff --git a/test/integration/i18n-support-same-page-hash-change/pages/about.js b/test/integration/i18n-support-same-page-hash-change/pages/about.js index 20de96ca7b506..bc0d213c9e7b9 100644 --- a/test/integration/i18n-support-same-page-hash-change/pages/about.js +++ b/test/integration/i18n-support-same-page-hash-change/pages/about.js @@ -1,9 +1,29 @@ import Link from 'next/link' import { useRouter } from 'next/router' +import { useEffect } from 'react' export default function Page(props) { const router = useRouter() + useEffect(() => { + window.hashChangeStart = 'no' + window.hashChangeComplete = 'no' + const hashChangeStart = () => { + window.hashChangeStart = 'yes' + } + const hashChangeComplete = () => { + window.hashChangeComplete = 'yes' + } + + router.events.on('hashChangeStart', hashChangeStart) + router.events.on('hashChangeComplete', hashChangeComplete) + + return () => { + router.events.off('hashChangeStart', hashChangeStart) + router.events.off('hashChangeComplete', hashChangeComplete) + } + }, [router.events]) + return ( <>
{props.locale}
@@ -14,6 +34,9 @@ export default function Page(props) { > Change Locale + + Hash Change + > ) } diff --git a/test/integration/i18n-support-same-page-hash-change/test/index.test.js b/test/integration/i18n-support-same-page-hash-change/test/index.test.js index a9693372fba58..cdb186077412a 100644 --- a/test/integration/i18n-support-same-page-hash-change/test/index.test.js +++ b/test/integration/i18n-support-same-page-hash-change/test/index.test.js @@ -57,6 +57,19 @@ const runTests = () => { expect(await browser.elementByCss('#router-locale').text()).toBe('en') expect(await browser.elementByCss('#props-locale').text()).toBe('en') }) + + it('should trigger hash change events', async () => { + const browser = await webdriver(appPort, `/about#hash`) + + await check(() => browser.eval('window.location.hash'), '#hash') + + await browser.elementByCss('#hash-change').click() + + await check(() => browser.eval('window.hashChangeStart'), 'yes') + await check(() => browser.eval('window.hashChangeComplete'), 'yes') + + await check(() => browser.eval('window.location.hash'), '#newhash') + }) } describe('Hash changes i18n', () => {