auth0/nextjs-auth0

Users unable to login with Auth0 if MSW is running

Closed this issue ยท 13 comments

Description

Provide a clear and concise description of the issue, including what you expected to happen.

Issue: When MSW is running on next.js, users are unable to login to the application locally.
Expected: When MSW is running on next.js, users should be able to login to the application locally.

Reproduction

  • Setup a next.js auth0 repo
  • Add the setup from the next.js msw repo
  • When a user logs in, they get Cannot read properties of undefined (reading 'content-encoding') shown on the page.
wait  - compiling /api/auth/[...auth0]...
event - compiled client and server successfully in 57 ms (214 modules)
error - unhandledRejection: TypeError: Cannot read properties of undefined (reading 'content-encoding')
HandlerError [RequestError]: Cannot read properties of undefined (reading 'content-encoding')
    at new HandlerError (xxx/app/node_modules/@auth0/nextjs-auth0/dist/utils/errors.js:53:28)
    at Object.<anonymous> (/xxx/app/node_modules/@auth0/nextjs-auth0/dist/handlers/login.js:35:31)
    at step (xxx/app/node_modules/@auth0/nextjs-auth0/node_modules/tslib/tslib.js:143:27)
    at Object.throw (xxx/app/node_modules/@auth0/nextjs-auth0/node_modules/tslib/tslib.js:124:57)
    at rejected (xxx/app/node_modules/@auth0/nextjs-auth0/node_modules/tslib/tslib.js:115:69)
    at processTicksAndRejections (node:internal/process/task_queues:96:5) {
  code: 'ERR_GOT_REQUEST_ERROR'
}
error - unhandledRejection: TypeError: Cannot read properties of undefined (reading 'content-encoding')

The issue is immediately remedied by turning off MSW. Even if MSW doesn't have any handlers, nextjs-auth0 still seems to break.

It looks like it's the callback request(?)
Screenshot 2022-03-02 at 11 51 55

const { setupWorker } = require('msw');
const { setupServer } = require('msw/node');

if (typeof window === 'undefined') {
  const server = setupServer();
  server.listen({ onUnhandledRequest: 'bypass' });
} else {
  const worker = setupWorker();
  worker.start({ onUnhandledRequest: 'bypass' });
}

Environment

Please provide the following:

  • Version of this library used: 1.7.0
  • Version of the platform or framework used, if applicable: next: 12.1.0
  • Other relevant versions (language, server software, OS, browser): Mac OS Chrome Firefox
  • Other modules/plugins/libraries that might be involved: MSW

Hi @ollie-ki - thanks for raising this

The issue looks like it might be related to mswjs/interceptors#212

Can you confirm what version of @mswjs/interceptors and what version of Node you are using?

Hi there!

  • node_modules/@mswjs/interceptors: 0.13.4
  • Node: 16.14.0

Thanks, Ollie

Yep it looks like mswjs/interceptors#212

Can you upgrade @mswjs/interceptors to 0.13.6 and let me know if you still experience the issue?

I've updated everything to 0.13.6 and whilst it's not erroring any more (progress!) requests like logout never resolve, they just infinitely wait :/

I'm not sure how msw works, but I suspect this isn't an issue with the SDK.

If you can debug it some more and find an issue with the SDK I'd be happy to take a look, alternatively if you'd like me to debug it for you - can you share a running example that demonstrates the issue

Closing - happy to reopen if you want to share a running example that demonstrates the issue

I've updated everything to 0.13.6 and whilst it's not erroring any more (progress!) requests like logout never resolve, they just infinitely wait :/

@ollie-ki Same here. Trying to logout hangs.

Tried using latest packages for all dependencies, including updating openid-client to no avail...

Debugging shows the last event to have successfully cloned a request to /.well-known/openid-configuration, but then hangs after the event closes. Any ideas on what could be causing this? Underlying got client?

So after a bit of troubleshooting I isolated the problem to the msw@0.38.0 release.

Downgrading to msw@0.36.8 works.

Can confirm I'm experiencing the same issue with msw@0.39.2 with a brand new NextJS example and the associated Auth0 library.
Related issue here: mswjs/msw#700
Downgrading fixes this issue.

I'm also experiencing a similar issue, It only happens with POST requests with a body done through axios.
downgrading to msw@0.36.8 or performing that request with node-fetch instead of axios solves the issue for me

I've updated everything to 0.13.6 and whilst it's not erroring any more (progress!) requests like logout never resolve, they just infinitely wait :/

@ollie-ki Same here. Trying to logout hangs.

Tried using latest packages for all dependencies, including updating openid-client to no avail...

Debugging shows the last event to have successfully cloned a request to /.well-known/openid-configuration, but then hangs after the event closes. Any ideas on what could be causing this? Underlying got client?

having absolutely same problem, but downgrading MSW is not an option as we need to use latest version to not get other issues with MSW :-(

My context is not nextjs... i am using vite/vue3 project with server side rendering.... and express-openid-connect within my express server.. but the described error is exactly the same.

@kettanaito this prevents me in using MSW. it's impossible.

One thing I always ask people to check is whether they're using the latest msw as updates of pre-1.0 packages may not be apparent to some. Can somebody please verify that this issue is still there with the following dependencies?

  • msw@latest

You should get msw@0.48.3 and @mswjs/interceptors@0.17.5.

@kettanaito i can confirm. i created an issue at msw github and linked a reproduction. using latest msw version 0.48.3

Issue:
mswjs/msw#1468

Reproduction:
https://codesandbox.io/p/github/awacode21/reproduction-vue-ssr-auth0-msw-bug/msw-issue?file=%2Fpackage.json