feat: add visibilitychange probe for proactive IDB health check#798
feat: add visibilitychange probe for proactive IDB health check#798elirangoshen wants to merge 10 commits into
Conversation
Register a visibilitychange listener inside createStore() that runs a lightweight readonly probe when the tab returns to foreground. If the probe detects a dead IDB connection (connection lost, backing store error, or InvalidStateError), it drops the cached dbp so the next real operation opens a fresh connection instead of failing. This prevents the ReconnectApp write storm from hitting a dead IDB connection after Safari backgrounds a tab. Addresses Expensify/App#87864. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Probe start: logInfo when tab becomes visible and probe begins - Probe healthy: logInfo confirming connection is healthy - Probe stale: logAlert with error details when stale connection detected - Heal attempts/success/exhaustion/non-recoverable: same as Expensify#780 - Updated test assertions to match new log messages and levels Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
The "connection is healthy" log was emitted synchronously after count(), before the IDB request completed. If the request later failed via onerror, both healthy and stale logs would fire for the same visibility event. Now only logs on actual success. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
In some environments DOMException does not inherit from Error. Use (error instanceof Error || error instanceof DOMException) for all three detection functions to avoid missing IDB errors in those envs. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…al' into fix/idb-visibilitychange-probe
Avoid silently mislabeling future error categories as connection lost. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…-internal/react-native-onyx into fix/idb-visibilitychange-probe
- Remove the `typeof document !== 'undefined'` guard; IDBKeyValProvider runs on web only, where document is always defined. - Drop the App-specific "ReconnectApp" reference from the probe comment. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Pins onyx to callstack-internal/react-native-onyx@e3a8cc5d (Expensify/react-native-onyx#798) so E/App CI runs the full suite against the proactive IDB visibilitychange probe change. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The visibilitychange probe adds a separate .then branch off the cached open promise. If the tab becomes visible while dbp is still a pending indexedDB.open() that later rejects, that branch rejected with no handler, surfacing an unhandled rejection on foregrounding. Add a .catch on the probe chain (cacheOpenPromise already clears dbp on its own branch). Addresses PR Expensify#788 review (chatgpt-codex-connector). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
@codex review |
Pins onyx to callstack-internal/react-native-onyx@7ac9c50a (Expensify/react-native-onyx#798) so E/App CI runs the full suite against the proactive IDB visibilitychange probe change. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 7ac9c50ac0
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| // Safari kills IDB connections for backgrounded tabs. By probing as soon as | ||
| // the tab becomes visible, we drop the stale dbp early so the first real | ||
| // operation opens a fresh connection instead of failing. | ||
| document.addEventListener('visibilitychange', () => { |
There was a problem hiding this comment.
Guard visibility listener outside document contexts
In non-window browser contexts that still support IndexedDB, such as Web Workers/service workers, document is undefined while indexedDB is available (MDN documents WorkerGlobalScope.indexedDB: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/indexedDB). Because createStore() now touches document during initialization, Onyx.init() throws before the store can be created in those contexts, whereas the previous implementation could use IndexedDB there. Wrap this listener setup in a typeof document !== 'undefined' check so worker-based consumers keep working and only window tabs install the foreground probe.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
its only run in web and we had this change before and we reverted it
Details
Adds a proactive
visibilitychangeprobe to the IDB connection manager, building on the reactive heal mechanism from #780.Problem: Safari kills IDB connections for backgrounded tabs (WebKit #197050, #201483). When the user returns to the tab, the burst of writes on reconnect hits the dead cached
dbp— every write fails before the reactive heal can kick in.Solution: Register a
visibilitychangelistener insidecreateStore()that runs a lightweight readonlycount()probe when the tab becomes visible. If the probe detects a dead IDB connection, it drops the staledbpbefore the write burst arrives, so the first real operation opens a fresh connection.What it does:
isStaleConnectionError()— union detector for all three stale connection error types (InvalidStateError, backing store corruption, connection lost)visibilitychangelistener with aprobePromiseguard — prevents a stale probe from clearing adbpthat was already replaced by a concurrent heal/retryreq.onerror— only dropsdbpfor actual stale connection errors, not unrelated IDB errorslogInfoon probe start ("tab became visible, checking connection health") and healthy result ("connection is healthy");logAlerton stale detection ("stale connection detected, dropping cached connection") with the error messageRelated Issues
Expensify/App#87864
Linked E/App PR
Expensify/App#92762
Automated Tests
4 new tests in
tests/unit/storage/providers/createStoreTest.ts, in thedescribe('visibilitychange probe')block:dbpdbpexists yetInvalidStateErrorsynchronous throw is handledAll tests pass (
npx jest tests/unit/storage/providers/createStoreTest.ts→ 23 passed).Manual Tests
Simulating Safari connection lost:
IDB visibilitychange probe: stale connection detected, dropping cached connectionappears (if Safari killed the connection)Author Checklist
### Related Issuessection above### Linked E/App PRsection above, and verified this change against it (E/App CI passed and manual testing completed)TestssectiontoggleReportand notonIconClick)myBool && <MyComponent />.STYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)/** comment above it */thisproperly so there are no scoping issues (i.e. foronClick={this.submit}the methodthis.submitshould be bound tothisin the constructor)thisare necessary to be bound (i.e. avoidthis.submit = this.submit.bind(this);ifthis.submitis never passed to a component event handler likeonClick)Avataris modified, I verified thatAvataris working as expected in all cases)mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
N/A — library-level change, IDB is web-only. No UI, no native code touched.
Android: mWeb Chrome
N/A — library-level change, IDB is web-only. No UI, no native code touched.
iOS: Native
N/A — library-level change, IDB is web-only. No UI, no native code touched.
iOS: mWeb Safari
ADD_IOS_MWEB_SAFARI_RECORDING
MacOS: Chrome / Safari
Healed (simulated error):
healed.mov
Killed connection (simulated error):
killed.mp4
Exhausted (simulated error):
exhausted.mov
Healed (simulated on Safari):
safari_error.mp4
Killed connection (simulated on Safari):
safari_killed.mp4
Exhausted (simulated on Safari):
safari_exhausted.mp4
Healed offline (simulated on Chrome):
offline.mp4