adobe / adobe/spectrum-web-components

[Bug]: focus ring was not being applied to the picker button when clicked

Open
#5,573 1 comment 0 reactions 0 assignees View on GitHub
bug Component:Picker Component:Picker button SEV 4
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)

Picker

### Expected behavior

When a Picker is clicked, `focused` attribute would be applied to the `sp-picker` component and the component should show the focus ring.

When tabbed to the component the focused state and the focus ring applies correctly

### Actual behavior

When a Picker is clicked, `focused` attribute is not applied on `sp-picker`

### Screenshots

Image

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

Firefox, Chrome, Safari, Microsoft Edge

### How can we reproduce this issue?

1. Go to https://opensource.adobe.com/spectrum-web-components/storybook/index.html?path=/story/picker--default
2. Click on Picker to open
3. Check no blue ring is applied on the component

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

_No response_

### Severity

SEV 4

### Logs taken while reproducing problem

_No response_

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

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

Contributor guide

Open the contributing guide

Research direction

Start with the Picker default story at the linked Storybook URL and reproduce the missing focus ring by clicking the component in Firefox, Chrome, Safari, or Edge. Then locate the Picker implementation and its existing focus behavior, and verify that clicking applies the focused attribute and displays the focus ring while tabbing continues to work.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.