Fix hash change events not firing with i18n (#26994)

My last PR (#26205) made the hash change events not fire when in i18n was enabled, as seen in #26853. This PR fixes that and adds a test for this case.

fixes #26853 

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes

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.
 

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 (
     <>
       <p id="props-locale">{props.locale}</p>
@@ -14,6 +34,9 @@ export default function Page(props) {
       >
         <a id="change-locale">Change Locale</a>
       </Link>
+      <Link href={{ hash: '#newhash' }}>
+        <a id="hash-change">Hash Change</a>
+      </Link>
     </>
   )
 }

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', () => {