Routing failed. TypeError: Cannot read properties of undefined (reading 'pagePath'
Opened this issue · 12 comments
Preliminary Checks
-
I have reviewed the documentation: https://clerk.com/docs
-
I have searched for existing issues: https://github.com/clerk/javascript/issues
-
I have not already reached out to Clerk support via email or Discord (if you have, no need to open an issue here)
-
This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.
Reproduction
don't have a reproduction
Publishable key
pk_live_Y2xlcmsud2l0aHRlcm1pbmFsLmNvbSQ
Description
Steps to reproduce:
- Setup NextJS & Clerk, similar to https://clerk.com/docs/quickstarts/nextjs
- Deploy to a hosted environment. (In my case, AWS, Lambda, and SST)
- Log in
- Log out
Expected behavior:
You see your login page
Actual behavior:
Routing failed. TypeError: Cannot read properties of undefined (reading 'pagePath') at du (file:///var/task/packages/dashboard/middleware.mjs:56:3273) at uu (file:///var/task/packages/dashboard/middleware.mjs:56:3128) at cu (file:///var/task/packages/dashboard/middleware.mjs:56:3063) at file:///var/task/packages/dashboard/middleware.mjs:56:2570 at Object.protect (file:///var/task/packages/dashboard/middleware.mjs:56:6831) at pu.afterSignInUrl (file:///var/task/packages/dashboard/middleware.mjs:56:7570) at file:///var/task/packages/dashboard/middleware.mjs:56:4648 at AsyncLocalStorage.run (node:async_hooks:338:14) at Object.g (file:///var/task/packages/dashboard/middleware.mjs:56:4630) at async file:///var/task/packages/dashboard/middleware.mjs:23:9303
The above error is thrown by the Clerk SDK, triggering the project's Error Boundary.
My middleware file is quite simple.
export default clerkMiddleware((auth, request) => {
if (isProtectedRoute(request)) {
auth().protect();
}
return NextResponse.next();
});Environment
System:
OS: macOS 14.5
CPU: (8) arm64 Apple M3
Memory: 77.17 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.11.0 - ~/Library/Caches/fnm_multishells/9874_1721250512495/bin/node
npm: 10.2.4 - ~/Library/Caches/fnm_multishells/9874_1721250512495/bin/npm
pnpm: 9.4.0 - ~/Library/Caches/fnm_multishells/9874_1721250512495/bin/pnpm
bun: 1.1.16 - ~/.bun/bin/bun
Browsers:
Chrome: 126.0.6478.183
Safari: 17.5
npmPackages:
@clerk/nextjs: ^5.0.12 => 5.2.3
@heroicons/react: ^2.1.1 => 2.1.5
@hookform/resolvers: ^3.4.2 => 3.9.0
@knocklabs/client: 0.10.11 => 0.10.11
@knocklabs/react: 0.2.25 => 0.2.25
@radix-ui/react-accordion: ^1.1.2 => 1.2.0
@radix-ui/react-alert-dialog: ^1.0.5 => 1.1.1
@radix-ui/react-aspect-ratio: ^1.0.3 => 1.1.0
@radix-ui/react-avatar: ^1.0.4 => 1.1.0
@radix-ui/react-checkbox: ^1.1.1 => 1.1.1
@radix-ui/react-collapsible: ^1.0.3 => 1.1.0
@radix-ui/react-context-menu: ^2.1.5 => 2.2.1
@radix-ui/react-dialog: ^1.0.5 => 1.1.1
@radix-ui/react-dropdown-menu: ^2.0.6 => 2.1.1
@radix-ui/react-hover-card: ^1.0.7 => 1.1.1
@radix-ui/react-label: ^2.0.2 => 2.1.0
@radix-ui/react-menubar: ^1.0.4 => 1.1.1
@radix-ui/react-navigation-menu: ^1.1.4 => 1.2.0
@radix-ui/react-popover: ^1.0.7 => 1.1.1
@radix-ui/react-progress: ^1.0.3 => 1.1.0
@radix-ui/react-radio-group: ^1.1.3 => 1.2.0
@radix-ui/react-scroll-area: ^1.0.5 => 1.1.0
@radix-ui/react-select: ^2.0.0 => 2.1.1
@radix-ui/react-separator: ^1.0.3 => 1.1.0
@radix-ui/react-slider: ^1.1.2 => 1.2.0
@radix-ui/react-slot: ^1.0.2 => 1.1.0
@radix-ui/react-switch: ^1.0.3 => 1.1.0
@radix-ui/react-tabs: ^1.1.0 => 1.1.0
@radix-ui/react-toast: ^1.1.5 => 1.2.1
@radix-ui/react-toggle: ^1.0.3 => 1.1.0
@radix-ui/react-toggle-group: ^1.0.4 => 1.1.0
@radix-ui/react-tooltip: ^1.0.7 => 1.1.2
@sentry/nextjs: ^7.114.0 => 7.118.0
@spotlightjs/spotlight: ^2.0.0 => 2.0.0
@tanstack/react-query: ^5.40.0 => 5.51.1
@tanstack/react-table: 8.19.2 => 8.19.2
@terminal/cdn: workspace:* => 0.0.0
@terminal/config: workspace:* => 0.0.0
@terminal/core: workspace:* => 0.0.0
@terminal/generated: workspace:* => 0.0.0
@terminal/schemas: workspace:* => 0.0.0
@terminal/sdk: workspace:* => 0.0.0
@terminal/spotlight-logger: workspace:* => 0.0.1
@types/node: ^20 => 20.14.11
@types/papaparse: ^5.3.14 => 5.3.14
@types/react: ^18.3.3 => 18.3.3
@types/react-dom: ^18.3.0 => 18.3.0
autoprefixer: ^10.0.1 => 10.4.19
axios: ^1.6.7 => 1.7.2
class-variance-authority: ^0.7.0 => 0.7.0
clsx: ^2.0.0 => 2.1.1
cmdk: ^1.0.0 => 1.0.0
date-fns: ^3.0.0 => 3.6.0
embla-carousel-react: 8.1.6 => 8.1.6
eslint: ^8 => 8.57.0
eslint-config-next: 14.2.5 => 14.2.5
google-maps-react-markers: ^2.0.10 => 2.0.10
jotai: ^2.6.4 => 2.9.0
lucide-react: ^0.407.0 => 0.407.0
next: 14.2.5 => 14.2.5
next-themes: ^0.3.0 => 0.3.0
nuqs: ^1.17.4 => 1.17.4
papaparse: ^5.4.1 => 5.4.1
postcss: ^8 => 8.4.39
posthog-js: ^1.131.3 => 1.146.1
react: ^18.3.1 => 18.3.1
react-day-picker: ^8.10.0 => 8.10.1
react-dom: ^18.3.1 => 18.3.1
react-error-boundary: ^4.0.12 => 4.0.13
react-hook-form: ^7.51.5 => 7.52.1
react-resizable-panels: ^2.0.5 => 2.0.20
sonner: ^1.4.41 => 1.5.0
svix-react: ^1.11.0 => 1.11.0
tailwind-merge: ^2.2.1 => 2.4.0
tailwindcss: ^3.3.0 => 3.4.4
tailwindcss-animate: ^1.0.7 => 1.0.7
typescript: ^5.5.2 => 5.5.3
vaul: ^0.9.0 => 0.9.1
zod: ^3.23.8 => 3.23.8Hi!
Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.
If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.
Thanks for using Clerk!
Hello 👋
In an effort to keep our GitHub issues clean and focused, we close any issues that are awaiting a reproduction after 8 days on inactivity, and it has been 7 days. This issue will be closed tomorrow unless a reproduction is provided. If it takes longer than this to get a reproduction, that's ok, just drop a comment and we will remove the Stale label.
How to create a minimal reproduction
Thanks for being a part of the Clerk community! 🙏
I have this exact same setup and am running into this issue when I try to log in with a domain that hasn't been whitelisted. It also causes a Lambda timeout which breaks my application. I have to go to a different browser and sign in, and then sign out to create a temporary fix.
For context I'm authenticating like this:
await signIn.authenticateWithRedirect({
strategy: "oauth_google",
redirectUrl: "/sso-callback",
redirectUrlComplete: "/manage-inspections",
})
FYI #3773 did not resolve the issue, I was hoping it would as some of the error message stack is the same.
Error: Clerk: auth() was called but Clerk can't detect usage of clerkMiddleware() (or the deprecated authMiddleware()). Please ensure the following: - clerkMiddleware() (or the deprecated authMiddleware()) is used in your Next.js Middleware. - Your Middleware matcher is configured to match this route or page. - If you are using the src directory, make sure the Middleware file is inside of it. For more details, see https://clerk.com/docs/quickstarts/nextjs at /var/task/packages/dashboard/.next/server/chunks/91.js:76:33305 at /var/task/packages/dashboard/.next/server/chunks/91.js:100:5877 at v (/var/task/packages/dashboard/.next/server/chunks/91.js:76:33871) at eI (/var/task/packages/dashboard/.next/server/chunks/611.js:25:37770) at Object.c [as getAlternativeEnvironmentStates] (/var/task/packages/dashboard/.next/server/chunks/51.js:1:17150) at c (/var/task/packages/dashboard/.next/server/chunks/51.js:1:18807) at eh (/var/task/node_modules/.pnpm/next@14.2.5_@opentelemetry+api@1.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:134786) at e (/var/task/node_modules/.pnpm/next@14.2.5_@opentelemetry+api@1.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:137671) at ek (/var/task/node_modules/.pnpm/next@14.2.5_@opentelemetry+api@1.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:138145) at Object.toJSON (/var/task/node_modules/.pnpm/next@14.2.5_@opentelemetry+api@1.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:135755)
@MisterJimson @thadhutch Would you mind checking if this snapshot fixes your issue ?
npm i @clerk/nextjs@5.3.1-snapshot.v5a90f37 --save-exact@panteliselef that build does seem to fix the error, thank you.
As a side note, where I used to see this error, I now see a 404 due to #3864
Great, this will be shipped in the next minor/patch release.
About the 404, we will investigate. Please provide us with any additional info, that you think will help us reproduce, in #3864
Figured I'd circle back on this since it's still ongoing. For me, the issue was actually caused by how I configured my VPC. It was actually unrelated to Clerk, but I didn't reproduce once I fixed my configuration. I ended up just implementing auth with an open source library.
This issue started happening again when I updated from the snapshot build to try to get the benefit of #3864 being solved.
On "@clerk/nextjs": "5.4.0"
the issue was actually caused by how I configured my VPC.
Can you elaborate?
the issue was actually caused by how I configured my VPC.
Can you elaborate?
Yea, I had my vpc setup incorrectly so any external request outside the vpc on my application was timing out. This just happened to be the first 3rd party API I integrated.