sir-dunxalot / cypress-nextjs-auth0

Cypress commands to support Auth0 and Next.js
60 stars 24 forks source link

appSession is getting removed by Cypress #23

Closed sternj20 closed 2 years ago

sternj20 commented 3 years ago

Screenshot from 2021-06-21 21-08-58

as you can see in the log, the login is working and correctly setting appSession, but then it removes the cookie for some reason. i believe this is why the test is failing, is anyone else experiencing this issue? i tried it on a brand new app as well to isolate any issues with my app and am still seeing the same behavior.

cpow commented 3 years ago

I am seeing this issue as well

lazlojuly commented 3 years ago

I am getting this also.

brandonmikeska commented 3 years ago

I believe the cookie is there but maybe the cookie requirements changed with Next's latest update? @sir-dunxalot any ideas as this is happening on new nextJS projects?

jondotblack commented 3 years ago

I believe the cookie is there but maybe the cookie requirements changed with Next's latest update? @sir-dunxalot any ideas as this is happening on new nextJS projects?

I was able to fix this by referencing the code from one of the projects listed as using the package.

Adding preserveAuthCookies to the commands file; https://github.com/codelab-ai/codelab.ai/blob/master/apps/web-e2e/src/support/commands.ts#L111

// required to fix appSession null cookie value cypress-nextjs-auth0/encrypt
const preserveAuthCookies = () => {
  Cypress.Cookies.preserveOnce(
    'appSession',
    'appSession.0',
    'appSession.1',
    'appSession.2',
    'appSession.3',
  )
}

Cypress.Commands.add('preserveAuthCookies', preserveAuthCookies)

Updating plugins to have; https://github.com/codelab-ai/codelab.ai/blob/master/apps/web-e2e/src/plugins/index.ts

const encrypt = require('cypress-nextjs-auth0/encrypt')

const pluginConfig = async (on, config) => {
  // required for cypress-nextjs-auth0/encrypt
  on('task', { encrypt })

  // remap some of the .env values, because cypress-nextjs-auth0/encrypt
  // requires them to be with other names
  config.env.auth0Audience = process.env.AUTH0_AUDIENCE
  config.env.auth0Domain = process.env.AUTH0_ISSUER_BASE_URL
  config.env.auth0ClientId = process.env.AUTH0_CLIENT_ID
  config.env.auth0ClientSecret = process.env.AUTH0_CLIENT_SECRET
  config.env.auth0CookieSecret = process.env.AUTH0_SECRET
  config.env.auth0Scope = 'openid profile email'
  config.env.auth0SessionCookieName = 'appSession'
  config.env.auth0Username = process.env.AUTH0_CYPRESS_USERNAME
  config.env.auth0Password = process.env.AUTH0_CYPRESS_PASSWORD

  return config
}

export default pluginConfig

My passing test;

describe('Logging in', () => {
  beforeEach(() => {
    // login
    cy.login();

    // preserve the appSession cookie
    cy.preserveAuthCookies();
  })

  it('should be able to fetch user profile', () => {
    cy.request('/api/auth/me').then(({ body: user }) => {
      expect(user.email).to.equal(Cypress.env('auth0Username'));
    });
  });

  it('can successfully navigate to test page', () => {
    cy.visit('/test')
    cy.get('button').contains('Test')
  });
});