Chromatic testing of hover/focus states
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 39
- Forks
- 14
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 13
Description
🧹 Tech Debt
We would like to capture regressions in the visual styling of interactive states, like hover or keyboard focus.
We should update contributing docs to describe our expectations for interactive testing (cover hover/focus/active).
We need to add tests for these components. Devs a pick up one or more at a time; be sure to indicate that you're working on them.
- banner (has unique button styling)
- breadcrumb/breadcrumb-item
- card-button
- checkbox
- combobox
- menu-item/anchor-menu-item
- radio
- select
- switch
- tab
- table (unclear how to scope this)
- text-area
- text-field
- tree-item/anchor-tree-item
- anchor
- anchor-button
- button
- menu-button
- number-field
- toggle-button
Not needed for:
- dialog
- drawer
- icons
- spinner
- toolbar
- card
- rich-text-editor
- rich-text-viewer
- tooltip
- wafer-map
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the contributing docs and the existing Chromatic coverage for one unchecked component from the list. Confirm the component's hover, focus, and active states, then document the testing expectations and add the requested coverage; mark the component as claimed while working on it.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend, testing
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100