[Bug?]: syntax errors in ./app.tsx causes uncaught 500 error
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 5.9k
- Forks
- 426
- Avg merge
- 1d 3h
- Merged PRs (30d)
- 11
Description
Duplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
When editing app.tsx the website will 500 when the app i in an incorrect state. The dev-overlay is visible for a fraction of a second and then the default browser display is shown. The app is then not being able to get recovered with hmr.
https://github.com/user-attachments/assets/f20ed5c4-c947-48b9-b0d9-256671bf6012
When editing a file that app.tsx imports (and renders), the error does not occur:
https://github.com/user-attachments/assets/9b877910-e160-460f-ac6e-b1a4a61d97b3
It was slightly different behavior in the context of where I found out about the bug. I am making a sveltelab thingy for the hackathon, a repl powered by stackblitz' webcontainers. There some imports did cause similar 500s.
https://github.com/user-attachments/assets/c9ece388-c591-4e89-a8f2-706b36c31c7b
routes that are currently rendered can also be edited without 500, it's only app.tsx
https://github.com/user-attachments/assets/5f443737-b060-45bc-8972-e139171f1612
Expected behavior 🤔
To be able to write invalid code without the app getting in to an unrecoverable 500-error.
Steps to reproduce 🕹
Steps:
- clone the bare solid start example
- pnpm install && pnpm dev
- edit src/app.tsx so it is invalid javascript and save
- see that page 500s without dev-overlay
- edit src/app.tsx so it is valid again
- see that it does not reload
Context 🔦
No response
Your environment 🌎
No response
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
Reproduce the issue in the bare Solid Start example by running pnpm install && pnpm dev, then edit src/app.tsx with invalid and valid JavaScript. Inspect the development overlay and HMR behavior; done means invalid edits show recoverable feedback and saving valid code reloads without an unrecoverable 500 error.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- devtools, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 52/100