cloudflare / cloudflare/templates

🐛 BUG: Rapid saves to react-router template can cause `Internal server error: The script will never generate a response`

Open
#600 4 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
2.1k
Forks
1k
Avg merge
17h 44m
Merged PRs (30d)
10

Description

### Which template does this pertain to?

react-router-hono-fullstack-template

### What versions are you using?

4.19.1 [wrangler], 4.7.7 [hono], 7.5.2 [react-router] (but have tried many versions of each)

### What operating system and version are you using?

Mac OS X 15.5

### Please provide a link to a minimal reproduction (optional)

_No response_

### Describe the Bug

This is a bit of a weird one, but I have spent maybe 20+ hours trying to get to the bottom of the source and so I'm pretty sure on most of this stuff: <3

In my app, if two saves happen in fast succession, then it will very commonly (like 1 out of 4 times) trigger the following error.

Image

At first I assumed I had a dangling promise somewhere in my app, but peeled back every file until I had none left and was still able to trigger it. So I attempted to reproduce it directly in the hono-react-router template and after a little bit of wiggling, I was able to do it.

However, in the template app, it's *very difficult* to make happen. I am fairly certain that this is because the app builds so quickly, that it can never get into a state where two HMR reloads cross over each other (at least on my M3 macbook pro). So in order to try to trigger it I changed the template app in 1 way, which is to just load any largeish library. I chose `@adobe/spectrum` since it has a lot of components, but also confirmed I could make it happen with other things like radix/dummy files.

My current best assumption is that the following code is not guaranteed to work when two HMR events occur very close together:

```ts
// app.ts from the hono-react-router template
app.get("*", (c) => {
const requestHandler = createRequestHandler(
() => import("virtual:react-router/server-build"), // <-- this line is my best guess
import.meta.env.MODE,
);

return requestHandler(c.req.raw, {
cloudflare: { env: c.env, ctx: c.executionCtx },
});
});
```

If I had to do some conjecture, in some cases the app boots up, but before the `createRequestHandler` function invokes that dynamic import, a new server-build exists in that spot.

In order to make the error happen in a small app like the demo template, you may have to press and hold `cmd+s` on the `welcome.tsx` file, or hit it really fast in bursts, however in our real life app, I believe many of our developers run into this issue on every few saves (which kills the entire dev server) because their editors probably save once when they hit save, and then save again after formatting is applied.

I'm sorry I don't have a minimum reproduction linked, but I'm happy to get on a call at any time and show the error in practice and in the template project with my changes.

### Please provide any relevant error logs

```
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (ssr) page reload app/welcome/welcome.tsx
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (__react_router_css_dev_helper__) page reload app/welcome/welcome.tsx
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (ssr) page reload app/welcome/welcome.tsx
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (__react_router_css_dev_helper__) page reload app/welcome/welcome.tsx
A hanging Promise was canceled. This happens when the worker runtime is waiting for a Promise from JavaScript to resolve, but has detected that the Promise cannot possibly ever resolve because all code and events related to the Promise's I/O context have already finished.

5:35:00 PM [vite] Internal server error: The script will never generate a response.
at async ProxyServer.fetch (file:///Users/alex/code/test-template/wispy-pond-2aa3/node_modules/.pnpm/miniflare@4.20250416.0/node_modules/miniflare/src/workers/core/proxy.worker.ts:173:11)
Warning: A promise was resolved or rejected from a different request context than the one it was created in. However, the creating request has already been completed or canceled. Continuations for that request are unlikely to run safely and have been canceled. If this behavior breaks your worker, consider setting the `no_handle_cross_request_promise_resolution` compatibility flag for your worker.
at /Users/alex/code/test-template/wispy-pond-2aa3/app/root.tsx:15:393

5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (client) hmr update /app/welcome/welcome.tsx, /app/app.css
5:35:00 PM [vite] (ssr) page reload app/welcome/welcome.tsx
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.