<SignUp /> redirects the user to clerk when using <SignIn /> in a different part of the page. #7456
Description
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
https://github.com/ernestoalejo/clerk-signup-reproduction
Publishable key
pk_test_ZmFuY3ktYmFybmFjbGUtOTIuY2xlcmsuYWNjb3VudHMuZGV2JA
Description
I've found a pretty interesting bug to debug.
We noticed it when trying to implement inline <SignIn /> / <SignUp /> tabs in Vue inside our site. When attempting to sign in with an email code, the page unexpectedly redirects to the clerk domain.
We reproduced the issue in React as well, using only the <SignUp /> component for simplicity, but it affects all frameworks and completely prevents implementing inline login or sign up workflows. Once the SignUp component has been loaded at least once, the sign in process becomes broken.
Steps to reproduce:
Easy method:
- Use
<SignUp />anywhere in the page to show an inline form. - Navigating to http://localhost:5173/#/factor-one redirects to the clerk domain.
Realistic method:
- Use both
<SignIn />and<SignUp />in the same page (for example as visual tabs inside a popup). - Try to sign in with an email code.
- The form briefly flashes and sends the code, but then the page unexpectedly redirects to the clerk domain, losing the sign in process.
Debugging a redirect in compiled react code is quite cumbersome but I traced the issue to the useEffect in this component: https://github.com/clerk/javascript/blob/main/packages/ui/src/components/SignUp/index.tsx#L19
Expected behavior:
You should be able to implement an inline UI within a multi-step process without being redirected to the Clerk domain.
Also: signing in with an email code should work even if a sign-up form has been loaded elsewhere on the page.
Actual behavior:
The 6-digit form briefly appears and sends the login code, but then an invisible sign-up form triggers a redirect to the Clerk domain, causing loss of context for both the purchase flow and the login process.
I've used a test key in the reproduction, but this is directly afecting two Pro plan apps.
Environment
System:
OS: Linux 6.6 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
CPU: (12) x64 Intel(R) Core(TM) i5-10400F CPU @ 2.90GHz
Memory: 16.59 GB / 19.53 GB
Container: Yes
Shell: 5.1.16 - /bin/bash
Binaries:
Node: 22.14.0 - /home/ernesto/.nvm/versions/node/v22.14.0/bin/node
npm: 10.9.2 - /home/ernesto/.nvm/versions/node/v22.14.0/bin/npm
pnpm: 10.20.0 - /home/ernesto/.nvm/versions/node/v22.14.0/bin/pnpm
npmPackages:
@clerk/clerk-react: ^5.58.1 => 5.58.1
@eslint/js: ^9.39.1 => 9.39.2
@types/node: ^24.10.1 => 24.10.4
@types/react: ^19.2.5 => 19.2.7
@types/react-dom: ^19.2.3 => 19.2.3
@vitejs/plugin-react: ^5.1.1 => 5.1.2
eslint: ^9.39.1 => 9.39.2
eslint-plugin-react-hooks: ^7.0.1 => 7.0.1
eslint-plugin-react-refresh: ^0.4.24 => 0.4.24
globals: ^16.5.0 => 16.5.0
react: ^19.2.0 => 19.2.3
react-dom: ^19.2.0 => 19.2.3
typescript: ~5.9.3 => 5.9.3
typescript-eslint: ^8.46.4 => 8.49.0
vite: ^7.2.4 => 7.2.7