How to mock the session object to the route api/auth/session in NextAuth in a new Next.js 13 app directory in my Cypress test?

Question

I am currently using the new Next.js 13 app directory and next-auth for authentication. The session is generated server-side, so I can't access the session object in Cypress. I want to mock the session object in Cypress so that I can test my application's functionality without having to be logged in.

I have tried the following to mock the session object:

• Using cy.intercept to intercept the /api/auth/session route. However, this only intercepts the route from the client-side request, not the server-side request.
• Using the client-side signIn method from next-auth and supplying credentials (I am using credentials signIn). However, this didn't work either. I am hoping someone can help me figure out how to mock the session object in Cypress so that I can test my application's functionality.

Here are some additional details about my environment:

• I am using NextAuth v4.22.1
• I am using Next.js v13.4.4
• I am using Cypress v12.3.0

Answer 1

I suggest you to take a look at msw. I use it a lot in every project.

https://mswjs.io/