Client error only in Safari, `Cannot access uninitialized variable.`

[pheuter]

Describe the bug

Was instructed to create a new issue with repro from convo in #2889.

Reproduction

https://github.com/pheuter/safari-repro

Logs

[Error] ReferenceError: Cannot access uninitialized variable.
	handleError (client-manifest.js:16)
	handle_error (client.js:1692)
	(anonymous function) (client.js:1630)
	asyncFunctionResume
	(anonymous function)
	promiseReactionJobWithoutPromise
	promiseReactionJob

[Error] Unhandled Promise Rejection: ReferenceError: Cannot access uninitialized variable.
	(anonymous function) (start.js:38)
	asyncFunctionResume
	(anonymous function)
	promiseReactionJobWithoutPromise
	promiseReactionJob

System Info

System:
    OS: macOS 13.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 4.93 GB / 32.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 19.4.0 - /opt/homebrew/bin/node
    npm: 9.2.0 - /opt/homebrew/bin/npm
    Watchman: 2022.11.14.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 109.0.5414.87
    Safari: 16.2
  npmPackages:
    @sveltejs/adapter-node: 1.1.1 => 1.1.1
    @sveltejs/kit: 1.1.0 => 1.1.0
    svelte: 3.55.1 => 3.55.1
    vite: 4.0.4 => 4.0.4

Severity

blocking all usage of SvelteKit

Additional Information

Blocks all client-side usage of SvelteKit on latest versions of Safari.

[Smirow]

Seems to works fine if you import uno.css in the client hooks src/hooks.client.ts. Doesn't help on why it's Safari specific.

[pheuter]

@Smirow While moving the imports from +layout.svelte into hooks.client.ts fixes the client-side error, it appears to add FOUC upon server-side loads, suggesting it may not be the proper place to add those imports?

[Smirow]

@pheuter yes, also noticed the FOUC, same thing happens with Tailwind if you import it in hooks.client.ts. Which raises questions about the lifecycles of hooks.client.ts and +layout.svelte.

[Rich-Harris]

This looks to me like a Uno bug, not a SvelteKit bug. Have you raised an issue over there?

[pheuter]

@Rich-Harris https://github.com/unocss/unocss/issues/2111#issuecomment-1407424016 🤷

[gwww]

I am also having this problem. Moving the import in not a solution for reasons above, but it does make the exception go away. However, I'd like to offer some more info.

With my import in my normal spot, not moved to hooks.client.js, I get many errors when doing a npm dev run. The errors start right after the message [vite-plugin-svelte] ssr compile in progress .... I started by creating a discussion on TailwindCSS because the errors all appeared to be related to Tailwind. When I remove UnoCSS from the error go away. Rather than repeat, here is that thread: https://github.com/tailwindlabs/tailwindcss/discussions/10496

[brittianwarner]

Our solution to this issue: link

[maxcoredev]

Want to note that this error appears only in npm run dev without any special settings. Everything is fine in build/preview (unless there is no vite.build.target = 'esnext' of course). So it's not critical