adobe / adobe/spectrum-web-components

[Bug]: sp-button doesn't support `aria-label`

Open
#5,658 1 comment 0 reactions 0 assignees View on GitHub
a11y bug Component:Button SEV 3 triage
Dominant language
TypeScript
Stars
1.5k
Forks
262
Avg merge
3d 10h
Merged PRs (30d)
68

Description

### Code of conduct

- [x] I agree to follow this project's code of conduct.

### Impacted component(s)

sp-button

### Library version

1.1.1

### Expected behavior

sp-button should be able to customize aria-label attribute

### Actual behavior

for a `icon-only` `sp-button` voice over can only read `button` and cannot customize aria-label

### Screenshots

_No response_

### What browsers are you seeing the problem in?

_No response_

### How can we reproduce this issue?

1. Go to https://opensource.adobe.com/spectrum-web-components/storybook/index.html?path=/story/button-black-fill--with-icon-only
2. With VoiceOver on mac on, click on the icon-only sp-button
3. Voice over reads `button` and no aria-label was exposed to clients for customization

### Sample code or abstract reproduction which illustrates the problem

```

```

### Severity

SEV 3

### Logs taken while reproducing problem

_No response_

### Would you like to track this issue in Jira?

- [x] Yes, please tell me the ticket number!

Contributor guide

Open the contributing guide

Research direction

Start at the sp-button component implementation and reproduce the icon-only example from the linked Storybook story with VoiceOver. Verify that an aria-label supplied on sp-button is exposed to assistive technology, and confirm the behavior using the sample markup and VoiceOver reproduction steps.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.