fix(ui): Ensure hidden passworld field is hidden from a11y tree

[alexcarpenter]

Description

BEFORE	AFTER

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

• 🐛 Bug fix
• 🌟 New feature
• 🔨 Breaking change
• 📖 Refactoring / dependency upgrade / documentation
• other:

Summary by CodeRabbit

Summary by CodeRabbit

• Bug Fixes
  • Improved accessibility for instant password fields by removing hidden password rows from the accessibility tree and preventing focus while the password field is not shown.
  • Added coverage to ensure hidden instant password UI is not accessible and becomes available when revealed.
• Chores
  • Added a patch-level release metadata entry for the accessibility improvement.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	Jun 17, 2026 6:40pm
swingset	Ready	Preview, Comment	Jun 17, 2026 6:40pm

[changeset-bot]

🦋 Changeset detected

Latest commit: 7736ab8

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

This PR includes changesets to release 3 packages

Name	Type
@clerk/ui	Patch
@clerk/chrome-extension	Patch
@clerk/swingset	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

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

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

Review profile: CHILL

Plan: Pro

Run ID: 8e66dbb8-7f52-4f2d-9cb7-f6ad584d754a

📥 Commits

Reviewing files that changed from the base of the PR and between 515b4e0 and 7736ab8.

📒 Files selected for processing (1)

• packages/ui/src/components/SignIn/__tests__/SignInStart.test.tsx

---

📝 Walkthrough

Walkthrough

InstantPasswordRow in SignInStart.tsx now conditionally applies the inert attribute to its Form.ControlRow wrapper when hidden, removing the entire password row (input and toggle UI) from the accessibility tree and blocking focus. A patch changeset entry for @clerk/ui documents this accessibility improvement, and a new test suite validates the visibility and autofill behavior.

Changes

Accessibility fix for hidden password input

Layer / File(s)	Summary
inert attribute on password row packages/ui/src/components/SignIn/SignInStart.tsx, .changeset/cold-dodos-lay.md	Conditional inert attribute is added to the Form.ControlRow wrapper in InstantPasswordRow, making the entire row inert (removed from a11y tree and focus-blocked) when show is false and omitted when show is true. A corresponding @clerk/ui patch changeset documents the change.
Test validation of accessibility hiding packages/ui/src/components/SignIn/__tests__/SignInStart.test.tsx	New test suite Instant password field visibility verifies that the hidden password field carries inert and tabindex="-1" attributes, mocks the autofill detection signal via getComputedStyle, and confirms the field becomes visible (clearing inert) and "Forgot password" text renders when triggered.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• clerk/javascript#8733: Both PRs modify the SignInStart InstantPasswordRow behavior, with this PR adding inert when the password row is hidden and the related PR adding "Forgot password?" action handling when it is shown.

Poem

🐇 A row hides away, from focus and sight,
inert blocks the path, keeps it out of the light,
No keyboard can find it, no screen-reader's call,
When hidden, it's gone from the tree—out of thrall!
A whisker-thin patch with a hop and a bound! 🎉

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'fix(ui): Ensure hidden passworld field is hidden from a11y tree' has a typo ('passworld' instead of 'password') but clearly describes the main change: adding accessibility tree exclusion for hidden password fields.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[github-actions]

API Changes Report

Generated by Break Check on 2026-06-17T18:41:33.671Z

Summary

Metric	Count
Packages analyzed	19
Packages with changes	0
🔴 Breaking changes	0
🟡 Non-breaking changes	0
🟢 Additions	0

No API Changes Detected

All packages have stable APIs with no detected changes.

---

Report generated by Break Check

_{Last ran on 7736ab8.}

[pkg-pr-new]

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 7736ab8