mirror of
https://github.com/coder/coder.git
synced 2026-09-22 05:05:20 +08:00
fix(site): remove redundant alt text to prevent duplicated accessible names (#19087)
## Description Removes the redundant `alt` text in the `Combobox` component to prevent screen readers from announcing duplicated names (e.g. "Rust Rust"). ## Changes * Remove redundant `alt` text from `Combobox` `ExternalImage` * Update `Combobox` tests accordingly Related to: https://github.com/coder/coder/pull/19063#discussion_r2240459424
This commit is contained in:
@@ -103,8 +103,7 @@ export const SearchAndFilter: Story = {
|
||||
screen.queryByRole("option", { name: "Kotlin" }),
|
||||
).not.toBeInTheDocument();
|
||||
});
|
||||
// Accessible name includes both image alt text and text content: "Rust Rust"
|
||||
await userEvent.click(screen.getByRole("option", { name: "Rust Rust" }));
|
||||
await userEvent.click(screen.getByRole("option", { name: "Rust" }));
|
||||
},
|
||||
};
|
||||
|
||||
@@ -138,11 +137,9 @@ export const ClearSelectedOption: Story = {
|
||||
await userEvent.click(canvas.getByRole("button"));
|
||||
// const goOption = screen.getByText("Go");
|
||||
// First select an option
|
||||
// Accessible name includes both image alt text and text content: "Go Go"
|
||||
await userEvent.click(await screen.findByRole("option", { name: "Go Go" }));
|
||||
await userEvent.click(await screen.findByRole("option", { name: "Go" }));
|
||||
// Then clear it by selecting it again
|
||||
// Accessible name includes both image alt text and text content: "Go Go"
|
||||
await userEvent.click(await screen.findByRole("option", { name: "Go Go" }));
|
||||
await userEvent.click(await screen.findByRole("option", { name: "Go" }));
|
||||
|
||||
await waitFor(() =>
|
||||
expect(canvas.getByRole("button")).toHaveTextContent("Select option"),
|
||||
|
||||
@@ -124,7 +124,7 @@ export const Combobox: FC<ComboboxProps> = ({
|
||||
<ExternalImage
|
||||
className="w-4 h-4 object-contain"
|
||||
src={option.icon}
|
||||
alt={option.displayName}
|
||||
alt=""
|
||||
/>
|
||||
) : (
|
||||
/* Placeholder for missing icon to maintain layout consistency */
|
||||
|
||||
Reference in New Issue
Block a user