Route announcer crashes with `removeChild` after browser translation
Link to the code that reproduces this issue
https://github.com/sapandiwakar/next-route-announcer-translate
To Reproduce
- Install deps, build and start:
npm install && npm run build && npm start - Open http://localhost:3000 in Chrome with English (or any non-German) as the browser language.
- Translate page from German (Use three dots next to address bar if automatic translation popup doesn't show up).
- Click
Seite mit Titel(Page with titleif translated to English) - Click
Startseite(Homepage).
Verified in Chrome (v154) and Chrome Canary (v156) and crashes on every attempt.
Current vs. Expected behavior
The client crashes with
Uncaught NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.Expected: navigation keeps working. The app renders no bare text of its own around this; the node that breaks is the one AppRouterAnnouncer renders. The home page has no title and no <h1>, so the announcement becomes empty and React removes the announcer's text node, which Chrome translation has already replaced.
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 25.6.0
Available memory (MB): 24576
Available CPU cores: 14
Binaries:
Node: 24.21.0
npm: 12.0.2
Yarn: N/A
pnpm: 12.5.1
Relevant Packages:
next: 16.4.0-canary.37
eslint-config-next: N/A
react: 19.3.0
react-dom: 19.3.0
typescript: 5.9.3
Next.js Config:
output: N/AWhich area(s) are affected? (Select all that apply)
Linking and Navigating, React
Which stage(s) are affected? (Select all that apply)
next start (local), Other (Deployed)
Additional context
This is similar to #83392 and #66739 but they were closed with the conclusion that fix belongs to app code. But since this bare text node comes directly from Next.js, this fix must happen here instead of in app code.
return portalNode ? createPortal(routeAnnouncement, portalNode) : nullThe only workaround on the app side for now is to make sure every route has a document.title or an <h1>.
#98314 applies the fix recommended in #66739 to this node: it renders the announcement as <span key={routeAnnouncement}>. With just that change applied to the repro's next build, the same steps no longer crash.
Source: vercel/next.js