Configure NextAuth to allow account linking between different providers in development environment

[alisonfung]

Checklist:

• I have read freeCodeCamp's contribution guidelines.
• My pull request has a descriptive title (not a vague title like Update index.md)

Closes #219

Authors: Alison Fung, Rahul Gupta, Ngoc Nguyen

Summary

Currently, logging in to Classroom through Auth0 with Google and then attempting to log in through Auth0 with Github using an account that has the same email associated with it returns the following error:

This solution adds account linking support for the development environment so that you are able to log in successfully without this error.

Details

This solution uses the spread operator to add an object property to the Auth0Provider object and the GithubProvider object. It also adds a new environment variable to only enable account linking in the development environment.

Testing

We tested on a local build with three options to login: Auth0 Google, Auth0 Github, and Github.

Note: When logging into Auth0 a second time, we had to use an Incognito/Private tab. Otherwise, it automatically logs you in without letting you choose between Google or Github.

To reproduce the problem:

1. Set up a local build using this guide. You must also set up a Github OAuth application, guide here, if you wish to test the Github Provider.
2. Run npm run develop
3. Open http://localhost:3000/
4. Click Sign In
5. Click Sign in with Auth0 > Continue with Google. Sign in with an email that is associated with your Github account.
6. Open an Incognito/Private tab. Go to http://localhost:3000/
7. Click Sign in with Auth0 > Continue with Github. Sign in with the Github account that is associated with your Google login.
8. You should receive the error: “To confirm your identity, sign in with the same account you used originally.”

To test, follow the same process, but you should not receive an error.

To unlink your accounts after each test case:

1. Open a new terminal window
2. Open Prisma Studio using npx prisma studio
3. Click on Users
4. Delete your record
5. On the Auth0 website, log in and navigate to your application
6. Click on User Management > Users
7. Delete the users associated with your email (You may need to refresh to see users)

Test Cases (Normal window -> Incognito window):

1. Auth0 Github -> Auth0 Google
2. Auth0 Google -> Auth0 Github
3. Auth0 Github -> Github
4. Auth0 Google -> Github
5. Github -> Auth0 Github
6. Github -> Auth0 Google

Logging into the third option after any two also links all three together. You can check this within Prisma Studio, such as in the image below:

The 3 Account indicates that Auth0 Google, Auth0 Github, and Github have been linked together.

[GuillermoFloresV]

Hi team, thanks for taking on this issue and working with us as the issue evolved!

I was wondering, for the allowDangerousEmailAccountLinking option, do we need it to be enabled for both the GitHub auth provider and the OAuth provider? What I mean is, does the option need to be enabled for them both for this to work?

Is allowing account linking based purely on if the account's main provider (i.e. the one you signed in first with) allows it, or is it if the current provider you are trying to use allows it?

ex: Initial account is made with GitHub Auth and does not have allowDangerousEmailAccountLinking set to true, but you attempt to sign in with Auth0 Github, and Auth0 does allow the linking between accounts, will the accounts be linked in this case?

Was this something that the team investigated?

[rahulio96]

Hi Guillermo (@GuillermoFloresV),

The allowDangerousEmailAccountLinking option needs to be enabled for both the GitHub auth provider and the OAuth provider for accounts to be successfully linked.

Account linking is based on if the current provider allows it or not.

With the example you gave us (Enable Auth0 linking and Disable GitHub linking), if you sign in with GitHub first (initial account) and then sign in with Auth0 second, it will successfully link since Auth0 Linking is enabled.

• (Auth0 Enabled, Github Disabled) -> GitHub login -> Auth0 login -> Linking Works

However, if we flipped the sign-in options, by logging in with Auth0 first (initial account) and then GitHub, we would receive the original error: "To confirm your identity, sign in with the same account you used originally," meaning that the accounts would be unsuccessful in linking due to GitHub linking being disabled.

• (Auth0 Enabled, Github Disabled) -> Auth0 login -> GitHub login -> Linking Failed

We also tried your example the other way around (Disable Auth0 linking and Enable GitHub linking) and signed in with Auth0 first (initial account) and then signed in with GitHub second, and the accounts were successfully linked as well due to GitHub linking being enabled.

• (Auth0 Disabled, Github Enabled) -> Auth0 login -> GitHub login -> Linking Works

Once again flipping the sign-in options, signing in with GitHub first (initial account) and then Auth0 would produce the original error, meaning that the accounts would be unsuccessful in linking due to Auth0 linking being disabled.

• (Auth0 Disabled, Github Enabled) -> GitHub login -> Auth0 login -> Linking Failed

I hope this answers your questions, if not, please feel free to let us know.

[GuillermoFloresV]

That answers my question, thanks @rahulio96! Great job to the team for investigating so much into this issue!