react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

Window is defined in Deno 1.x

Open lishaduck opened this issue 1 year ago โ€ข 2 comments

Provide a general summary of the issue here

There are many typeof window == 'undefined' checks in this codebase. In Deno 1.x, window is defined, so these are incorrect. In Deno 2, it won't be becuase of this sort of issue, but you can't opt-in to the upcoming Deno 2 behavior in Deno Deploy, though there is a flag locally.

Many people, including me, are using HeadlessUI with Fresh, and HeadlessUI 2 uses react-aria. Fixing this requires hacky workarounds on our side.

๐Ÿค” Expected Behavior?

SSRing in Deno should work. #4676 and #4688 suggest that react-aria should support Deno.

๐Ÿ˜ฏ Current Behavior

(An example from denoland/fresh#2426, as I don't have a broken file on me right now)

ReferenceError: document is not defined
    at _ (https://esm.sh/v135/@react-aria/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/utils.mjs:2:1579)
    at we (https://esm.sh/v135/@react-aria/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/utils.mjs:2:1627)
    at ee (https://esm.sh/v135/@react-aria/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/interactions.mjs:2:17263)
    at Ce (https://esm.sh/v135/@react-aria/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/interactions.mjs:2:19622)
    at V (https://esm.sh/v135/@react-aria/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/focus.mjs:2:12915)
    at dd (https://esm.sh/v135/@headlessui/[email protected]/X-YS9AdHlwZXMvcmVhY3QtZG9tOnByZWFjdC9jb21wYXQsQHR5cGVzL3JlYWN0OnByZWFjdC9jb21wYXQscmVhY3QtZG9tOnByZWFjdC9jb21wYXQscmVhY3QvanN4LXJ1bnRpbWU6cHJlYWN0L2NvbXBhdC9qc3gtcnVudGltZSxyZWFjdDpwcmVhY3QvY29tcGF0CmUvcHJlYWN0/denonext/react.mjs:6:102879)
    at Object.t (https://esm.sh/stable/[email protected]/denonext/compat.js:2:1545)
    at m (https://esm.sh/v135/[email protected]/X-ZS8q/denonext/preact-render-to-string.mjs:2:3237)
    at m (https://esm.sh/v135/[email protected]/X-ZS8q/denonext/preact-render-to-string.mjs:2:2543)
    at m (https://esm.sh/v135/[email protected]/X-ZS8q/denonext/preact-render-to-string.mjs:2:3802)

๐Ÿ’ Possible Solution

Always use @react-aria/ssr, which, on first glance, doesn't seem to have this issue?

๐Ÿ”ฆ Context

I'm trying to remove lots of if (!IS_BROWSER) checks in my codebase.

๐Ÿ–ฅ๏ธ Steps to Reproduce

I can't access CodeSandbox, and you'd need Deno anyway (presumably it uses Node).

Version

https://github.com/PHS-TSA/webmaster-23-24/blob/90ea1948753785c8df482facfd6a96e134d0448f/deno.json#L76-L80

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macOS

๐Ÿงข Your Company/Team

Fresh Users

๐Ÿ•ท Tracking Issue

denoland/fresh#2206 denoland/fresh#2426 denoland/deno#23784

lishaduck avatar Jun 12 '24 16:06 lishaduck

Thank you for the issue, I imagine we could implement the same change to use typeof document !== 'undefined' in the remainder of the places where window !== 'undefined' is used. Would you like to open a PR for this?

LFDanLu avatar Jun 12 '24 16:06 LFDanLu

Thank you for the issue, I imagine we could implement the same change to use typeof document !== 'undefined' in the remainder of the places where window !== 'undefined' is used.

I think that should fix it. Checking the stacktrace, here're the potential culprits (though it should probably be fixed everywhere): Code Search Results

Would you like to open a PR for this?

I don't think I can sign a CLA, so I'll decline. Otherwise, I'd be happy to. Thanks for your responsiveness!

lishaduck avatar Jun 12 '24 17:06 lishaduck

Today I stumbled against the same issue, hoping it gets a fix soon ๐Ÿคž

fkoemep avatar Dec 06 '24 02:12 fkoemep

It appears that since the 2.0 release, window is no longer available in Deno, based on what I found in the migration guide and lint rules.

reidbarber avatar Jul 23 '25 18:07 reidbarber