'Uncaught TypeError: Illegal Invocation' when root layout contains body tag

Open

#13,224 opened on Dec 22, 2024 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty: 4/5
Estimated time: 3-5 days
Newbie friendliness: 35/100

Issue type: Bug
Clarity: Mostly clear
Activity status: Stale
Tech stack: javascript
Domain: frontend, web-dev

Research direction

Start with the linked barebones reproduction and its root +layout.svelte, keeping the wrapping body tag and slot or snippet in place. Reproduce the repaint and inspect the get_next_sibling/sibling stack shown in the logs, then compare behavior after removing the body wrapper. Done means the layout renders without the Illegal Invocation error while retaining its intended content.

Written by the indexing model from the issue text.

Description

Describe the bug

Recently I migrated an old app (Sveltekit 1/ Svelte 3) to Svelte 5 via the migration scripts. That worked great for the most part, but my app would no longer work correctly. It rendered the page initially but quickly repainted it completely blank. In the console it printed the error "Uncaught TypeError: Illegal Invocation" (see logs).
I found the fix/workaround in a Reddit Thread that had the same issue: a wrapping <body> tag inside the root layout +layout.svelte was causing the issue. Removing this wrapping body element fixed the issue.

The issue occurs both when using slots or snippets. It does not occur when you remove the slot/snippet from the layout.

In my original project it also gave me a hydration_mismatch warning before the Illegal Invocation error, though I wasn't able to reproduce that.

Reproduction

https://github.com/BaumianerNiklas/svelte5-illegal-invocation-repro

This is a barebones project created with the sv CLI, with the only change being the layout that was added.
If you remove the wrapping body tag in there, everything works fine.

Logs

chunk-TFYL3GQY.js?v=4e242971:2346 Uncaught TypeError: Illegal invocation

	in root.svelte

    at get_next_sibling (chunk-TFYL3GQY.js?v=4e242971:2346:30)
    at Module.sibling (chunk-TFYL3GQY.js?v=4e242971:2394:5)
    at _layout (+layout.svelte?t=1734871119624:16:15)
    at chunk-DIK5XZVB.js?v=4e242971:283:58
    at update_reaction (chunk-TFYL3GQY.js?v=4e242971:1308:23)
    at update_effect (chunk-TFYL3GQY.js?v=4e242971:1399:21)
    at create_effect (chunk-TFYL3GQY.js?v=4e242971:2474:7)
    at branch (chunk-TFYL3GQY.js?v=4e242971:2622:10)
    at chunk-DIK5XZVB.js?v=4e242971:277:17
    at update_reaction (chunk-TFYL3GQY.js?v=4e242971:1308:23)
get_next_sibling @ chunk-TFYL3GQY.js?v=4e242971:2346
sibling @ chunk-TFYL3GQY.js?v=4e242971:2394
_layout @ +layout.svelte?t=1734871119624:16
(anonymous) @ chunk-DIK5XZVB.js?v=4e242971:283
update_reaction @ chunk-TFYL3GQY.js?v=4e242971:1308
update_effect @ chunk-TFYL3GQY.js?v=4e242971:1399
create_effect @ chunk-TFYL3GQY.js?v=4e242971:2474
branch @ chunk-TFYL3GQY.js?v=4e242971:2622
(anonymous) @ chunk-DIK5XZVB.js?v=4e242971:277
update_reaction @ chunk-TFYL3GQY.js?v=4e242971:1308
update_effect @ chunk-TFYL3GQY.js?v=4e242971:1399
process_effects @ chunk-TFYL3GQY.js?v=4e242971:1548
flush_queued_root_effects @ chunk-TFYL3GQY.js?v=4e242971:1468
process_deferred @ chunk-TFYL3GQY.js?v=4e242971:1505

System Info

System:
    OS: macOS 14.6.1
    CPU: (6) x64 Intel(R) Core(TM) i5-8500B CPU @ 3.00GHz
    Memory: 6.82 GB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.9.0 - /usr/local/bin/node
    npm: 10.8.3 - /usr/local/bin/npm
  Browsers:
    Brave Browser: 131.1.73.97
    Safari: 17.6
  npmPackages:
    @sveltejs/adapter-auto: ^3.0.0 => 3.3.1 
    @sveltejs/kit: ^2.0.0 => 2.14.0 
    @sveltejs/vite-plugin-svelte: ^4.0.0 => 4.0.4 
    svelte: ^5.0.0 => 5.15.0 
    vite: ^5.4.11 => 5.4.11

Severity

annoyance

Additional Information

I am not quite certain if this is a bug, an undocumented breaking change, or something else I am missing.

I could not find any documentation that suggested not using body tags in the root layout like this.

The issue happened after the migration from Svelte 4 to Svelte 5 (though I filed the issue in the Kit repo since it has to do with the layout/routing).

Dominant language: JavaScript
Stars: 20.8k
Forks: 2.3k
Avg merge: 1d 16h
Merged PRs (30d): 156

Contributor guide

Open the contributing guide

First steps

Read the whole issue, then the project's contributing guide.
Comment on the issue to say you are picking it up — it saves two people doing the same work.
Fork the repository and make your change on a branch.
Open a pull request that references the issue number.

Similar issues

[Duplicate Code] Repeated filtered model-alias assembly in proxy server Open

code-quality refactoring

Difficulty 2/5 1-3 hours Newbie friendliness 84/100

github/gh-aw-firewall#8816 · Opened Sep 20, 2026
quickjs: support `timeout=None` (no per-call deadline) in `CodeInterpreterMiddleware` Open

integration:quickjs org:external priority:backlog topic:code-interpreter topic:middleware type:feature

Difficulty 2/5 1-3 hours Newbie friendliness 74/100

langchain-ai/deepagents#6450 · Opened Sep 20, 2026
[optimization:agents-md-curator] AGENTS.md: compress duplicated Debugging & Logging section and merge redundant autopilot rules Open

optimization optimization:agents-md-curator

Difficulty 2/5 1-3 hours Newbie friendliness 86/100

githubnext/gh-aw-cao#13143 · Opened Sep 20, 2026
[BUG] schema-compat/zodToJsonSchema: nullable zod v4 enum/literal widens to type:[X,"null"] but keeps enum/const, so exported schema rejects null Open

status: needs triage

Difficulty 2/5 1-3 hours Newbie friendliness 88/100

mastra-ai/mastra#24516 · 2 comments · Opened Sep 20, 2026
Kubernetes request flow diagram 404s on both copies of the tutorial Open

Difficulty 2/5 1-3 hours Newbie friendliness 88/100

layer5io/docs#1263 · Opened Sep 20, 2026

More JavaScript issues