SelectPanel: Announce filter input name on initial focus

[liuliu-dev]

Related issue https://github.com/github/accessibility-audits/issues/16971

When a searchable SelectPanel opens, focus moves to the filter input while the first option becomes the active descendant. The existing announcement described the active option but did not include the filter input's accessible name.

This change:

• Includes the filter input's accessible name in the initial announcement.
• Resolves aria-labelledby before aria-label to match accessible-name precedence.
• Prevents semantically unchanged items created while opening the panel from being announced as a list update.
• Keeps subsequent filtering announcements concise.
• Preserves the initial active descendant and Enter-to-select behavior.
• Adds a Storybook regression scenario and focused announcement tests.

The resulting initial announcement is:

Filter fields, filter text box and list of items, Focused item: Start date, not selected, 1 of 3

After filtering, updates remain:

List updated, Focused item: Priority, not selected, 1 of 1

Changelog

New

• Added regression coverage for filter input announcements, including aria-labelledby, late-mounted list references, and missing input labels.
• Added a SelectPanel Storybook regression scenario.

Changed

• SelectPanel now announces the filter input's accessible name when focus enters a searchable panel.

Removed

• None.

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

[changeset-bot]

🦋 Changeset detected

Latest commit: a506731

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

This PR includes changesets to release 1 package

Name	Type
@primer/react	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

[github-actions]

⚠️ Action required

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Check the integration testing docs for step-by-step instructions. Or, apply the integration-tests: skipped manually label to skip these checks.

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.

[Copilot]

Copilot review overview

🟡 Changes recommended

Unresolved moderate findings remain around asynchronous announcements, accessible-name resolution, native-label support, and render-time snapshot cost; duplicate-announcement coverage is also requested.

Get a fresh assessment by requesting another Copilot review.

Review tier: Lite
Findings: 1 · 1

Open (2)

• Include native labels in the announced input name · New
• Cover suppression of opening-time list updates · New

What changed in this PR

Updates SelectPanel accessibility announcements to include the filter input’s accessible name and reduce redundant list updates.

Changes:

• Adds accessible-name resolution and announcement state tracking.
• Integrates stable list references and filter state.
• Adds tests, a Storybook regression scenario, and a patch changeset.

File	Summary
script/​check-classname-tests.mjs	Excludes the hook test from classname checks. No direct findings.
packages/​react/​src/​SelectPanel/​SelectPanel.test.tsx	Updates announcement expectations.
packages/​react/​src/​SelectPanel/​SelectPanel.dev.stories.tsx	Adds a SelectPanel accessibility regression scenario.
packages/​react/​src/​FilteredActionList/​useAnnouncements.tsx	Findings: asynchronous filtering can announce stale results (moderate, 1 vote); referenced labels may not use accessible-name semantics (moderate, 1 vote); duplicate suppression lacks regression coverage (nit, 2 votes); native associated labels are unsupported (moderate, 2 votes); snapshots add O(n) work during renders (moderate, 1 vote).
packages/​react/​src/​FilteredActionList/​useAnnouncements.test.tsx	Adds announcement regression coverage.
packages/​react/​src/​FilteredActionList/​FilteredActionList.tsx	Supplies stable list references and filter integration.
.changeset/​bright-fields-speak.md	Documents the patch release.

---

💡 Add a code-review agent skill for context-aware, tailored reviews. Learn more in the docs.

[Copilot]

Addressed in 6640e65 with a regression test confirming recreated equivalent items do not emit a list-update announcement.

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.

[primer-integration]

Integration test results from github/github-ui PR:

  Changes Failed
  CI Failed
  VRT Failed
  Projects Passed

Changes check could not confirm that this PR only changes the expected integration paths. Open the Changes run for the unexpected files or error details.

This check is not required for merging.

Integration PRs should only change:

• node_modules/**
• packages/primer/package.json
• package-lock.json
• Top-level npm-pack tarballs in packages/primer/.prc-integration-tarballs/, named for dependencies or devDependencies in the PR base's Primer workspace manifest.
• Removal only (not additions, edits, or renames) of top-level patches in packages/patch-packages/patches/ for packages whose tarballs are added, modified, or renamed in this PR. Existing workflows also support removing @primer/react patches without tarballs.

Fixes made only in an integration PR do not reach github-ui's main branch. After the upstream Primer PR merges, other integration PRs and release PRs can fail because they do not include those fixes.

Before merging your Primer PR:

1. Keep changes backward compatible. If that is not possible, discuss the breaking change before merging.
2. If tests are over-reaching and testing implementation details, fix and merge those tests in github-ui first, then merge the Primer change.
3. If the change and tests are both valid but tests need updating, first make and merge tests that pass with both the old and new Primer versions, as you would for a feature flag. Then merge the Primer change.

Please talk to the release conductor or ask in #primer before merging your Primer PR.

CI check runs linting, type checking, and unit tests. Check the workflow logs for specific failures.

VRT check ensures that when visual differences are detected, the PR cannot proceed until someone acknowledges the changes by adding the "visual difference acknowledged" label.

Need help? If you believe this failure is unrelated to your changes, please reach out to the Primer team for assistance.