router icon indicating copy to clipboard operation
router copied to clipboard

Inconsistent errorComponent behaviour with different nested layout structures

Open Pavel-Liteiniy opened this issue 1 month ago • 0 comments

Which project does this relate to?

Router

Describe the bug

In a project using file‑based routing, I set errorComponent: false on routes to disable local error pages and display a global error component instead. This fallback works in some cases but not in others: • The route / _commonLayout/_greenLayout/info/user (under GreenLayout) nests one layout inside another and then a page file. Here errorComponent: false correctly skip layouts and shows the global component. • The route / _commonLayout/product/_redLayout/details (under RedLayout) has a different structure: _redLayout sits inside a product subfolder, and then comes the details page. On this route the same errorComponent: false setting keeps rendering the global component inside all layouts, which seems incorrect.

Your Example Website or App

https://stackblitz.com/edit/github-5zuvnirn?file=src%2Froutes%2F_commonLayout%2Froute.tsx

Steps to Reproduce the Bug or Issue

  1. Open example
  2. Try to navigate to "User info" page
  3. Try to navigate to "Product details" page

Expected behavior

Setting errorComponent: false should always disable local error pages and cause the router to use the nearest global error component, regardless of whether a layout is directly inside another layout or inside a subfolder.

Screenshots or Videos

/info/user

Image

/product/details

Image

Platform

  • Router: @tanstack/react-router 1.139.3, @tanstack/router-plugin 1.139.3,
  • Bundler: Vite 5.4.10, Webpack 5.91.0
  • React: 18.2.0

Additional context

No response

Pavel-Liteiniy avatar Nov 24 '25 13:11 Pavel-Liteiniy