Add initial end-to-end tests

[JeffersonBledsoe]

This PR adds some initial end-to-end tests using Cypress. Testing Library is used for the cypress tests to make best-practise tests easier to write and easier to read.

Completed Tests

• Sign-in page flow (/api/auth/signin):
  • Buttons are displayed for each of the configured providers
  • Entering a valid email
  • Entering an invalid email causes the error page to be displayed
  • Each provider button takes you to the page corresponding with that providers auth
  • A JWT workflow with a database works
  • A JWT workflow without a database works
• Sign-out page flow (api/auth/signout):
  • Button displayed for signing out
  • Text displayed asking if the user is sure
• Email verification page flow (/api/auth/veritfy-request)
  • Correct text is displayed for email verification
• Error page flow (/api/auth/error):
  • Sign in failed page content
  • Server error page content
  • Access denied page content
  • Verification page content
• Example start page (/):
  • Text and button along the top changes if you are signed in or signed out
  • When signed in, check the user has a name and/ or email, as well as an image

Issues

• Sign-in page:
  • The "email" input is not labeled and relies on a placeholder to convey it's meaning.

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/iaincollins/next-auth-example/lelf1m28e
✅ Preview: https://next-auth-example-git-fork-jeffersonbledsoe-e2e-tests.iaincollins.vercel.app

[iaincollins]

Hey this is fantastic! <3

I was thinking we would add the tests to the actual next-auth repo (and just use the example site URL to get started writing tests) so we can more easily hook up CD/CI - but I don't have strong feelings about that - and I haven't thought through all the advantages / disadvantages.

(If I implied we should add the tests here and that was confusing! If you just felt that this is an easier place to put them, no problem.)

This is all I can come up with off the top of my head:

Advantages

• Less complexity so easier / less friction to write (the next-auth repo is hairy and limited documentation for contributors)

Disadvantages

• Harder to integrate tests in CD/CI - e.g. when a Pull Request is raised on next-auth
• Bit harder to maintain tests as tests and code in a different repo

Welcome your thoughts!

I am completely cool with "actually this is easier for now, can we look at that later". :-)

[iaincollins]

In the meantime, I will get on with making that Docker container and try running these tests against it to see how far I get! Just a heads up that I think that might take me a few days to get round to as a few things going on this week!

Thanks again for doing this and look forward to working more on it!

[iaincollins]

PS: I love how simple this is, this is wild! Good call on cypress.

Good catch on the Email label, I've been meaning to fix that accessibility issue - will add one.

[JeffersonBledsoe]

I was thinking we would add the tests to the actual next-auth repo (and just use the example site URL to get started writing tests) so we can more easily hook up CD/CI - but I don't have strong feelings about that - and I haven't thought through all the advantages / disadvantages.

@iaincollins That's my bad! I mistook If you are able to get a test working in the interim for https://next-auth-example.now.sh/ that would be wonderful! to mean get it working within the example repo rather than running against the live site. I agree that having it in a separate repo adds more complexity than working on the live site. I'll move this PR over to the next-auth repo and change the Cypress baseUrl to https://next-auth-example.now.sh to run against the live site later :)

I'll probably add a few more of the tests I mentioned in the PR (just accessing the URLs directly for now as it's simpler, rather than trying to create a 'signin' workflow test)

[iaincollins]

Oh that is totally on me! 😂 Communicating via tickets is hard! That would be awesome! Agree, starting by testing URLs seems like a good approach!

I will tag you when I raise a PR that has a command like npm run test:docker (or something like that) that does all the stuff required to spin up an instance in a Docker image in the next-auth repo. I don't know if it's possible to make the endpoint the tests run against an an environment variable but that would be fantastic.

[JeffersonBledsoe]

I've never done it before, but the Cypress docs on environment variables suggest you can set CYPRESS_BASE_URL to override the baseUrl

[JeffersonBledsoe]

Superseded by iaincollins/next-auth #298.