Metamask window freeze after 'cy.confirmMetamaskTransaction() intermittently '[🐛 Bug]: <title>

[LsilvaPorto]

🔎 Have you searched existing issues to avoid duplicates?

• I have made sure that my issue is not a duplicate.

🧪 Have you tested your code using latest version of Synpress?

• I have made sure that my issue still exists on latest version of Synpress.

💡 Are you able to provide enough information to be able to reproduce your issue locally?

• I can provide enough details to reproduce my issue on local environment.

Synpress version

3.7.2-beta.9

Node.js version

18.18.2

Operating system

MacOS Sonoma 14.2 (23C64)

Run mode

Synpress (standalone)

CI platform (if applicable)

No response

Are you running your tests inside docker? (if applicable)

• This issue could be related to docker.

What happened?

When I'm trying to confirm a transaction with synpress, a spin appears in metamask window, it doesn't close and test fails, it happens intermittently, but always with the method cy.confirmMetamaskTransaction()

What is your expected behavior?

Metamask window close after transaction

How to reproduce the bug.

open a page
connect metamask
accept 3 transactions one after other

Relevant log output

synpress:helpers [checkNetworkAdded] Checking if network is already added {
  id: '80001',
  name: 'Mumbai',
  nativeCurrency: { symbol: 'MATIC' },
  rpcUrls: { public: { http: [Array] }, default: { http: [Array] } },
  blockExplorers: { etherscan: { url: undefined }, default: { url: undefined } },
  testnet: 'true'
} +2ms
  synpress:helpers [checkNetworkAdded] Network doesn't exist +1ms
  synpress:helpers [checkNetworkAdded] Checking if network is already added {
  id: '80001',
  name: 'Mumbai',
  nativeCurrency: { symbol: 'MATIC' },
  rpcUrls: { public: { http: [Array] }, default: { http: [Array] } },
  blockExplorers: { etherscan: { url: undefined }, default: { url: undefined } },
  testnet: 'true'
} +0ms
  synpress:helpers [checkNetworkAdded] Network doesn't exist +0ms
  synpress:helpers [addNetwork] Adding new network: [object Object] +0ms
  synpress:helpers Setting network to {
  id: '80001',
  name: 'Mumbai',
  nativeCurrency: { symbol: 'MATIC' },
  rpcUrls: { public: { http: [Array] }, default: { http: [Array] } },
  blockExplorers: { etherscan: { url: undefined }, default: { url: undefined } },
  testnet: 'true',
  network: 'mumbai'
} +4s
  create Marketplace spec
  synpress:metamask [confirmTransaction] Checking if recipient address is present.. +0ms
  synpress:metamask [confirmTransaction] Getting recipient address.. +2ms
  synpress:metamask [confirmTransaction] Checking if network name is present.. +175ms
  synpress:metamask [confirmTransaction] Getting network name.. +1ms
  synpress:metamask [confirmTransaction] Getting transaction nonce.. +16ms
  synpress:metamask [confirmTransaction] Confirming transaction.. +20ms
  synpress:metamask [confirmTransaction] Transaction confirmed! +1s
  synpress:metamask [confirmTransaction] Checking if recipient address is present.. +27s
  synpress:metamask [confirmTransaction] Checking if network name is present.. +1ms
  synpress:metamask [confirmTransaction] Getting network name.. +3ms
  synpress:metamask [confirmTransaction] Getting transaction nonce.. +45ms
  synpress:metamask [confirmTransaction] Confirming transaction.. +31ms
  synpress:metamask [confirmTransaction] Transaction confirmed! +423ms
  synpress:metamask [confirmTransaction] Checking if recipient address is present.. +30s
  synpress:metamask [confirmTransaction] Getting recipient address.. +1ms
  synpress:metamask [confirmTransaction] Checking if network name is present.. +202ms
  synpress:metamask [confirmTransaction] Getting network name.. +1ms
  synpress:metamask [confirmTransaction] Getting transaction nonce.. +16ms
  synpress:metamask [confirmTransaction] Confirming transaction.. +25ms
    1) should create a Marketplace successfully
    2) should close a Marketplace successfully


  0 passing (3m)
  2 failing

  1) create Marketplace spec
       should create a Marketplace successfully:
     CypressError: `cy.task('confirmMetamaskTransaction')` failed with the following error:

> page.waitForEvent: Timeout 30000ms exceeded while waiting for event "close"
=========================== logs ===========================
waiting for event "close"
============================================================

