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:
Susana Ferreira
2025-07-30 09:54:43 +01:00
committed by GitHub
parent 4bced62bf1
commit 44d9356985
2 changed files with 4 additions and 7 deletions
@@ -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"),
+1 -1
View File
@@ -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 */