testing-library / testing-library/user-event
Support `MouseEvent.relatedTarget`
Open
Nobody has claimed this yet.
accuracy
- Dominant language
- TypeScript
- Stars
- 2.3k
- Forks
- 258
- PR merge metrics
- No merged PRs in 30d
Description
Reproduction example
https://codesandbox.io/p/sandbox/old-butterfly-239l2c?file=%2Fsrc%2FApp.test.js%3A4%2C37
Prerequisites
- Render the structure below
<div>
<p data-testid="text1" onMouseLeave={onMouseLeave}>text1</p>
<p data-testid="text2">text2</p>
</div>
- Find these fields
const text1 = screen.getByTestId('text1')
const text2 = screen.getByTestId('text2')
- Move the cursor
await user.pointer([{target: text1}, {target: text2}])
Expected behavior
event.relatedTarget should be <p data-testid="text2">text2</p>
Actual behavior
event.relatedTarget is global
User-event version
14.5.1
Environment
Testing Library framework: @testing-library/react@14.1.2
JS framework: react@18.2.0
Test environment: vitest@1.0.4
DOM implementation: jsdom@23.0.1
Additional context
No response
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 reproduction example and inspect the pointer-event handling used by user-event for the sequence from text1 to text2. Add or update a test covering MouseEvent.relatedTarget, then verify that it reports the text2 element instead of global.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- testing
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100