eliott/worldmonitor
1
0
Fork 0
mirror of https://github.com/koala73/worldmonitor.git synced 2026-04-25 17:14:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(pro): downgrade @clerk/clerk-js to v5 to restore auto-mount UI (#3232)

Browse Source 
The actual root cause behind the "Clerk was not loaded with Ui
components" sign-in failure on /pro is NOT the import path — it's
that pro-test was on @clerk/clerk-js v6.4.0 while the main app
(which works fine) is on v5.125.7.

Clerk v6 fundamentally changed `clerk.load()`: the UI controller
is no longer auto-mounted by default. Both `@clerk/clerk-js` (the
default v6 entry) and `@clerk/clerk-js/no-rhc` (the bundled-UI
variant) expect the caller to either:
  - load Clerk's UI bundle from CDN and pass `window.__internal_ClerkUICtor`
    to `clerk.load({ ui: { ClerkUI } })`, or
  - manually wire up `clerkUICtor`.

That's why my earlier "switch to no-rhc" fix (PR #3227 + #3228)
didn't actually unbreak production — both v6 variants throw the same
assertion. The error stack on the deployed bundle confirmed it:
`assertComponentsReady` from `clerk.no-rhc-UeQvd9Xf.js`.

Fix: pin pro-test to `@clerk/clerk-js@^5.125.7` to match the main
app's working version. v5 still auto-mounts UI on `clerk.load()` —
no extra wiring needed. The plain `import { Clerk } from '@clerk/clerk-js'`
pattern (which the main app uses verbatim and which pro-test had
before #3227) just works under v5.

Verification of the rebuilt bundle (chunk: clerk-PNSFEZs8.js):
  - 3.05 MB (matches main app's clerk-DC7Q2aDh.js: 3.05 MB)
  - 44 occurrences of mountComponent (matches main: 44)
  - 3 occurrences of SignInComponent (matches main: 3)
  - 0 occurrences of "Clerk was not loaded with Ui" (the assertion
    error string is absent; UI is unconditionally mounted)

Includes the rebuilt public/pro/ artifacts so this fix is actually
deployed (PR #3229's CI check will catch any future PR that touches
pro-test/src without rebuilding).
This commit is contained in:
Elie Habib
2026-04-20 15:25:11 +04:00
committed by GitHub
parent 0a4eff0053
commit d7393d8010
9 changed files with 2393 additions and 2004 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3020
pro-test/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
pro-test/package.json
View File

@@ -10,7 +10,7 @@
"lint": "tsc --noEmit"
},
"dependencies": {
"@clerk/clerk-js": "^6.4.0",
"@clerk/clerk-js": "^5.125.7",
"@sentry/react": "^10.47.0",
"@tailwindcss/vite": "^4.1.14",
"@vitejs/plugin-react": "^5.0.4",

2
pro-test/src/services/checkout.ts
View File

@@ -32,7 +32,7 @@ export async function ensureClerk(): Promise<InstanceType<typeof Clerk>> {
}
async function _loadClerk(): Promise<InstanceType<typeof Clerk>> {
const { Clerk: C } = await import('@clerk/clerk-js/no-rhc');
const { Clerk: C } = await import('@clerk/clerk-js');
const key = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY;
if (!key) throw new Error('VITE_CLERK_PUBLISHABLE_KEY not set');
const instance = new C(key);

849
public/pro/assets/clerk-PNSFEZs8.js Normal file
View File

File diff suppressed because one or more lines are too long

22
public/pro/assets/clerk.no-rhc-UeQvd9Xf.js
View File

File diff suppressed because one or more lines are too long

248
public/pro/assets/index-CFLOgmG-.js
View File

File diff suppressed because one or more lines are too long

2
public/pro/assets/index-DKmiaSn4.css → public/pro/assets/index-InU6PrNf.css
View File

File diff suppressed because one or more lines are too long

248
public/pro/assets/index-zHF6-nOX.js Normal file
View File

File diff suppressed because one or more lines are too long

4
public/pro/index.html
View File

@@ -144,8 +144,8 @@
}
</script>
<script src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit" async defer></script>
<script type="module" crossorigin src="/pro/assets/index-CFLOgmG-.js"></script>
<link rel="stylesheet" crossorigin href="/pro/assets/index-DKmiaSn4.css">
<script type="module" crossorigin src="/pro/assets/index-zHF6-nOX.js"></script>
<link rel="stylesheet" crossorigin href="/pro/assets/index-InU6PrNf.css">
</head>
<body>
<div id="root">