I'm using SuperTokens in my NextJS app. I'm using ...
# support-questions
m
I'm using SuperTokens in my NextJS app. I'm using
doesSessionExist
and
isEmailVerified
from
supertokens-auth-react
to check on protected pages, if they do not have a session they get redirected and if the email is not verified they get redirected. My issue comes when I'm testing my pages with Cypress. Whenever Cypress loads up pages it fires off a request to
/auth/session/refresh
. If i just have Cypress set a cookie
sIRTFrontend: remove
it gets passed that request. But when It gets to my protected route wrapper and checks for
doesSessionExist
it will fail. My questions are: 1: How should we be mocking either a response for
/auth/session/refresh
or setting those cookies? 2: How should we be mocking the cookies so
doesSessionExist
actually returns true? As of now I can set some cookies for
doesSessionExist
with false data that just returns true but i cannot use that in conjunction with my solution for bypassing
/auth/session/refresh
r
hey @mwill8886
The best way to go around testing is to actually spin up a supertokens core and use that during your tests. You can spin one up without connected to a db (it will use an in mem db), and it should work. If you do not want to do that, then you will have to override the refresh API on the backend to return a new empty session object and set the following cookies in the response: - sAccessToken (can be some random string) - sRefreshToken (can be some random string) - sIdRefreshToken (some random string) - front-token header (base 64 encoded JSON containing the userID and expiry time of the access token. For example
{"uid":"14f5181b-08ce-497b-8788-96fba548f9b0","ate":1655879840417,"up":{}}
- id-refresh-token (some random string) The above will result in the frontend saying that the session exists. You will also need to modify the
getSession
recipe function to return a session object when the input is your mocked sAccessToken. Once you do both of the above, session testing should work.
c
(Hi, I'm @mwill8886 's coworker!) Could you point me to the documentation on how to fire up supertokens core for testing? I'm not quite sure where to find this in the docs.
r
Hey @csjaction there aren’t any docs for this at the moment. But you run bash script run the docker container and wait for it to start up by querying the /hello GET API
c
Thank you! Sorry, I ended up finding that docker container yesterday. We're still working on it to see if it helps us at all.
r
Cool
c
Ok, we finally got things working for our integration tests. This might help for anyone else with the same problem. (Maybe update testing docs?) We're just running Next.js with Cypress. No other backend service is running. (This let's us get code coverage tests for the front end much more easily than using Jest.) Here's the cypress command we added:
Copy code
Cypress.Commands.add('interceptApiAuthRefresh', (statusAndHeaders = { statusCode: 200, headers: null }) => {
  let { statusCode, headers } = statusAndHeaders
  if (headers === null) {
    const obj = {
      uid: '62e9e7d8-d87d-4a6d-934d-849b10efd57a',
      ate: Date.now() + 600_000,
      up: {
        userId: 'cl4j22f2c0020ldxgbx60v8s6',
        userPermanentId: 'b78b3e24-5b43-41fa-880d-d7cf008d0ec4'
      }
    }
    const encoded = btoa(JSON.stringify(obj))
    headers = {
      'front-token': encoded,
      'id-refresh-token': '218b03a5-71d3-40dd-b155-e35ae69eb7cd',
      'Access-Control-Expose-Headers': 'id-refresh-token, front-token'
    }
  }

  cy.intercept('POST', '/api/auth/session/refresh', {
    statusCode,
    headers
  })
})
We're encoding the front-token with the payload and making sure to set the expiration to sometime in the future for the test. This is the minimum I could set the headers to get a successful load of a page. The command allows for adding custom status codes and headers for other test scenarios.
This doesn't require any backend running (including supertokens core).
r
Thanks @csjaction ! Very helpful