Next-auth: Testing Apps using `next-auth` ?

[ndom91]

Your question
So I'm setting up cypress to begin some e2e testing of an app using next-auth and I've gotten stuck at how to deal with logging in. Other than the login form, my entire app is behind next-auth, so I need to be able to programmatically login or mock the session somehow.

Does anyone have any suggestions or examples as to how they went about dealing with this?

What are you trying to do
Deal with the login procedure in a testing environment. Cypress in my case.

[Fumler]

It would be the same as in any app using login really. Cypress runs in a browser.

Have you looked at https://docs.cypress.io/examples/examples/recipes.html#Logging-In ?

[ndom91]

Right, and I did some googling for oauth login already, but I figured maybe there was a way to mock that session variable instead in order to skip the actual login process.

[Fumler]

You can probably mock it, but don't you want to have an e2e test for checking if logging in actually works as well? Doing that you can get the cookies you need for later tests as well.

edit: You have for instance https://github.com/lirantal/cypress-social-logins to help if you only have social logins

[iaincollins]

Assume you have seen the awesome work @JeffersonBledsoe has been up to in #298 - it started out as a PR and discussion in the the example projects repo, but we both wanted it here really, as easier to then automate later.

It's using Cypress and looks amazing!

I'm planning to look at doing stuff to support that soon - with an approach of running a "NextAuth.js" server inside a Docker container so it can have local access to a database to do real database integration tests (e.g. to check if things are actually working as intended, user accounts are getting created with the right properties, etc).

Of course, a no-database flow would be a simpler place to start. :-)

Build on what @Fumler was saying I thought a dummy OAuth service (e.g. a few endpoints that return JSON and provider configured to talk to them) would make a good way of mocking only the OAuth server part, while testing the full flow of NextAuth.js

I hadn't see stuff like the cypress social logins though, thanks! Will check that out, maybe that is a better approach!

[ndom91]

Yeah I just found that cypress-social-logins repo like 2 minutes ago as well haha. I figure Google OAuth Login will always be working, so I don't really want to test that, but I guess skipping the whole process leaves some stuff uncovered from my side as well.

@iaincollins I did see #298 actually and thats where I pulled the initial cypress setup from for my project ;)

EDIT: It seems that cypress plugin is just what I needed. I'll give it a shot and then possibly add a little something to the docs if I get it working, is that okay @iaincollins ?

[iaincollins]

It seems that cypress plugin is just what I needed. I'll give it a shot and then possibly add a little something to the docs if I get it working, is that okay @iaincollins ?

Awesome please do! I didn't think we'd be able to test with real OAuth accounts (because it would be too much hassle to set up)it would be brilliant if we could! cc @JeffersonBledsoe for visibility

[ndom91]

Yeah I was thinking more as an example for others so they could get started testing their own nextauth instance quickly.

[ndom91]

So I've gotten the cypress-social-login to mostly work - google still jumps in between and asks for me to type out those grabbled strings before letting the cypress instance in, but thats another issue..

I can't seem to get cypress to logout after a run, so that the next run is starting fresh. Clearing cookies and localstorage doesn't seem to do it. If I cy.visit('/api/auth/signout') at the end of the run, it seems to signout but the next run is immediately signed back in. What am I missing here?

EDIT: I guess this is only an issue when i'm testing and rerunning the same test over and over in the same cypress instance / window. Once you close it and reopen you're obviously not signed-in anymore. This will be the case in actual testing scenarios too so I guess this isn't really an issue.

EDIT 2: Okay finally working haha. I'll post up the example soon :+1:

[ndom91]

Added a docs page with info on how to get started testing NextAuth.js login in ones apps with Cypress. https://github.com/iaincollins/next-auth/pull/357

[stale[bot]]

Hi there! It looks like this issue hasn't had any activity for a while. It will be closed if no further activity occurs. If you think your issue is still relevant, feel free to comment on it to keep ot open. Thanks!

[stale[bot]]

Hi there! It looks like this issue hasn't had any activity for a while. To keep things tidy, I am going to close this issue for now. If you think your issue is still relevant, just leave a comment and I will reopen it. (Read more at #912) Thanks!