AI & Agent Dev Bug Sandbox logo
AI & Agent Dev Bug Sandbox
Back to Radar

App Router: Router.Refresh() Causes A Full-Page Reload With Retained Parallel Routes Inside A Route Group

When using parallel routes inside a route group, calling router.refresh() after a soft navigation can trigger a full-page reload instead of a soft refresh, causing loss of UI state and a broken user experience.

highConfidence 90%Next.jsAffected V16.3.7Affected V16.4.0-Canary.51

Origin Analysis

The route group ancestor (site) causes the internal router state to retain an outdated refresh URL (e.g., /grouped-home) after navigation to /grouped-about. When router.refresh() is called, it uses this stale URL to fetch new RSC data, leading to a hard navigation fallback instead of an in-place refresh.
1. Install dependencies and run the reproduction app (e.g., pnpm install && pnpm dev). 2. Navigate to /home. 3. Choose 'Start grouped example'. 4. Open Edit Dialog, click Mutate, then close dialog. 5. Soft-navigate to About Page. 6. Open Edit Dialog again, click Router Refresh. 7. Observe that a full-page reload occurs; About disappears; performance.timeOrigin changes. 8. Repeat with 'Start flat example' as control; no full-page reload occurs.

Fixing Code Block

Edge Case Audit

This workaround may cause an extra history entry or a brief flashing/scroll reset depending on the browser and router implementation. It is advisable to test in production builds and across browsers. If the issue persists, revert to the original router.refresh() call. For a permanent fix, update to a Next.js version where this bug is resolved (check issue #99444 for updates). In concurrent or multi-tab scenarios, the workaround could lead to inconsistent router states; avoid using it in critical real-time UIs.

Ecosystem Topology