Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Incomplete accessible name on "Prev" button in Prompts Panel #5310

Open
derekjackson-das opened this issue Jan 13, 2025 · 0 comments · May be fixed by #5369
Open

Incomplete accessible name on "Prev" button in Prompts Panel #5310

derekjackson-das opened this issue Jan 13, 2025 · 0 comments · May be fixed by #5369
Labels
a11y Accessibility

Comments

@derekjackson-das
Copy link
Collaborator

derekjackson-das commented Jan 13, 2025 •
edited
Loading

Issue Description

Screen readers will read the word "prev", instead of the full word "previous". This creates confusion for users relying on assistive technologies.

WCAG Criteria

1.1.1 Non-text Content (Level A)

Screenshot or Screen Recording

No screenshot provided.

Snippet:

<button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 text-text-primary border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3" disabled="">
  Prev
</button>

Suggested Action:

Change the text to the full word "Previous".
Alternatively, provide an accessible name for screen readers using aria-label="previous" or visually hidden element (e.g., add the class .sr-only) and wrap "Prev" in a with aria-hidden="true".
@derekjackson-das derekjackson-das added the a11y Accessibility label Jan 13, 2025
berry-13 added a commit that referenced this issue Jan 20, 2025
@berry-13
Fix incomplete accessible name on 'Prev' button in Prompts Panel
45e8b89 
Fixes #5310

Add `aria-label="previous"` attribute to the 'Prev' button in the Prompts Panel.

* Modify `client/src/components/Chat/Prompts.tsx` to include `aria-label="previous"` attribute for the button.
@berry-13 berry-13 linked a pull request Jan 20, 2025 that will close this issue
Open
10 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
a11y Accessibility
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

🔈fix: incomplete accessible name on 'Prev' button in Prompts Panel danny-avila/LibreChat
1 participant
@derekjackson-das