Page crashes upon refresh
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 20.8k
- Forks
- 2.3k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 156
Description
Describe the bug
If you look at the reproduction stackblitz, click the "go to page" link, the page loads, and renders, without error. As soon as you then refresh that page, you get a "Uncaught (in promise) HierarchyRequestError: Failed to execute 'appendChild' on 'Node': This node type does not support this method." error. This completely breaks the page and you cannot recover.
I'm not entirely sure what is causing this. Some observations:
- In
PageComponent.svelte, the error goes away when you remove either:- The
$props()call in the<script></script> - The
--input-widthstyle variable that is passed into the Fieldset component
- The
I am able to provide more info and help in any way I can - this bug is currently blocking my next deployment and I can't find a suitable workaround right now without a massive time commitment.
Reproduction
Logs
client.js?v=ea032cef:318 Uncaught (in promise) HierarchyRequestError: Failed to execute 'appendChild' on 'Node': This node type does not support this method.
in PageComponent.svelte
in +page.svelte
in layout.svelte
in root.svelte
System Info
System:
OS: Linux 6.8 Linux Mint 21.3 (Virginia)
CPU: (12) x64 AMD Ryzen 5 7600 6-Core Processor
Memory: 18.18 GB / 30.32 GB
Container: Yes
Shell: 5.1.16 - /bin/bash
Binaries:
Node: 23.6.0 - ~/.nvm/versions/node/v23.6.0/bin/node
npm: 10.9.2 - ~/.nvm/versions/node/v23.6.0/bin/npm
Browsers:
Chrome: 133.0.6943.98
npmPackages:
@sveltejs/adapter-node: ^5.2.11 => 5.2.11
@sveltejs/kit: ^2.15.1 => 2.15.1
@sveltejs/vite-plugin-svelte: ^5.0.3 => 5.0.3
svelte: ^5.16.0 => 5.16.0
vite: ^6.0.6 => 6.0.6
Severity
blocking an upgrade
Additional Information
One more thing to note is that this happens on both the development and production build.
Contributor 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.
Research direction
Start with the linked StackBlitz reproduction and compare navigation with a page refresh. Inspect the mentioned PageComponent.svelte, +page.svelte, layout.svelte, and root.svelte files, focusing on the $props() call and the --input-width style variable passed to Fieldset. Done means the page refreshes without the HierarchyRequestError in both development and production builds.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100