Sveltekit (@auth/sveltekit) / Cloudflare Workers

[pragmatic-recursion]

Environment

  System:
    OS: macOS 14.6.1
    CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
    Memory: 29.28 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.2.0 - /usr/local/bin/node
    Yarn: 1.22.15 - /usr/local/bin/yarn
    npm: 10.7.0 - /usr/local/bin/npm
    pnpm: 6.11.0 - /usr/local/bin/pnpm
  Browsers:
    Chrome: 129.0.6668.90
    Safari: 17.6
  npmPackages:
    @auth/sveltekit: ^1.6.0 => 1.6.0

Reproduction URL

https://github.com/pragmatic-recursion/auth-bug

Describe the issue

Running on Cloudflare Workers, not Pages! Works locally.

Server error

There is a problem with the server configuration.

Check the server logs for more information.

{
  "$cloudflare": {
    "truncated": false,
    "event": {
      "request": {
        "url": "https://one.pragmatic-recursion.workers.dev/auth/callback/github?code=62d6a29f6a2e303b9fba",
        "method": "GET",
        "path": "/auth/callback/github"
      }
    },
    "scriptName": "one",
    "eventType": "fetch",
    "scriptVersion": {
      "id": "6c4e96d9-0a8b-4ff0-89e7-a7b056292571"
    },
    "$metadata": {
      "requestId": "8cf4d7f4fde4b36d",
      "id": "01J9NMRD9E8N8G90RMFDYBQF7F",
      "type": "cf-worker",
      "error": "\u001b[31m[auth][cause]\u001b[0m: TypeError: Illegal invocation: function called with incorrect `this` reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.\n    at _worker.js:7568:47\n    at authenticatedRequest (_worker.js:4949:44)",
      "errorPattern": "\u001b[<NUM>m[auth][cause]\u001b[<NUM>m: TypeError: Illegal invocation: function called with incorrect `this` reference. See <URL>#illegal-invocation-errors for details.\n    at <URL>:<NUM>\n    at authenticate",
      "messagePattern": "\u001b[<NUM>m[auth][cause]\u001b[<NUM>m: TypeError: Illegal invocation: function called with incorrect `this` reference. See <URL>#illegal-invocation-errors for details.\n    at <URL>:<NUM>\n    at authenticate"
    }
  },
  "level": "error",
  "message": "\u001b[31m[auth][cause]\u001b[0m: TypeError: Illegal invocation: function called with incorrect `this` reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.\n    at _worker.js:7568:47\n    at authenticatedRequest (_worker.js:4949:44)"
}

How to reproduce

1) Install Svelte https://developers.cloudflare.com/workers/frameworks/framework-guides/svelte/ npm create cloudflare@latest my-svelte-app -- --framework=svelte --experimental

2) Install @auth/sveltekit https://authjs.dev/reference/sveltekit npm install @auth/sveltekit

3) Add GitHub as a Provider

4) Deploy to Cloudflare Worker (Free)

It works locally but not when deployed

Expected behavior

Should be logged in

[jakemoves]

I encountered this as well. Reverting to

"@auth/core": "^0.35.0",
"@auth/sveltekit": "1.5.3",

works as expected. Maybe this is an issue with the new customFetch that @balazsorban44 added recently?

Here's the more-useful trace I get running locally with the newer releases:

TypeError: Illegal invocation: function called with incorrect `this` reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.

      at Object.apply
  (file:///Users/jakemoves/projects/mixtape-project/mixtape/.wrangler/tmp/bundle-YxKLIk/checked-fetch.js:28:18)
      at Object.apply
  (file:///Users/jakemoves/projects/mixtape-project/mixtape/.wrangler/tmp/bundle-ul11C8/checked-fetch.js:28:18)
      at null.<anonymous>
  (file:///Users/jakemoves/projects/mixtape-project/mixtape/node_modules/.pnpm/@auth+core@0.36.0/node_modules/@auth/core/lib/actions/callback/oauth/callback.js:65:52)
      at authenticatedRequest

... and the linked docs from Cloudflare at https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors

[ImAvafe]

@jakemoves You're a life saver. I can finally ship. 🥹

[balazsorban44]

Hmm. Unless you override customFetch, (which you really shouldn't in 99+% of the cases) we fall back to the globally available fetch

https://github.com/nextauthjs/next-auth/blob/57fe1e1e9befab929d4034ba89713d7b364872e3/packages/core/src/lib/utils/custom-fetch.ts#L33

No clue why this would break Cloudflare yet...