13.0.0+ hangs during cypress open when 'beforeunload' prevents default to prevent browser from closing with cypress-real-events

jennifer-shehane commented 8 months ago

Hey @dmtrKovalenko 👋🏻

We ran across an issue with hanging in Cypress that is solely reproducible with the introduction of the cypress-real-events plugin and use of its custom commands. I saw a couple of similar issues opened on your repo which seem like they were experiencing the same issue: https://github.com/dmtrKovalenko/cypress-real-events/issues/580 https://github.com/dmtrKovalenko/cypress-real-events/issues/597

The issue on our side is linked here: https://github.com/cypress-io/cypress/issues/28553 but we're not totally sure at this point if this is a Cypress issue or an issue with the plugin. It's strange.

Current behavior

When there's a listener for 'beforeunload' that has preventDefault to prevent the page from closing, cypress run will hang starting in 13.0.0 in Chrome (using 120) when a call is made to a custom command from the cypress-real-events plugin.

You can see when this is run locally that this popup appears and that's why it's hanging.

And this popup also occurs when you try to exit the browser during open mode.

Screen Shot 2023-12-19 at 1 40 07 PM

Test code to reproduce

cypress run --browser=chrome

test.cy.js

it('test', () => {
  cy.visit('index.html')
  // this can be any command! Try realType or realPress, etc
  cy.get('div').realClick()
})

index.html

<html>
<script>
  window.addEventListener('beforeunload', function (e) {
    e.preventDefault();
  });
  </script>
<body>
  <div></div>
</body>
</html>

package.json

{
  "devDependencies": {
    "cypress": "13.0.0",
    "cypress-real-events": "1.11.0"
}

Cypress Version

13.0.0

Node version

18.5.0

Operating System

Mac

dmtrKovalenko commented 8 months ago

Hey @jennifer-shehane it's been a long time!

We have specifically FAQ question covering this issue answer here: https://github.com/dmtrKovalenko/cypress-real-events?tab=readme-ov-file#3-why-do-i-get-are-you-sure-popups-when-i-am-using-real-events-and-why-i-do-not-get-them-while-using-the-normal-cypress-clicks

Let me know if this resolves the issue

jennifer-shehane commented 8 months ago

@dmtrKovalenko Yah, I suppose the mystery is why the behavior changed in 13.0.0. I'll have to do some more digging into what our intended behavior is meant to be here in Cypress. I'll close this issue on your side.

Is it the calls to CDP specifically that trigger the user activation in this case?

dmtrKovalenko commented 8 months ago

Yes because CDP events are treat as a real interaction while Cypress's default events aren't.

jennifer-shehane commented 8 months ago

None of the provided workarounds seem to prevent the dialog in this particular case.

dmtrKovalenko commented 8 months ago

Hmm. Then I'll need to find some time to investigate other workaround and how other frameworks e.g. playwright prevents them.

Any help appreciated

jennifer-shehane commented 8 months ago

I feel like you could use CDP to see when a JS dialog is opened: https://chromedevtools.github.io/devtools-protocol/tot/Page/#event-javascriptDialogOpening and then dismiss it https://chromedevtools.github.io/devtools-protocol/tot/Page/#method-handleJavaScriptDialog. It becomes a bit problematic for the plugin or Cypress to do this automatically though if someone was actually wanting to test the dialog was opened. Could probably just give the code snippet for CDP for people to include I guess.

satya081 commented 4 months ago

any updates on this issue?

dmtrKovalenko / cypress-real-events