https://cypress.io logo
Join Discord
Powered by
# e2e-testing
  • l

    late-planet-4481

    07/13/2022, 2:28 PM
    Apparently you have answered this question before 😄
  • a

    able-monkey-72947

    07/13/2022, 7:46 PM
    Does anyone have any experience with mocking NextJS's
    getStaticProps
    method?
  • f

    famous-restaurant-30435

    07/13/2022, 7:58 PM
    I dont think you can accomplish this with Cypress alone because cy.intercept looks for client side requests. We lean on MSW for mocking server side. https://mswjs.io/ You can then use a Cypress fixture to feed the MSW response and the same fixture validate client side if you need to.
  • a

    able-monkey-72947

    07/13/2022, 8:05 PM
    lol, small world. Yeah, we are using that already in the app for run time stuff, the issue is trying to mock these build time dependencies. What do you do, start MSW, up NextJS, run Cypress against it?
  • f

    famous-restaurant-30435

    07/13/2022, 8:07 PM
    Let me see if I can find an example.
  • f

    famous-restaurant-30435

    07/13/2022, 8:09 PM
    It doesnt look like I have a great one. But yes, during the build you would have to have MSW started already so it can intercept requests if your getStaticProps hook makes an API call
  • f

    famous-restaurant-30435

    07/13/2022, 8:10 PM
    This does make me want to create a simple example though.
  • a

    able-monkey-72947

    07/13/2022, 8:11 PM
    I'm looking at the Mocking requests in getStaticProps portion of this article - https://tomasgildev.com/posts/testing-nextjs-static-pages
  • f

    famous-restaurant-30435

    07/13/2022, 8:11 PM
    MSW is just so good. Not surprised to see that being the solution in the article there as well.
  • a

    able-monkey-72947

    07/13/2022, 8:14 PM
    I thought I had a POC repo somewhere too for this, looks like I do not. Bummer, but I'm going to try to make one now I guess.
  • a

    able-monkey-72947

    07/13/2022, 8:14 PM
    We have a branch on this app too trying to go from Cypress 9 -> 10 and running into a TON of issues because of the weird stuff we're doing, maybe this is the answer.
  • g

    gray-kilobyte-89541

    07/13/2022, 8:49 PM
    https://glebbahmutov.com/blog/mock-network-from-server/
  • f

    famous-restaurant-30435

    07/13/2022, 8:51 PM
    Of course you have a blog post for that.
  • f

    famous-restaurant-30435

    07/13/2022, 8:57 PM
    I say this with love because @gray-kilobyte-89541 puts out content in his sleep somehow
  • g

    gray-kilobyte-89541

    07/13/2022, 8:58 PM
    pretty much, all searchable from https://cypress.tips/search
  • a

    able-monkey-72947

    07/13/2022, 9:04 PM
    I actually have seen this article! This is exactly what we're doing in our app at the moment, there are some issues with running this in Cypress10 now that the plugins file is gone (that was actually me that bugged you about that on youtube last week).
  • a

    able-monkey-72947

    07/13/2022, 9:10 PM
    Quick but kind of unrelated question - https://docs.cypress.io/api/plugins/writing-a-plugin#List-of-events What is the distinction of
    run
    vs
    spec
    ?
    spec
    seems like an individual test, a run is... all of them?
  • f

    famous-restaurant-30435

    07/13/2022, 9:16 PM
    Run is all. Spec is an individual file which contains N number of tests.
  • f

    famous-restaurant-30435

    07/13/2022, 9:16 PM
    https://docs.cypress.io/api/plugins/after-spec-api
  • f

    famous-restaurant-30435

    07/13/2022, 9:16 PM
    https://docs.cypress.io/api/plugins/after-run-api
  • a

    able-monkey-72947

    07/13/2022, 9:18 PM
    Ah, cool. So if I wanted to start/stop a server it would probably mean hooking into `before:run`/`after:run`?
  • f

    famous-restaurant-30435

    07/13/2022, 9:19 PM
    https://docs.cypress.io/guides/end-to-end-testing/testing-your-app#Step-1-Start-your-server
  • f

    famous-restaurant-30435

    07/13/2022, 9:20 PM
    Anti-Pattern Don't try to start a web server from within Cypress scripts. Read about best practices here.
  • a

    able-monkey-72947

    07/13/2022, 9:20 PM
    Haha, I have seen this warning a few times.
  • f

    famous-restaurant-30435

    07/13/2022, 9:21 PM
    Are you just trying to start the app before the scripts are run using one command?
  • a

    able-monkey-72947

    07/13/2022, 9:22 PM
    This is kind of a doozy. In CI I need to run a command that will - start MSW - statically build our NextJS site (with the data returned from MSW) - run Cypress against that build of the app
  • f

    famous-restaurant-30435

    07/13/2022, 9:35 PM
    Hm its not a pattern I have experience with. I think you could start MSW with a node script, then build the app, then use start-server-and-test to star the app and execute Cypress.
  • f

    famous-restaurant-30435

    07/13/2022, 9:36 PM
    But I think you have 4 parts. 1. Start MSW 2. Build the app 3. Start the app 4. Execute Cypress against step 3
  • a

    able-monkey-72947

    07/13/2022, 9:47 PM
    That makes sense to me. I'm really drawing a blank on step 1 there... how would I do that?
  • f

    famous-restaurant-30435

    07/13/2022, 9:49 PM
    https://github.com/vercel/next.js/blob/canary/examples/with-msw/mocks/index.js
1...676869...192Latest