[✨] Please upgrade @auth/core version in qwik-auth about qwik

[wmertens]

Note that as a workaround you can use the overrides or resolutions fields in package.json.

PR welcome to set it to a range that works.

[Nefcanto]

@wmertens, thank you for the suggestions. But I don't understand it. How overrides or resolutions can help when there is a syntactic problem in the qwik-auth for auth/core version 0.29.0?

[wmertens]

@Nefcanto it works when the versions are compatible. If not, PR welcome :)

[Nefcanto]

@wmertens, I still don't understand. There is a syntactic problem in qwik-auth. I wanted to run Qwik several times and I failed. I can't create a PR.

[Nefcanto]

I opened this issue because after upgrading our codebase (which we do weekly), we realized that when we sign in to our development environment, we get 502 pages behind the authentication.

We searched and found https://community.auth0.com/t/502-error-when-hitting-auth-login/72161/10. It seems that they were using an old version.

[wmertens]

@Nefcanto what is the problem in qwik-auth? You don't show the error.

And if you have trouble setting up qwik to create a PR, please do open issues for it, we want it to work easily always.

[wmertens]

@Nefcanto if you just want to use a newer version without any code changes to qwik-auth, you can use the npm overrides

[Nefcanto]

@wmertens, let me test the overrides first, if it doesn't solve the problem I would create an issue. Is this code correct?

"overrides": {
    "@builder.io/qwik": {
        "@auth/core": "0.29.0"
    }
}

[Nefcanto]

@wmertens, the qwik-auth problem was reported by our team #5783

[wmertens]

Is this code correct?

Better to override for all, so that there's for sure only one instance:

"overrides": {
  "@auth/core": "0.29.0"
}

or even

"overrides": {
  "@auth/core": "$@auth/core"
}

so it uses the version you picked

[Nefcanto]

@wmertens, thank you so much. Let me test it. I'll come back with the results.

[Nefcanto]

@wmertens, This is my package.json:

{
    "name": "qwik",
    "engines": {
        "node": ">=15.0.0"
    },
    "private": true,
    "trustedDependencies": [
        "sharp"
    ],
    "type": "module",
    "scripts": {
        "build": "qwik build",
        "build.client": "vite build",
        "build.preview": "vite build --ssr src/entry.preview.tsx",
        "build.server": "vite build -c adapters/express/vite.config.js",
        "build.types": "tsc --incremental --noEmit",
        "deploy": "node server/entry.express",
        "dev": "vite --mode ssr --clearScreen false",
        "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
        "fmt": "prettier --write .",
        "fmt.check": "prettier --check .",
        "lint": "eslint \"src/**/*.ts*\"",
        "preview": "qwik build preview && vite preview",
        "serve": "node server/entry.express",
        "start": "vite --mode ssr",
        "qwik": "qwik"
    },
    "devDependencies": {
        "@builder.io/partytown": "^0.10.1",
        "@builder.io/qwik": "^1.5.2",
        "@builder.io/qwik-auth": "^0.1.3",
        "@builder.io/qwik-city": "^1.5.2",
        "@modular-forms/qwik": "^0.23.1",
        "@tailwindcss/typography": "^0.5.12",
        "@types/compression": "^1.7.5",
        "@types/cors": "^2.8.16",
        "@types/eslint": "^8.56.7",
        "@types/express": "^4.17.21",
        "@types/node": "^20.12.7",
        "@typescript-eslint/eslint-plugin": "^7.6.0",
        "@typescript-eslint/parser": "^7.6.0",
        "acorn": "^8.11.3",
        "acorn-jsx": "^5.3.2",
        "autoprefixer": "^10.4.17",
        "compression": "^1.7.4",
        "cors": "^2.8.5",
        "dotenv": "^16.4.5",
        "escodegen": "^2.1.0",
        "eslint": "^9.0.0",
        "eslint-plugin-qwik": "^1.5.2",
        "estraverse": "^5.3.0",
        "express": "^4.19.2",
        "nightly-esprima": "^2021.8.30",
        "node-fetch": "^3.3.1",
        "postcss": "^8.4.35",
        "prettier": "^3.2.5",
        "tailwindcss": "^3.4.3",
        "typescript": "^5.4.5",
        "undici": "^6.12.0",
        "valibot": "^0.30.0",
        "vite": "^5.2.8",
        "vite-tsconfig-paths": "^4.3.2"
    },
    "dependencies": {
        "axios": "^1.6.5",
        "chart.js": "^4.4.2",
        "glider-js": "^1.7.8",
        "leaflet": "^1.9.4",
        "prismjs": "^1.29.0",
        "swiper": "^11.1.1",
        "tailwind-merge": "^2.2.1"
    },
    "overrides": {
        "@auth/core": "$@auth/core"
    }
}

