feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

feat(ui): add a "Back" action to the sign-in second factor step - #9190

Merged
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step
Aug 14, 2026
Merged

feat(ui): add a "Back" action to the sign-in second factor step#9190
alexcarpenter merged 12 commits into
mainfrom
back-button-2fa-step

Conversation

@alexcarpenter

@alexcarpenteralexcarpenter commented Jul 17, 2026

Copy link
Copy Markdown
Member

Description

Customer feedback:

It'd be great to have a logout button here. I picked the wrong google account on accident and now there's no way for me to go back and sign in.

A user who authenticates on the sign-in two-step verification (second factor) screen with the wrong account — most commonly after signing in with the wrong social/OAuth account — is stuck. The only actions on that screen are Continue (needs a code they can't produce) and Use another method (which just cycles between other 2FA methods, keeping them inside the same locked attempt). Unlike the first-factor screen, there is no way to change who you're signing in as.

This adds a "Back" action to the second-factor step. It abandons the current sign-in attempt and returns the user to the sign-in start, where they can re-authenticate with the correct account.

Screenshot 2026-08-07 at 1 55 54 PM

Checklist

  • Changeset added
  • e2e test added

@changeset-bot

changeset-botBot commented Jul 17, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 4741af3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 17, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreviewAug 12, 2026 3:37pm
swingsetReadyReadyPreviewAug 12, 2026 3:37pm

Request Review

@coderabbitai

coderabbitaiBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The sign-in second-factor screen now displays a localized “Sign in as a different account” action. Activating it navigates back to the sign-in start, with integration coverage for the SMS MFA flow.

Changes

Different Account Sign-In

Layer / File(s)Summary
Localization and release contract
.changeset/sign-in-different-account.md, packages/localizations/src/en-US.ts, packages/shared/src/types/localization.ts
Adds the localized action text, its localization type entry, and patch release instructions for the affected packages.
Verification card navigation action
packages/ui/src/elements/VerificationCodeCard.tsx, packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
Adds an optional callback and conditional footer link, then connects the link to navigation back to the sign-in start.
MFA flow validation
integration/tests/session-tasks-setup-mfa.test.ts
Tests abandoning an SMS MFA attempt and returning to the identifier input.

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
participant User
participant VerificationCodeCard
participant SignInFactorTwoCodeForm
participant Router
User->>VerificationCodeCard: Click different account action
VerificationCodeCard->>SignInFactorTwoCodeForm: Invoke callback
SignInFactorTwoCodeForm->>Router: navigate('../')
Router-->>User: Show sign-in start
Loading

Poem

A bunny taps the footer bright,
And hops from second-factor night.
One click, the old attempt is gone,
Back to where a new sign-in dawns.
Localization twinkles too—
Tests hop along to prove it true.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
Title check✅ PassedThe title describes the new navigation action on the sign-in second-factor step, although it uses “Back” instead of the user-facing label.
Description check✅ PassedThe description accurately explains the second-factor escape action, its purpose, affected flow, and test coverage.

Comment @coderabbitai help to get the list of available commands.

@macroscopeapp

macroscopeappBot commented Jul 17, 2026

Copy link
Copy Markdown

Approvability

Verdict: Approved

This PR adds a simple navigation link to the 2FA screen allowing users to go back and sign in with a different account. The implementation is minimal (navigate('../')), well-tested, and doesn't modify any authentication logic. The unresolved review comments are minor test quality suggestions, not substantive issues.

You can customize Macroscope's approvability policy. Learn more.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx`:
- Around line 112-126: Restore the existing edit-icon test for SignUpVerifyEmail
while retaining the new back-button navigation test. Ensure both tests verify
their respective controls invoke the expected navigation behavior, using the
existing SignUpVerifyEmail fixture and render setup.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 05844200-3625-445a-b6d9-54a11600e470

📥 Commits

Reviewing files that changed from the base of the PR and between 89916b0 and 842edc4.

📒 Files selected for processing (5)
  • .changeset/two-step-back-button.md
  • packages/ui/src/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/ui/src/components/SignIn/__tests__/SignInFactorTwo.test.tsx
  • packages/ui/src/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx

Comment threadpackages/ui/src/components/SignUp/__tests__/SignUpVerifyEmail.test.tsx Outdated
@pkg-pr-new

pkg-pr-newBot commented Jul 17, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9190

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9190

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9190

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9190

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9190

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9190

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9190

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9190

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9190

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9190

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9190

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9190

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9190

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9190

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9190

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9190

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9190

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9190

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9190

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9190

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9190

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9190

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9190

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9190

commit: 4741af3

@github-actions

github-actionsBot commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-08-12T15:38:06.917Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 4741af3.

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@integration/tests/session-tasks-setup-mfa.test.ts`:
- Around line 211-254: Wrap the setup and sign-in flow after createBapiUser in a
try/finally block, keeping user.deleteIfExists() in the finally clause so
cleanup runs on both success and failure. Apply this to the test flow using
createTestUtils and createBapiUser, matching the cleanup pattern used by the
email-code test.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: c32bf548-d19a-4c21-b3dd-c19e90223e9c

📥 Commits

Reviewing files that changed from the base of the PR and between 842edc4 and 3d6aa39.

📒 Files selected for processing (4)
  • .changeset/testing-back-link-po.md
  • integration/tests/email-code.test.ts
  • integration/tests/session-tasks-setup-mfa.test.ts
  • packages/testing/src/playwright/unstable/page-objects/common.ts

Comment threadintegration/tests/session-tasks-setup-mfa.test.ts
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 14:07

Dismissing prior approval to re-evaluate 38b7883

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:35

Dismissing prior approval to re-evaluate 2c84e49

@alexcarpenteralexcarpenter changed the title feat(ui): add back button to sign-in and sign-up verification stepsfeat(ui): add "Sign in as a different account" action to sign-in second factorJul 17, 2026
macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
…nd factor
Adds a footer action on the sign-in two-step verification (second factor)
step that abandons the current sign-in attempt and returns to the sign-in
start, so a user who reached 2FA with the wrong account (e.g. wrong social
account) can sign in again instead of being stuck.
@macroscopeapp
macroscopeappBot dismissed their stale reviewJuly 17, 2026 15:36

Dismissing prior approval to re-evaluate b90ea15

macroscopeapp[bot]
macroscopeappBot previously approved these changes Jul 17, 2026
The new test called createFakeUser without the PlaywrightTest argument, so
createFakeUser received the options object as `test` and threw
"test.info is not a function" on every attempt.
Also raise the ui-common bundlewatch budget to 133KB to fit the new Back
action.
@alexcarpenter
alexcarpenter merged commit 4b2b688 into mainAug 14, 2026
84 of 85 checks passed
@alexcarpenter
alexcarpenter deleted the back-button-2fa-step branch August 14, 2026 14:02
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@alexcarpenter@wobsoriano