fix: flaky test onboarding @no-mmi doesn't make any network requests to infura before onboarding is completed/test-failure-screenshot.png and onboarding @no-mmi Clicks create a new wallet, accepts a secure password, reveals the Secret Recovery Phrase, confirm SRP/test-failure-screenshot.png

[seaona]

Description

This PR fixes more onboarding flakiness onboarding @no-mmi doesn't make any network requests to infura before onboarding is completed/test-failure-screenshot.pn and onboarding @no-mmi Clicks create a new wallet, accepts a secure password, reveals the Secret Recovery Phrase, confirm SRP/test-failure-screenshot.png .

The error is originated when we try to click an element which is in stale state StaleElementReferenceError: stale element reference: stale element not found in the current frame.
This is a race condition originated in the clickElement method, in the following way:

1. we try to find the clickable element
2. the element is refreshed in between
3. right after, we try to click the element from 1 --> this results in the element being stale, as the element we are trying to click is an old instance (1) instead of (2)

Extra note: this race condition is surfaced in the Onboarding tests mostly (I've only seen it fail there, so far), since I suspect that the the actions we perform there, all refresh the same react component for onboarding, giving a window for this casuistic to happen

• Circle ci job failures: https://app.circleci.com/pipelines/github/MetaMask/metamask-extension/83037/workflows/b435d63d-e50c-4dcd-af7d-4f6e0856ab6c/jobs/2967823/artifacts
• Circle ci logs:

Related issues

Fixes: #24602 (remaining items)

Manual testing steps

1. Check ci or run onboarding tests multiple times (though I've never been able to repro this locally)

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I’ve followed MetaMask Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[metamaskbot]

Builds ready [cc36a2b]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• builds (test): chrome, firefox
• builds (test-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, 5, 6
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
  • content-script: 0
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (728 ± 480 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	62	189	101	31	15
		domContentLoaded	9	40	15	9	5
		load	52	2582	728	999	480
		domInteractive	9	40	15	9	5

Bundle size diffs

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

[metamaskbot]

Builds ready [ca8a454]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• builds (test): chrome, firefox
• builds (test-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, 5, 6
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
  • content-script: 0
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1230 ± 613 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	85	211	120	37	18
		domContentLoaded	9	43	14	8	4
		load	72	2995	1230	1277	613
		domInteractive	9	43	14	8	4

Bundle size diffs

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

[Gudahtt]

Was this what was intended?

await this.delay(1000);

I'm not seeing a delay function on the internal webdriver instance. I'm seeing a this.driver.delay is not a function error on various e2e jobs

[seaona]

oops that is a great catch! indeed it should be this.delay()

[seaona]

here is the fix
#24838

thank you v much Mark 🙏

[seaona]

on the bright side, this means that this race-condition was happening quite often 😅

[metamaskbot]

Missing release label release-11.16.6 on PR. Adding release label release-11.16.6 on PR and removing other release labels(release-11.18.0), as PR was cherry-picked in branch 11.16.6.