-
Notifications
You must be signed in to change notification settings - Fork 5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix pre-initialization UI error state capture #20529
Conversation
@@ -31,7 +31,6 @@ export default class ReadOnlyNetworkStore { | |||
const response = await fetchWithTimeout(FIXTURE_SERVER_URL); | |||
if (response.ok) { | |||
this._state = await response.json(); | |||
this.mostRecentRetrievedState = this._state; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is why the test had passed earlier when it should have failed: this property was set too early, before the first read. In production it's only set upon read.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good catch!
90e2751
to
37c93da
Compare
@@ -100,6 +94,9 @@ const openMetamaskTabsIDs = {}; | |||
const requestAccountTabIds = {}; | |||
let controller; | |||
|
|||
// state persistence |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In the case where an error is thrown in the UI before initialization has finished, we aren't capturing the application state correctly for Sentry errors. We had a test case for this, but the test case was broken due to a mistake in how the `network-store` was setup (it was not matching the behavior of the real `local-tstore` module). The pre-initialization state capture logic was updated to rely solely upon the `localStore` instance used by Sentry to determine whether the user had opted-in to metrics or not. This simplifies the logic a great deal, removing the need for the `getMostRecentPersistedState` state hook. It also ensures that state is captured corretly pre- initialization in both the background and UI.
37c93da
to
185ab6d
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code looks good. I will do a manual test
Codecov Report
@@ Coverage Diff @@
## develop #20529 +/- ##
========================================
Coverage 68.66% 68.66%
========================================
Files 991 991
Lines 38467 38465 -2
Branches 10333 10333
========================================
Hits 26411 26411
+ Misses 12056 12054 -2
|
Builds ready [185ab6d]
Page Load Metrics (2122 ± 124 ms)
Bundle size diffs [🚀 Bundle size reduced!]
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Manual QA was good
Explanation
In the case where an error is thrown in the UI before initialization has finished, we aren't capturing the application state correctly for Sentry errors. We had a test case for this, but the test case was broken due to a mistake in how the
network-store
was setup (it was not matching the behavior of the reallocal-tstore
module).The pre-initialization state capture logic was updated to rely solely upon the
localStore
instance used by Sentry to determine whether the user had opted-in to metrics or not. This simplifies the logic a great deal, removing the need for thegetMostRecentPersistedState
state hook. It also ensures that state is captured corretly pre- initialization in both the background and UI.Manual Testing Steps
Update
ui/index.js
to throw an error during initialization (but after thegetMostRecentPersistedState
hook was setup, if testing ondevelop
). Ondevelop
, you'll see that the resulting error doesn't include Sentry state, even though it was meant to. On this PR it will include the state in the error report.Alternatively you could do what the e2e test does and wait until after initialization, but "emulate" a pre-initialization state by deleting the
getSentryAppState
state hook. Then you can more easily trigger an error by callingwindow.stateHooks.throwTestError()
. Again, you should see the same result (ondevelop
the state will be missing, but on this PR it will be present).Pre-merge author checklist
Pre-merge reviewer checklist
If further QA is required (e.g. new feature, complex testing steps, large refactor), add the
Extension QA Board
label.In this case, a QA Engineer approval will be be required.