carbon-design-system / carbon-design-system/carbon-components-angular
Tabs container receives visual focus indicator when clicking in the container
- Dominant language
- TypeScript
- Stars
- 566
- Forks
- 318
- PR merge metrics
- No merged PRs in 30d
Description
https://angular-step-6-carbon-tutorial.netlify.com
Clicking on "What is Carbon?" or anywhere in the tab container that doesn't have its own focus puts visible focus on the tab container, resulting in an unexpected browser focus indication on the tab container. See blue in this screenshot:

This is a discrepancy with the React implementation, e.g.:
https://react-step-6--carbon-tutorial.netlify.com/#/
Contributor guide
Research direction
Reproduce the behavior using the Angular tutorial link and compare it with the linked React implementation. Trace the tabs container and its focus behavior from the relevant Angular component files; done means clicking non-focusable space in the container no longer shows an unexpected focus indicator while actual tab focus remains visible.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, 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