And now I get these errors:

[vite] Pre-transform error: Failed to load url @auth/core/providers/keycloak (resolved id: @auth/core/providers/keycloak) in /Project/SiteQwik/src/routes/[email protected]. Does the file exist?

[vite] Pre-transform error: Failed to load url @auth/core (resolved id: @auth/core) in /Base/Site/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs. Does the file exist?

And when I went into the node_modules directory, I realized that no @auth/core directory exists there. What can be the problem?

[wmertens]

Looks like the api changed since 0.21, and someone needs to update qwik-auth for it.

BTW, none of your dependencies are actual dependencies that your server needs in production, they should all be devDependencies.

[wmertens]

oh and you don't have @auth/core in your devDependencies, so it's not installed maybe? You need to add it

[Nefcanto]

Looks like the api changed since 0.21, and someone needs to update qwik-auth for it.

BTW, none of your dependencies are actual dependencies that your server needs in production, they should all be devDependencies.

That's why I asked for this upgrade. The API is changed since 0.21.0. But this change might be a simple one.

And about dependencies, we do need to use axios for our client code. Or Chart.js to render charts. I don't understand how you say that they are not used in production.

[Nefcanto]

oh and you don't have @auth/core in your devDependencies, so it's not installed maybe? You need to add it

It was there. I removed it. You guided me to use overrides. Should I add it in two places? Both in overrides and devDependnecies? And should I also consider adding the same version in both places?

[Nefcanto]

This is my new package.json:

{
    "name": "qwik",
    "engines": {
        "node": ">=15.0.0"
    },
    "private": true,
    "trustedDependencies": [
        "sharp"
    ],
    "type": "module",
    "scripts": {
        "build": "qwik build",
        "build.client": "vite build",
        "build.preview": "vite build --ssr src/entry.preview.tsx",
        "build.server": "vite build -c adapters/express/vite.config.js",
        "build.types": "tsc --incremental --noEmit",
        "deploy": "node server/entry.express",
        "dev": "vite --mode ssr --clearScreen false",
        "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
        "fmt": "prettier --write .",
        "fmt.check": "prettier --check .",
        "lint": "eslint \"src/**/*.ts*\"",
        "preview": "qwik build preview && vite preview",
        "serve": "node server/entry.express",
        "start": "vite --mode ssr",
        "qwik": "qwik"
    },
    "devDependencies": {
        "@auth/core": "$@auth/core",
        "@builder.io/partytown": "^0.10.1",
        "@builder.io/qwik": "^1.5.2",
        "@builder.io/qwik-auth": "^0.1.3",
        "@builder.io/qwik-city": "^1.5.2",
        "@modular-forms/qwik": "^0.23.1",
        "@tailwindcss/typography": "^0.5.12",
        "@types/compression": "^1.7.5",
        "@types/cors": "^2.8.16",
        "@types/eslint": "^8.56.7",
        "@types/express": "^4.17.21",
        "@types/node": "^20.12.7",
        "@typescript-eslint/eslint-plugin": "^7.6.0",
        "@typescript-eslint/parser": "^7.6.0",
        "acorn": "^8.11.3",
        "acorn-jsx": "^5.3.2",
        "autoprefixer": "^10.4.17",
        "compression": "^1.7.4",
        "cors": "^2.8.5",
        "dotenv": "^16.4.5",
        "escodegen": "^2.1.0",
        "eslint": "^9.0.0",
        "eslint-plugin-qwik": "^1.5.2",
        "estraverse": "^5.3.0",
        "express": "^4.19.2",
        "nightly-esprima": "^2021.8.30",
        "node-fetch": "^3.3.1",
        "postcss": "^8.4.35",
        "prettier": "^3.2.5",
        "tailwindcss": "^3.4.3",
        "typescript": "^5.4.5",
        "undici": "^6.12.0",
        "valibot": "^0.30.0",
        "vite": "^5.2.8",
        "vite-tsconfig-paths": "^4.3.2"
    },
    "dependencies": {
        "axios": "^1.6.5",
        "chart.js": "^4.4.2",
        "glider-js": "^1.7.8",
        "leaflet": "^1.9.4",
        "prismjs": "^1.29.0",
        "swiper": "^11.1.1",
        "tailwind-merge": "^2.2.1"
    },
    "overrides": {
        "@auth/core": "$@auth/core"
    }
}