https://on.cypress.io/api/task
      at <unknown> (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:151171:78)
      at tryCatcher (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:18744:23)
      at Promise._settlePromiseFromHandler (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:16679:31)
      at Promise._settlePromise (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:16736:18)
      at Promise._settlePromise0 (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:16781:10)
      at Promise._settlePromises (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:16857:18)
      at _drainQueueStep (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:13451:12)
      at _drainQueue (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:13444:9)
      at ../../node_modules/bluebird/js/release/async.js.Async._drainQueues (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:13460:5)
      at Async.drainQueues (https://afrodite.bepro.network/__cypress/runner/cypress_runner.js:13330:14)
  From Your Spec Code:
      at Context.eval (webpack:///./node_modules/@synthetixio/synpress/support/commands.js:196:0)
  
  From Node.js Internals:
    Error: page.waitForEvent: Timeout 30000ms exceeded while waiting for event "close"
    =========================== logs ===========================
    waiting for event "close"
    ============================================================
    page.waitForEvent: Timeout 30000ms exceeded while waiting for event "close"
    =========================== logs ===========================
    waiting for event "close"
    ============================================================
        at Object.waitAndClick (/Users/lucasporto/Downloads/Projetos/Bepro/SynpressBeproTests/node_modules/@synthetixio/synpress/commands/playwright.js:236:16)
        at async confirmTransaction (/Users/lucasporto/Downloads/Projetos/Bepro/SynpressBeproTests/node_modules/@synthetixio/synpress/commands/metamask.js:1189:5)

  2) create Marketplace spec
       should close a Marketplace successfully:
     CypressError: Timed out retrying after 30050ms: `cy.click()` failed because this element:

[duckception]

Hey! How often does this happen? I'm 99% sure that this is due to MetaMask waiting for a response from the RPC 🤔

[louis-md]

Related to #411

The error in this case is:

CypressError: `cy.task('confirmMetamaskTransaction')` failed with the following error:

> [switchToMetamaskNotification] Max amount of retries to switch to metamask notification window has been reached. It was never found.

https://on.cypress.io/api/task
      at <unknown> (https://localhost:3001/__cypress/runner/cypress_runner.js:151389:78)
      at tryCatcher (https://localhost:3001/__cypress/runner/cypress_runner.js:18744:23)
      at Promise._settlePromiseFromHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:16679:31)
      at Promise._settlePromise (https://localhost:3001/__cypress/runner/cypress_runner.js:16736:18)
      at Promise._settlePromise0 (https://localhost:3001/__cypress/runner/cypress_runner.js:16781:10)
      at Promise._settlePromises (https://localhost:3001/__cypress/runner/cypress_runner.js:16857:18)
      at _drainQueueStep (https://localhost:3001/__cypress/runner/cypress_runner.js:13451:12)
      at _drainQueue (https://localhost:3001/__cypress/runner/cypress_runner.js:13444:9)
      at ../../node_modules/bluebird/js/release/async.js.Async._drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:13460:5)
      at Async.drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:13330:14)

[duckception]

Haven't tested it myself yet. Agree that this is related to #411, but how is that error you just showcased linked to all of this @louis-md? The problem in question is about the spinner and not notification window not appearing. I'm asking out of curiosity cause at this point you'll have better knowledge than I do on this topic 🤔

I still believe this is, unfortunately, related to how on rare occasions MetaMask hangs while waiting for an RPC response. I've had it happen to me a few times while writing the new version of Synpress, but not during confirming transactions but rather at the beginning of the onboarding process to MetaMask.

[louis-md]

After spending some time on this I think I went on the bottom of it. The command cy.confirmMetamaskTransaction ends with waiting for a close() event (the metamask window closing after confirming the transaction). However in the case where there are a set of multiple transactions, after one transaction is confirmed, the window does not close, instead it moves to the next transaction.

To make it work using multiple transactions, I used patch-package to comment out this line:

synpress/commands/metamask.js

Line 1192 in 00abaad

{ waitForEvent: 'close' },

This is a dirty fix, hopefully this could be solved in future versions by passing an option to cy.confirmMetamaskTransaction.

@duckception, the error I mentioned actually originated from my code, once fixed I had the same error than originally mentioned by @LsilvaPorto.

Hope it helps!

[LsilvaPorto]

Hey! How often does this happen? I'm 99% sure that this is due to MetaMask waiting for a response from the RPC 🤔

a lot, every time I need to call this method more than twice consecutively, that happens