Update `Button.stories.js` To Include Hover Effects of the Buttons Correctly
- Dominant language
- JavaScript
- Stars
- 1.4k
- Forks
- 383
- Avg merge
- 4d 14h
- Merged PRs (30d)
- 77
Description
## Feature Description
I noticed we have unused story https://github.com/google/site-kit-wp/blob/2a6f107c6e6069a0499c30e12d5b640ffaa82a97/assets/js/googlesitekit/components-gm2/Button.stories.js#L36-L41, as this one is not included in the VRT, and does nothing, since the `googlesitekit-button--hover` class is not included in `hoverSelector`, only one having hover applied to it is the variation with an icon.
While updating this file to add additional buttons, I tried to have a quick look and potentially fix it, but it was behaving in a weird way, even one class is applied to few buttons, they are not going to be hovered during VRT, only the first one will. I also experimented with no/additional timeouts, but without timeouts not event first hover is captured.
We should adapt this, so we can capture hover styles as well, it will be useful for catching early any change to the hover style of any button.
---------------
_Do not alter or remove anything below. The following sections will be managed by moderators only._
## Acceptance criteria
*
## Implementation Brief
* [ ]
### Test Coverage
*
## QA Brief
*
## Changelog entry
*
Contributor guide
Research direction
Start with assets/js/googlesitekit/components-gm2/Button.stories.js and inspect the existing hoverSelector and button stories. Reproduce the visual regression test behavior for multiple buttons sharing a hover class, then adjust the story or VRT setup so each button's hover styles are captured. Done means the unused story is included and hover effects for all relevant buttons appear correctly in VRT.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, storybook
- Domain
- frontend, testing
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100