And this is the error I get:

[vite] Pre-transform error: Failed to load url @auth/core/providers/keycloak (resolved id: @auth/core/providers/keycloak) in /Project/SiteQwik/src/routes/[email protected]. Does the file exist?
[vite] Pre-transform error: Failed to load url @auth/core (resolved id: @auth/core) in /Base/Site/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs. Does the file exist?

Just the same as before. And this is the result of npm list @auth/core:

root@site:/Project/SiteQwik# npm list @auth/core
npm ERR! code ELSPROBLEMS
npm ERR! invalid: @auth/core@ /Project/SiteQwik/node_modules/@auth/core
qwik@ /Project/SiteQwik
+-- @auth/core@ invalid: "$@auth/core" from the root project overridden
`-- @builder.io/[email protected]
  `-- @auth/core@ deduped invalid: "$@auth/core" from the root project, "$@auth/core" from node_modules/@builder.io/qwik-auth

[JerryWu1234]

Could you offer a minimal reproduction?

[Nefcanto]

@JerryWu1234, with respect, I think there is no need for an MRE. @auth/core has released many versions newer than 0.21.0 and sooner or later qwik-auth should follow. In fact [0.21.0] is released three months ago.

[jasonbing-2023]

Same issue, I can't use any of the email providers (Resend, Sendgrid) to send a magic link email because @auth/core is so far behind the latest.

[wmertens]

PRs welcome! Or vice versa, someone adding qwik support into @auth would be even better.

[Nefcanto]

@wmertens, I wish I could, but I can't. However, in this case I don't think a PR is really required. As far as I remember the API change is very easy and it might only take 10 minutes for one of the members of the Qwik team. I think a better approach could be to give it a try, and if it's time-consuming then waiting for a PR would be a better choice.

[wmertens]

the problem is that I don't use it myself, so it should be done by someone who knows it; also, all contributors are busy on v2 etc.

[JerryWu1234]

the problem is that I don't use it myself, so it should be done by someone who knows it; also, all contributors are busy on v2 etc.

@wmertens
I can do it today if I upgrade @auth/core, but I'm not sure how to validate whether it'll work.

[wmertens]

@JerryWu1234 cool!

@Nefcanto any pointers for Jerry?

[Nefcanto]

@JerryWu1234, thank you. Two points:

• It should compile after upgrading the version
• A basic app with signing capability should work (Google OCID can be a good criterion for testing)

[Nefcanto]

@PatrickJS, not solved yet. I updated the @auth/core from 0.21.0 to 0.31.0 and this is the error I get:

Container  | [auth][error] UnknownAction: Cannot parse action at /api/auth/session. Read more at https://errors.authjs.dev#unknownaction
Container  |     at parseActionAndProviderId (file:///npm/node_modules/@auth/core/lib/utils/web.js:92:15)
Container  |     at toInternalRequest (file:///npm/node_modules/@auth/core/lib/utils/web.js:24:40)
Container  |     at Module.Auth (file:///npm/node_modules/@auth/core/index.js:67:35)
Container  |     at getSessionData (/npm/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs:305:50)
Container  |     at onRequest (/npm/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs:244:50)
Container  |     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Container  |     at async Object.next (file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:25232:9)
Container  |     at async runNext (file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:25488:5)
Container  |     at async file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:26060:26
Container  | 5:09:46 AM [vite] Internal server error: 
Container  |       at getSessionData (/npm/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs:320:9)
Container  |       at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Container  |       at async onRequest (/npm/node_modules/@builder.io/qwik-auth/lib/index.qwik.mjs:241:34)
Container  |       at async Object.next (file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:25232:9)
Container  |       at async runNext (file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:25488:5)
Container  |       at async file:///npm/node_modules/@builder.io/qwik-city/vite/index.mjs:26060:26