My app hooks in beforeunload with a confirmation message and then MSW stops working

Describe the bug

I have some code in my page that hooks in beforeunload and then the user can cancel and stay in the page or leave the page. If the user decides to stay in the page msw gets broken.

Environment

• msw: 0.35.0
• nodejs: v17.4.0
• npm: 8.3.1
• nuxt 3
• vite

Please also provide your browser version.

Firefox 98.0b

To Reproduce

Steps to reproduce the behavior:

Add some code like:

window.addEventListener("beforeunload", function(e) {
      const confirmationMessage = "Msw will not work from this point";
      e.returnValue = confirmationMessage;     // Gecko, Trident, Chrome 34+
      return confirmationMessage;              // Gecko, WebKit, Chrome <34
});

Cancel and remain in the page Trigger some mocked mutation

Expected behavior

Mutation should be triggered

Screenshots

I can go to .vite generated code and delete those lines and then the mutation is triggered.

[Ryomasao]

I’m having the same problem.

The order beforeunloads are executed is the order in which they are registered, so msw’s beforeunload is executed first before e.stopImmediatePropagation or e.stopPropagation is executed in the application.

Is there any way to do this? Like restarting the worker when beforeunloading?

UPDATE

I tried to start the worker again beforeunload, but the following error occurred.

[florianmatz]

Same here 😛 - as described evt.preventDefault() is not working, because it is to late. Any updates?