Using Mock Service Worker to mock api requests in SSR mode

[CodyBontecou]

Does anyone have an example of getting mswjs.io to work within a cypress end-to-end test for nuxtjs? I'm struggling to get my UI to reflect the mocked requests.

[atinux]

Could you share a repo with what you are trying to achieve?

[CodyBontecou]

Hey @atinux, I'm currently working with @kevinold over at Cypress to find a solution. He has an experimental solution so far that seems to be working in some cases.

I'm not sure whether or not I can share the repo, I'll ask him.

The goal I'm trying to achieve is mocking UI states to test against using an end-to-end testing tool such as Cypress.

[kevinold]

@CodyBontecou Absolutely, the repo is public.

Hi @atinux,

For context, here is an experimental repo with a solution we are testing as a general solution for mocking SSR content in various Node projects. See the installation section in that you must install it directly from GitHub as it is not published yet to npm.

https://github.com/cypress-io/cypress-mock-ssr

This package provides:

• cypressMockMiddleware -- Connect middleware to register mock endpoints
• mockSSR and clearSSRMocks -- Cypress commands to register a mock and clear them between tests.

The instructions for using it with Nuxt is here:
https://github.com/cypress-io/cypress-mock-ssr#nuxtjs

In addition, I have pushed a branch demonstrating its usage for tests to our Cypress Documentation repo which is written in Nuxt:

cypress-io/cypress-documentation#4099

Please let me know if you have any questions and I appreciate your feedback!