Migrate from cy.route to cy.intercept - requests mocked via MSW are not intercepted anymore

[ElisaDellaC]

Current behavior

For our component tests we use storybook to render the component in isolation and cypress to run tests against it.
We have mocking done at Storybook level using Mock Service Worker

using cy.route we could successfully spy on the mocked requests, once migrating to cy.intercept even if I can see the requests in the network tab of the developer tools, they are not intercepted by the cy.intercept

Desired behavior

If this is a wanted change in behaviour, could you please advice on a workaround to migrate to cy.intercept that supports our use case?

Test code to reproduce

https://github.com/rosahealth/mws-cypress-storybook

Versions

Migrate from version 5.0.0 to 6.3.0

[Wimpert]

I also have the same issue !

[icruzr93]

I'm facing the same issue, not a big deal on my side but I would like to know the workaround about this.

[mmanista-bynd]

The issue appears to still exist in version 7.6.0.

To add up to that - it's very unlikely that there is any race condition between the msw and the test itself, because the exact same scenario works perfectly fine when using cy.route instead of cy.intercept.

[mmanista-bynd]

Feels like this might need to be stated more clearly in the docs as it's not that obvious (especially when we reach the point where we need to migrate to cy.intercept), probably with some notes on how to tackle this

[ArtifexEt]

Does this mean that way of intercept data will no longer be supported? Or will there be another way?

[mataspetrikas]

I can confirm that the problem still persists in 2022.
I'm using the current versions of msw 0.36.8 and cypress 9.3.1.
cy.route captures the mocked graphql request, but cy.intercept doesn't.
as a resut we'll try to stick with cy.route as long as we can.

[pascalvos]

any update on this?

[mataspetrikas]

tested with msw 0.39.2 and cypress 10.9.0, the problem still persists:

• cy.route() intercepts the mocked requests
• cy.intercept() doesn't intercept the mocked requests

[s4ms00n9]

any update on this?

I don't think this need fixing, since it is expected behaviour.

Since it is suggested to switch from cy.route() to cy.intercept(), it rather looks like getting rid of a feature that cy.route() had. I'd also like to know if this issue is going to be investigated further or it is ghoing to be dropped and I need to find a workaround for overwriting a msw response in a test.

[silent-tan]

yet, same problem, and i need to fork the cypress-msw-intercept to change to fit my case.

[mataspetrikas]

the latest Cypress release 12.0 removes the cy.server and cy.route methods:
#22126

I have tried using the https://github.com/deshiknaves/cypress-msw-interceptor but it doesnt seem to be able to priduce an alias that can be captured :(

[singhAmandeep007]

I have prepared a React + Vite boilerplate which includes integration of MSW with Vitest and Cypress.

This allows to easily test an application with mocked responses.
With mocked response you can easily simulate a success scenario as well as failure scenario, thus covering most of user stories.

What's included ?
✅ Automatic reset
✅ Isolation
✅ Logging
✅ Fully Type safe
✅ With middleware

Repo
MSW + Cypress
MSW + Vitest

Please give it a ⭐️ if it helped.