Fix Sentry breadcrumbs collection during initialization

[Gudahtt]

Explanation

The refactor of the Sentry state in #20491 accidentally broke our opt- in detection in the beforeBreadcrumbs hook for errors in the background process. It would have broken our error report opt-in detection as well, except that that function was broken in a way that made it work correctly but inefficiently (it was loading the persisted state each time to check, ignoring the application state).

The opt-in detection has been updated to look for both types of application state (during and after initialization). The function was refactored to be used for the beforeBreadcrumbs hook as well.

Manual Testing Steps

This was discovered by @danjm when investigating the e2e test failure in #20517. This can be tested by following a similar approach to the failing e2e test: modify the persisted state in a way that breaks a migration, and ensure the breadcrumbs are collected.

The steps I took are:

• Comment out this line:

  metamask-extension/app/scripts/lib/setupSentry.js

  Line 140 in 88212a7

  return undefined;

• Create a development build with a valid SENTRY_DSN_DEV set in .metamaskrc
• Run this code snippet in the background console after installing the extension:

chrome.storage.local.get(({ data, meta }) => chrome.storage.local.set({ data: { ...data, MetaMetricsController: { ...data.MetaMetricsController, participateInMetaMetrics: true }, OnboardingController: { ...data.OnboardingController, completedOnboarding: true }, NftController: false }, meta: {...meta, version: 20} }, () => { window.location.reload() }))

• This snippet sets the version back far enough that there are plenty of console logs/breadcrumbs to collect
• onboardingComplete is set to true and participateInMetaMetrics is set to true so that the request goes through and breadcrumbs aren't suppressed
• See that there is a resulting Sentry error report in the network tab, and breadcrumbs are included in the payload
• Try again with onboardingComplete set to false, and you should see the same error report but without the breadcrumbs
• Try again with participateInMetaMetrics set to false and there should be no error report
• After initialization, try running window.stateHooks.throwTestError() in the UI (checking the network tab to see whether an error is sent, and whether it has breadcrumbs, which should depend on the two properties referenced earlier)
• After initialization, try running window.stateHooks.throwTestBackgroundError() in the UI (checking the network tab to see whether an error is sent, and whether it has breadcrumbs, which should depend on the two properties referenced earlier)

Pre-merge author checklist

• I've clearly explained:
  • What problem this PR is solving
  • How this problem was solved
  • How reviewers can test my changes
• Sufficient automated test coverage has been added

Pre-merge reviewer checklist

• Manual testing (e.g. pull and build branch, run in browser, test code being changed)
• PR is linked to the appropriate GitHub issue
• IF this PR fixes a bug in the release milestone, add this PR to the release milestone

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.

[metamaskbot]

Builds ready [0ee1b5f]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5, 6
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1596 ± 42 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	109	218	135	25	12
		domContentLoaded	1414	1741	1596	87	42
		load	1414	1741	1596	87	42
		domInteractive	1414	1741	1595	87	42

Bundle size diffs [🚀 Bundle size reduced!]

• background: -55 Bytes (-0.00%)
• ui: 0 Bytes (0.00%)
• common: -55 Bytes (-0.00%)

[Gudahtt]

OK, test instructions updated, I think it works now. I was thrown off at first because I wasn't seeing any breadcrumbs, but that was because I was only moving the state back to migration 91, which is far enough to produce console warnings but not far enough to guarantee they're picked up by Sentry in time to be included.

[codecov]

Codecov Report

Merging #20521 (a745509) into develop (88212a7) will decrease coverage by 0.03%.
The diff coverage is 0.00%.

@@             Coverage Diff             @@
##           develop   #20521      +/-   ##
===========================================
- Coverage    68.68%   68.65%   -0.03%     
===========================================
  Files          991      991              
  Lines        38451    38467      +16     
  Branches     10329    10333       +4     
===========================================
  Hits         26409    26409              
- Misses       12042    12058      +16     

Files Changed	Coverage Δ
app/scripts/lib/setupSentry.js	41.07% <0.00%> (-4.32%)	⬇️

[danjm]

LGTM!

[metamaskbot]

Builds ready [aabb66b]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5, 6
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1551 ± 55 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	107	172	119	13	6
		domContentLoaded	1396	1913	1551	115	55
		load	1397	1914	1551	115	55
		domInteractive	1396	1913	1551	115	55

Bundle size diffs [🚨 Warning! Bundle size has increased!]

• background: 295 Bytes (0.01%)
• ui: 0 Bytes (0.00%)
• common: 295 Bytes (0.01%)

[metamaskbot]

Builds ready [a745509]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5, 6
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1914 ± 73 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	116	232	162	29	14
		domContentLoaded	1577	2161	1911	151	73
		load	1577	2187	1914	153	73
		domInteractive	1577	2161	1911	151	73

Bundle size diffs [🚨 Warning! Bundle size has increased!]

• background: 255 Bytes (0.01%)
• ui: 0 Bytes (0.00%)
• common: 255 Bytes (0.01%)

[danjm]

LGTM

[NidhiKJha]

LGTM! PR description is written very nicely 🤩