I have a Next app. I want to test E2E with mock apis (MSW), because I want fast tests that don't depend on third-parties to succeed.
Let's imagine we have a stack like this : HomePage > click on Button > action.ts > axios.post('hostName/api/action') > api/action.ts > axios.post('third-party') [MSW mock] > bubble up > expect(somethingHappenedInHomePage)
I imagined many solutions to test it:
Solution 1 : Cypress, MSW
- There are some solutions on internet but they look wobbly (to set up msw in cypress)
- Cypress tests are slow
- I don't care to run it in Chrome (cypress does ?)
- Cypress is commonly though as a E2E testing framework, therefore people don't like to mock third-parties.
Solution 2 :Testing-Library/react, jest and msw (using nextJest)
- This is fast
- I can't get it do work
- env=jsdom I can't have axios even calling the app connect ECONNREFUSED 127.0.0.1:3000
- env=node I can't have access to document/window (which are necessary to render components)
The trick here is to be able to component test while at the same time, running the entire stack (which requires node generally). Maybe I could also pre-start my app before running the test ?