Skip to content

Dev server instability / client-side CORS error during development #3843

@danopia

Description

@danopia

I've recently begun using Fresh for the first time, and I've been struggling a bit with the dev server stability.

After a bit of iterative work on my Fresh app, the islands suddenly break and hot reload stops working. The dev server keeps serving the latest content when I reload. Regardless, if I'm working on an island then this is a show stopper until I go back to the terminal and kill+restart deno run dev. Once I do that, everything works again for another while.

Page Error

The browser console error resembles this:

❌ Access to script at 'fresh-island::EmptyIsland.tsx' from origin 'https://[...]' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: chrome, chrome-extension, chrome-untrusted, data, http, https, isolated-app.
❌ fresh-island::EmptyIsland.tsx:1  GET fresh-island::EmptyIsland.tsx net::ERR_FAILED

Difference in emitted HTML

I've noticed that the script content in the served HTML changes when the issue occurs, normally it looks like this: (line breaks added for readability)

<script type="module" nonce="ea0a857d6094481086103eb6593c3faf">
import { boot } from "/@id/fresh:client-entry";
import EmptyIsland from "/@id/fresh-island::EmptyIsland";
boot({EmptyIsland},"[[1],{\"slots\":2,\"props\":3},[],{}]");
</script>

When the client is broken, the served HTML instead looks like this:

<script type="module" nonce="12f27aae0dad496baf9394f2d2defdb5">
import { boot } from "/@id/fresh:client-entry";
import EmptyIsland_2 from "fresh-island::EmptyIsland.tsx";
boot({EmptyIsland_2},"[[1],{\"slots\":2,\"props\":3},[],{}]");
</script>

It seems like something on the dev server is losing some context about how it should emit import paths.
(I see that the symbol name changed to include _2 in the sample, I don't know if that's always the case or for some other reason)

Previous context

I've found a previous issue which seems to have a similar symptom but a different cause, as it describes a Fresh upgrade which resulted in an app which doesn't work at all:

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions