Skip to content
This repository is currently being migrated. It's locked while the migration is in progress.

Results description: Remove bold from Code guidance bullets #6168

Draft
Copilot wants to merge 2 commits into
base: main
Choose a base branch
from
Draft

Results description: Remove bold from Code guidance bullets #6168

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7ddee49
Initial plan
Copilot Apr 22, 2026
9c304a6
Remove bold formatting from Code guidance section of Results description
Copilot Apr 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 13 additions & 6 deletions src/_includes/components/results-description.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,19 @@
Text describing how many results are being shown.

* **Showing 1–10 of 999 results for "[query]".** The implementation should follow this format:
#### Structure

> Showing 1–10 of 999 results for "[query]"
* When used in non-search contexts, omit the `for "[query]"` portion. For example: `Showing 1–10 of 999 results.`
The implementation should follow this format:

* **Update when filters change.** The results description must update when filters are changed so that all users can understand that the results have been updated. Implementation should follow this format:
* Showing 1–10 of 999 for "[query]"
Copy link

Copilot AI Apr 22, 2026

Choose a reason for hiding this comment

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

The example format now says “Showing 1–10 of 999 for "[query]"”, but the intro sentence describes “how many results are being shown” and the prior content used “999 results”. Consider adding “results” back into the example (or adjusting the intro) to keep terminology consistent and avoid ambiguity.

Suggested change
* Showing 1–10 of 999 for "[query]"
* Showing 1–10 of 999 results for "[query]"

Copilot uses AI. Check for mistakes.
* When used in non-search contexts, omit the `for "[query]"` portion.
Copy link

Copilot AI Apr 22, 2026

Choose a reason for hiding this comment

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

This update removes the explicit requirement that the results description update when filters change (and previously included an example like “with X filters applied”). Since this include is used by the Search results template page (which doesn’t restate that requirement elsewhere), this guidance likely needs to remain here to avoid losing an important accessibility/UX constraint.

Suggested change
* When used in non-search contexts, omit the `for "[query]"` portion.
* When used in non-search contexts, omit the `for "[query]"` portion.
* The results description should update when filters change so it reflects the currently shown result set.

Copilot uses AI. Check for mistakes.
* If a filter is applied to the results, add "with X filters applied" to the end. This is not necessary when sorting is applied since the Sort component itself acts as the visual indicator.

> Showing 1–10 of 999 results for "[query]" with 5 filters applied.
#### Code guidance

Comment on lines 1 to 12
Copy link

Copilot AI Apr 22, 2026

Choose a reason for hiding this comment

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

The PR description/title say this change only removes bold styling from the existing Code guidance bullets, but this diff also restructures the section (adds a new “Structure” heading) and removes/replaces previously existing guidance and examples. Either update the PR description to match the actual content changes, or revert the non-bolding edits so the change set aligns with the stated intent.

Copilot uses AI. Check for mistakes.
* **Do not reflect changes to sort.** The Sort component itself acts as the visual indicator of the order.
* An `<h2>` is not required for the results description. Some implementations on VA.gov may use this convention, but this is not necessary. A stable, targetable element (e.g., ID) is sufficient for focus management.
* Using `role="status"` provides an implicit `aria-live="polite"`, which will announce updates when the content changes. Adding an explicit `aria-live` is not necessary.
* To support programmatic focus, `tabindex="-1"` is required if we intend to move focus to the results description element. This is a focus-driven announcement pattern and is separate from live region behavior.
* When moving focus to the results description, the content should be announced as a single unit, assuming the DOM update is atomic.
* In testing (especially with VoiceOver), inline elements such as `<strong>`, `<span>`, etc., can cause the content to be announced in fragmented chunks instead of a single cohesive sentence, even though this is not consistently expected behavior.
* Avoid inline stylistic elements within the results description when possible, and instead rely on plain text to ensure consistent, single-pass announcements across assistive technologies.
* If inline styling is required, additional measures such as `aria-atomic="true"` may help, but results can still vary across screen readers.
Loading