Skip to content

fix(vanilla/utils/atomWithStorage): apply reviver when parsing subscription updates#3326

Merged
dai-shi merged 3 commits into
pmndrs:mainfrom
chatman-media:fix/json-storage-reviver-on-subscribe
Jun 11, 2026
Merged

fix(vanilla/utils/atomWithStorage): apply reviver when parsing subscription updates#3326
dai-shi merged 3 commits into
pmndrs:mainfrom
chatman-media:fix/json-storage-reviver-on-subscribe

Conversation

@chatman-media

Copy link
Copy Markdown
Contributor

Bug

When a custom reviver is passed to createJSONStorage, it is correctly applied in getItem (via JSON.parse(str, options?.reviver)), but not in the internal createHandleSubscribe handler that fires when the underlying string storage emits a change (e.g. via a cross-tab storage event or a custom subscribe callback).

This means that if an atom value is a class instance or otherwise requires revival from the raw JSON object graph, any subscription-driven update receives a plain object instead of the revived value — causing runtime errors for callers that invoke methods on the result.

Reported in discussion #3101.

Root cause

createHandleSubscribe called JSON.parse(v || '') without forwarding options?.reviver:

// before
newValue = JSON.parse(v || '')

// after
newValue = JSON.parse(v || '', options?.reviver)

Fix

One-line change in src/vanilla/utils/atomWithStorage.ts: pass options?.reviver as the second argument to JSON.parse inside createHandleSubscribe.

Test

A new test createJSONStorage reviver is applied on subscription updates (#3101) is added to tests/react/vanilla-utils/atomWithStorage.test.tsx. It:

  1. Creates a createJSONStorage with a reviver that turns plain { n: number } objects into Item class instances.
  2. Renders a component that calls value.doubled() — a method that only exists on Item.
  3. Simulates an external storage update via a CustomEvent.
  4. Without the fix the subscription callback returns a plain object, value instanceof Item is false, and the component renders NOT_ITEM. With the fix it renders the correct doubled value.

Closes #3101

@vercel

vercel Bot commented Jun 7, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
jotai Ready Ready Preview, Comment Jun 11, 2026 5:24am

Request Review

@pkg-pr-new

pkg-pr-new Bot commented Jun 7, 2026

Copy link
Copy Markdown
More templates

npm i https://pkg.pr.new/jotai@3326

commit: e0f87b7

@dai-shi dai-shi left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! Thanks for your contribution.
I'll merge this when I prepare a patch release.

@dai-shi dai-shi added this to the v2.20.1 milestone Jun 8, 2026
@dai-shi dai-shi merged commit 563f059 into pmndrs:main Jun 11, 2026
45 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants