MSW not correctly bypassing requests made with @auth0/nextjs-auth0

Describe the bug

I am trying to use MSW to mock some requests made in a nextjs application that is using @auth0/nextjs-auth0 to handle the authentication flow.

I want MSW to bypass the requests made as part of that authentication flow, however instead I am getting the following error when trying to login (through http://localhost:3000/api/auth/login):

[MSW] Warning: captured a request without a matching request handler:

  • GET https://abcga.eu.auth0.com/.well-known/oauth-authorization-server

If you still wish to intercept this unhandled request, please create a request handler for it.
Read more: https://mswjs.io/docs/getting-started/mocks
RequestError: connect ECONNREFUSED 127.0.0.1:443
    at ClientRequestOverride.<anonymous> (/Users/steve.pewsey/Documents/Personal/Projects/abcga-ui/node_modules/got/dist/source/core/index.js:956:111)
    at Object.onceWrapper (events.js:422:26)
    at ClientRequestOverride.emit (events.js:327:22)
    at ClientRequestOverride.origin.emit (/Users/steve.pewsey/Documents/Personal/Projects/abcga-ui/node_modules/@szmarczak/http-timer/dist/source/index.js:39:20)
    at ClientRequest.<anonymous> (/Users/steve.pewsey/Documents/Personal/Projects/abcga-ui/node_modules/@mswjs/interceptors/lib/interceptors/ClientRequest/createClientRequestOverride.js:317:39)
    at ClientRequest.emit (events.js:315:20)
    at TLSSocket.socketErrorListener (_http_client.js:469:9)
    at TLSSocket.emit (events.js:315:20)
    at emitErrorNT (internal/streams/destroy.js:106:8)
    at emitErrorCloseNT (internal/streams/destroy.js:74:3)
    at processTicksAndRejections (internal/process/task_queues.js:80:21)
    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1146:16) {
  code: 'ECONNREFUSED',
  timings: {
    start: 1618657265514,
    socket: 1618657265514,
    lookup: 1618657265514,
    connect: 1618657265514,
    secureConnect: undefined,
    upload: undefined,
    response: undefined,
    end: undefined,
    error: 1618657265525,
    abort: undefined,
    phases: {
      wait: 0,
      dns: 0,
      tcp: 0,
      tls: undefined,
      request: undefined,
      firstByte: undefined,
      download: undefined,
      total: 11
    }
  }
}

It seems that for some reason it is trying to make a request to https://localhost. I am not sure why this is happening, when MSW is disabled everything works as expected, so I can only assume that MSW is at fault.

Environment

• msw: 0.28.1
• nodejs: 14.16.1
• npm: 6.14.12

To Reproduce

Steps to reproduce the behavior:

1. Clone MSW NextJS example
2. Combine this with the Auth0 NextJs basic setup
3. Start dev server
4. Go to http://localhost:3000/api/auth/login
5. See error (for some reason at times this error can be a bit non-deterministic and I can process to auth0, but when it redirects me back to my application I get the same error).

Expected behavior

Be redirected to auth0 to login, and then be redirected back to the application.

Thanks! Happy to provide more details if required.

[kettanaito]

Thanks for a reproduction case, @Nargonath. I’m quite overwhelmed with work right now so I don’t think I’ll have time to look into this any time soon. Contributors are welcome ❤️

Meanwhile, feel free to revert to the latest version that’s proven working with your setup.

[kettanaito]

I can confirm that integrating the fix above fixes the issue and the auth0 flow functions as expected. Will provision the fix and the related tests and update the libraries.