user-event
user-event copied to clipboard
feat: add option to set element class on hover
Important: I have two different changes in the same PR as I want to use the version generated by codesandbox, but when ready to mege this can be fixed.
What:
- Add option to set a class on target element on hover. Useful for testing hover states either by manually adding
.my-hover-class
on top of:hover
in CSS or with a plugin such as the one for PostCSS or Storybook. - Fix focus event not sent sometimes.
startSelecting()
is called beforefocusElement()
. Setting a selection on an element sets that element as thedocument.activeElement
, causingfocusElement()
not to do anything.
Why:
Allow testing of CSS hover states using userEvent.hover
/ userEvent.unhover
or other commands that move the mouse.
How:
Add a new config option hoverClass
(string) which defaults to null. When set (non-null), target.classList.add(hoverClass)
is called whenever mouseenter
is emitted and target.classList.remove(hoverClass)
whenever mouseleave
is emitted.
Checklist:
- [ ] Documentation
- [ ] Tests
- [x] Ready to be merged
This pull request is automatically built and testable in CodeSandbox.
To see build info of the built libraries, click here or the icon next to each commit SHA.