__error not correctly displayed when default layout inherits from a named layout

[y0zong]

Describe the bug

Let us assume such a file structure

-routes
  └login
      └index@init.svelte
    |-__error.svelte
    |-__layout-init.svelte
    |-__layout@init.svelte
    └index.svelte

__layout-init.svelte used to load initialization content such as shared styles and external js files for whole site, login page use just __layout-init.svelte cuz it's a additional page that don't need __layout@init.svelte, everything is ok so far, but, the __error.svelte just inherit from __layout@init.svelte and lost __layout-init.svelte that means error page can't load initialization content ( which should inherit from -> __layout@init.svelte -> __layout-init.svelte)

I think it's a bug or design to?

Reproduction

here is online demo

Logs

No response

System Info

Browsers:
    Chrome: 101.0.4951.64
    Edge: 101.0.1210.47
    Firefox: 100.0
    Safari: 15.4
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.40 
    @sveltejs/adapter-static: ^1.0.0-next.30 => 1.0.0-next.30 
    @sveltejs/kit: next => 1.0.0-next.326 
    svelte: ^3.44.0 => 3.48.0

Severity

serious, but I can work around it

Additional Information

No response

[ghostdevv]

I am having this issue as well

[ghostdevv]

Duplicate of #4582

[Conduitry]

I just run into this as well. It's not a duplicate of #4582. That's requesting support for inheriting from named layouts in the error layout. This is a bug where the default layout is incorrectly inherited from in the error layout if that default layout inherits from a named layout.

[Conduitry]

To be a little more specific: If a load function explicitly returns an { status, error } object, it looks like __error.svelte renders correctly inside __layout@foo.svelte which renders inside __layout-foo.svelte like it's supposed to. When I navigate to a route that doesn't exist at all, __error.svelte renders inside __layout@foo.svelte but that does not render inside __layout-foo.svelte.

[Conduitry]

The error appears to be here:

kit/packages/kit/src/runtime/server/page/respond_with_error.js

Line 74 in 67e2342

branch.push(layout_loaded, error_loaded);

The respond_with_error function is only including the main layout and the error layout. I haven't been able to sort through what the regular respond function is doing differently that it includes all of the appropriate Loaded objects.

[Conduitry]

I believe this can be partly worked around, at least in the 404 case, by adding a dummy [...catchAll].svelte component:

<!-- src/routes/[...catchAll].svelte -->
<script context="module">
	export function load({ url }) {
		return { status: 404, error: "Not found: " + url.pathname };
	}
</script>

[dummdidumm]

This sounds like another instance of the root fallback behavior where the first layout is used to render the error page in - which in this case is wrong, because it depends on another one. I'm more and more of the opinion that we need to have a a fallback root layout regardless of other provided roots layouts, and in this case we need to apply some logic to not only know the root layout but also its dependencies.