fix(clerk-js): Display legal consent only based on missing fields #7101

LauraBeatris · 2025-10-30T15:42:44Z

Description

We caught a bug on IdP-Initiated flows, with legal consent enabled, where FAPI would redirect to /sign-up but the form still gets shown with password even tho it's not required for enterprise SSO

For those cases, since legal consent is the only missing field and there aren't unverified fields, it should be the only one displayed.

Checklist

pnpm test runs as expected.
pnpm build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

Summary by CodeRabbit

Bug Fixes
- Sign-up flow now correctly displays legal consent only when it's the sole missing required item and no unverified fields exist.
Tests
- Added/updated tests to ensure legal consent is shown only in the intended sign-up scenarios.

changeset-bot · 2025-10-30T15:42:48Z

🦋 Changeset detected

Latest commit: 65d5ddc

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

This PR includes changesets to release 3 packages

Name	Type
@clerk/clerk-js	Patch
@clerk/chrome-extension	Patch
@clerk/clerk-expo	Patch

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 · 2025-10-30T15:42:51Z

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

Project	Deployment	Preview	Comments	Updated (UTC)
clerk-js-sandbox	Ready	Preview	Comment	Oct 30, 2025 3:51pm

coderabbitai · 2025-10-30T15:43:11Z

Walkthrough

Detects when only the legal_accepted field is missing during sign-up by computing a memoized onlyLegalAcceptedMissing flag in SignUpStart and passing it to SignUpForm; fixture data and tests updated to reflect the case with no unverified fields.

Changes

Cohort / File(s)	Summary
Sign-up form detection logic `packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx`	Added `useMemo` to compute `onlyLegalAcceptedMissing` (true when missing fields === ['legal_accepted'] and `unverified_fields` is empty). Passes `onlyLegalAcceptedMissing` as a new prop to `SignUpForm`; updated `SignUpForm` prop signature to include `onlyLegalAcceptedMissing?: boolean`.
Fixture data `packages/clerk-js/src/test/fixture-helpers.ts`	Added `unverified_fields: []` to the `startSignUpWithMissingLegalAccepted` SignUpJSON fixture so the empty-unverified-fields case is explicit.
Test coverage `packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpStart.test.tsx`	Added a test verifying legal consent text is shown only when missing fields include email/password and there are no unverified fields; ensures phone/password fields are not displayed in that scenario.
Changeset `.changeset/silly-zoos-decide.md`	Added changeset entry describing the fix for rendering legal consent only when required and with no unverified fields.

Sequence Diagram(s)

sequenceDiagram
    participant Start as SignUpStart
    participant Form as SignUpForm
    participant Fixture as Fixture/Test

    rect #E6F7FF
      Note right of Start: Compute props from session state
      Start->>Start: compute onlyLegalAcceptedMissing = useMemo(...)
    end

    Start->>Form: render SignUpForm(props..., onlyLegalAcceptedMissing)
    Form->>Form: conditional render (uses onlyLegalAcceptedMissing)
    Note right of Form: shows legal consent only when appropriate

    Fixture->>Start: supplies fixture (missing fields, unverified_fields)
    Fixture->>Form: asserts rendered output in tests

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Check the useMemo dependency array to ensure re-computation on relevant state changes (missing fields, unverified fields).
Verify the updated SignUpForm prop is typed and documented consistently where the component is exported/used.
Confirm the fixture accurately models the case and the new test assertion covers the intended UI behavior.

Poem

A rabbit peeks at signup trees,
Counts missing leaves and gentle breeze,
Memoized hops to find the clue,
"Only legal accepted? I knew!" 🐇✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run `@coderabbitai generate docstrings` to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The title "Display legal consent only based on missing fields" directly relates to the main changes in the pull request. The changeset and code modifications all focus on ensuring that legal consent is rendered based on specific conditions around missing fields. The title accurately captures the core intent of the fix—controlling when the legal consent UI is displayed—which aligns with the fixture updates, the new memoized onlyLegalAcceptedMissing logic, and the test case added to verify this behavior. While the title could be slightly more explicit about the "no unverified fields" condition, it effectively communicates the primary change in a concise manner that a teammate scanning the PR history would understand.

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch laura/fix-sign-up-with-legal-missing-only

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between fd2a119 and 65d5ddc.

📒 Files selected for processing (1)

