fix(utils/atomWithStorage): Prevent createJSONStorage from adding subscribe method when window.addEventListener is not defined

[tekkeon]

Related Issues

Fixes #1373

Summary

Added a condition to the if statement that already existed that, in addition to checking whether the global window object exists, also checks that window.addEventListener exists. Also added a simple test to prevent regression in the future.

I tested this in the project I first discovered the bug using yalc (since React Native doesn't support symlinks), and, other than a weird type issue where the value in [value] = useAtom(atom) shows as unknown, it doesn't throw an error now. I doubt my one-line change could have actually messed with the typings, but wanted to call it out for you to verify as the expert.

Note: The beforeAll function in the added test looks a bit odd with the ; in front but was added by prettier, probably to prevent the parentheses around (window as any) from accidentally being used to invoke a function. In order to set addEventListener as undefined, I had to cast window as any, which requires those parentheses. Alternatively, I could do something like the following if preferred:

const windowAny = window as any
windowAny.addEventListener = undefined

Check List

• yarn run prettier for formatting code and docs

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
jotai	✅ Ready (Inspect)	Visit Preview	Aug 29, 2022 at 5:39AM (UTC)

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 5869c62:

Sandbox	Source
React	Configuration
React Typescript	Configuration
React Browserify	Configuration
React Snowpack	Configuration
Next.js with custom Babel config	Configuration
React with custom Babel config	Configuration

[dai-shi]

This looks great!
Don't worry about prettier putting ; in front. It's how it works.

[dai-shi]

the value in [value] = useAtom(atom) shows as unknown, it doesn't throw an error now.

Maybe it was using old TS? Can't tell for sure without a reproduction.