The Bug That Only Showed Up in a Second Tab: Debugging a Multi-Tab localStorage Race Condition

Summer Bug Smash: Smash Stories 🐛🛹

This is a submission for DEV's Summer Bug Smash: Smash Stories powered by Sentry.

I was working on InnerHue, a mood-tracking app that stores mood entries in localStorage via a Zustand store. The reported bug: open the app in two tabs, log a mood in each, and entries would randomly go missing or get overwritten.

The investigation

The Zustand store (lib/useMoodStore.ts) kept an in-memory copy of moodHistory, but it never listened for changes coming from other tabs. So Tab A and Tab B each held their own stale snapshot, and whichever tab wrote to localStorage last simply clobbered whatever the other tab had written. Classic race condition, just spread across browser tabs instead of threads.

The Bug That Only Showed Up in a Second Tab: Debugging a Multi-Tab localStorage Race Condition

Related reading

The Door I Forgot to Lock, How One Missing Check Nearly Exposed Every Resume in…

My Summer of Sleuthing: 373 Merged PRs and the Bugs That Taught Me Everything

I Used Sentry to Expose a Silent Data-Loss Bug with Zero Errors

Some Bugs Aren't in Your Code. They're Hidden in Your Dependencies.

Gotcha: chasing a bug that was never in my code

How I Smashed a Bug in a Shared Authentication Library