.changeset/silly-zoos-decide.md (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

.changeset/**

📄 CodeRabbit inference engine (.cursor/rules/monorepo.mdc)

Automated releases must use Changesets.

Files:

.changeset/silly-zoos-decide.md

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

GitHub Check: Analyze (javascript-typescript)
GitHub Check: semgrep-cloud-platform/scan
GitHub Check: semgrep-cloud-platform/scan

🔇 Additional comments (1)

.changeset/silly-zoos-decide.md (1)

1-5: ✅ Changeset format is correct and properly structured.

The changeset follows the Changesets convention with correct frontmatter (package name and patch version bump type) and a clear, concise description that aligns with the PR objectives. The patch version bump is appropriate for this bug fix.

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

LauraBeatris · 2025-10-30T15:45:32Z

packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx

+  const onlyLegalAcceptedMissing = useMemo(
+    () =>
+      signUp.missingFields &&
+      signUp.missingFields.length === 1 &&
+      signUp.missingFields[0] === 'legal_accepted' &&
+      signUp.unverifiedFields &&
+      signUp.unverifiedFields.length === 0,
+    [signUp.missingFields, signUp.unverifiedFields],
+  );


This is already being done on SignUpContinue, but wasn't handled on the root sign-up

I thought of moving this check within SignUpForm so we don't repeat the same logic in both pages, however it seems that there was a reason why signUp isn't passed as a prop to it

My assumption is that SignUpForm is for form presentation concerns only and each screen would handle the logic around the sign up object

pkg-pr-new · 2025-10-30T15:56:24Z

Open in StackBlitz

@clerk/agent-toolkit

npm i https://pkg.pr.new/@clerk/agent-toolkit@7101

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/dev-cli

npm i https://pkg.pr.new/@clerk/dev-cli@7101

@clerk/elements

npm i https://pkg.pr.new/@clerk/elements@7101

@clerk/clerk-expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/clerk-react

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

@clerk/react-router

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

@clerk/remix

npm i https://pkg.pr.new/@clerk/remix@7101

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/themes

npm i https://pkg.pr.new/@clerk/themes@7101

@clerk/types

npm i https://pkg.pr.new/@clerk/types@7101

@clerk/upgrade

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

@clerk/vue

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

commit: 65d5ddc

Display legal field only based on missing fields

fd2a119

LauraBeatris self-assigned this Oct 30, 2025

clerk-cookie added the clerk-js label Oct 30, 2025

vercel bot deployed to Preview October 30, 2025 15:43 View deployment

LauraBeatris commented Oct 30, 2025

View reviewed changes

LauraBeatris marked this pull request as ready for review October 30, 2025 15:47

LauraBeatris requested review from a team and NicolasLopes7 October 30, 2025 15:47

Add changeset

65d5ddc

vercel bot deployed to Preview October 30, 2025 15:51 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(clerk-js): Display legal consent only based on missing fields #7101

fix(clerk-js): Display legal consent only based on missing fields #7101

LauraBeatris commented Oct 30, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

changeset-bot bot commented Oct 30, 2025 •

edited

Loading

Uh oh!

vercel bot commented Oct 30, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Oct 30, 2025 •

edited

Loading

Uh oh!

LauraBeatris Oct 30, 2025

Uh oh!

LauraBeatris Oct 30, 2025

Uh oh!

pkg-pr-new bot commented Oct 30, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

fix(clerk-js): Display legal consent only based on missing fields #7101

Are you sure you want to change the base?

fix(clerk-js): Display legal consent only based on missing fields #7101

Conversation

LauraBeatris commented Oct 30, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Checklist

Type of change

Summary by CodeRabbit

Uh oh!

changeset-bot bot commented Oct 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

vercel bot commented Oct 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Oct 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Poem

Pre-merge checks and finishing touches

Uh oh!

LauraBeatris Oct 30, 2025

Choose a reason for hiding this comment

Uh oh!

LauraBeatris Oct 30, 2025

Choose a reason for hiding this comment

Uh oh!

pkg-pr-new bot commented Oct 30, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

LauraBeatris commented Oct 30, 2025 •

edited by coderabbitai bot

Loading

changeset-bot bot commented Oct 30, 2025 •

edited

Loading

vercel bot commented Oct 30, 2025 •

edited

Loading

coderabbitai bot commented Oct 30, 2025 •

edited

Loading