Reproduction example
https://codesandbox.io/s/aged-voice-xjf3dw
Prerequisites
- Click the box with your mouse
- Look in the console at the events that were fired
- Compare to the console when running the test with user.click
Expected behavior
Both should fire
pointerDown
pointerUp
click
Actual behavior
The test does not fire click
I'll provide more in additional context because the codesandbox behaves a little differently than when I run this repos tests with two tests I think cover the behavior
User-event version
14.4.3
Environment
Testing Library framework: @testing-library/[email protected]
JS framework: [email protected]
Test environment: [email protected]
DOM implementation: [email protected]
Additional context
I think these are the behaviors that would be expected, assuming I wrote them correctly.
In english:
calling user.click with preventDefault on pointerDown should result in pointerDown, pointerUp, and click being fired
calling user.pointer with preventDefault on pointerDown should also result in pointerDown, pointerUp, and click being fired
test('preventDefault on pointer down prevents compatibility events works with click', async () => {
const {element, getClickEventsSnapshot, getEvents, user} = setup('<div />', {eventHandlers: {pointerdown: e => e.preventDefault()}})
await user.click(element)
expect(getClickEventsSnapshot()).toMatchInlineSnapshot(`
pointerdown - pointerId=1; pointerType=mouse; isPrimary=true
pointerup - pointerId=1; pointerType=mouse; isPrimary=true
click - button=0; buttons=0; detail=1
`)
expect(getEvents('click')).toHaveLength(1)
})
test('preventDefault on pointer down prevents compatibility events works with pointer', async () => {
const {element, getClickEventsSnapshot, getEvents, user} = setup('<div />', {eventHandlers: {pointerdown: e => e.preventDefault()}})
await user.pointer({keys: '[MouseLeft]', target: element})
expect(getClickEventsSnapshot()).toMatchInlineSnapshot(`
pointerdown - pointerId=1; pointerType=mouse; isPrimary=true
pointerup - pointerId=1; pointerType=mouse; isPrimary=true
click - button=0; buttons=0; detail=1
`)
expect(getEvents('click')).toHaveLength(1)
})
I think this is handled here https://github.com/testing-library/user-event/blob/main/src/system/pointer/index.ts#L105 but I've checked and isPrevented is true. So I'm not sure why the mouse events are getting fired.
It looks like including a 'click' is part of system/pointer/mouse. So guessing that would need to be pulled up and out of there.
Reproduction example
https://codesandbox.io/s/aged-voice-xjf3dw
Prerequisites
Expected behavior
Both should fire
Actual behavior
The test does not fire click
I'll provide more in additional context because the codesandbox behaves a little differently than when I run this repos tests with two tests I think cover the behavior
User-event version
14.4.3
Environment
Testing Library framework:
@testing-library/[email protected]JS framework:
[email protected]Test environment:
[email protected]DOM implementation:
[email protected]Additional context
I think these are the behaviors that would be expected, assuming I wrote them correctly.
In english:
calling user.click with preventDefault on pointerDown should result in pointerDown, pointerUp, and click being fired
calling user.pointer with preventDefault on pointerDown should also result in pointerDown, pointerUp, and click being fired
I think this is handled here https://github.com/testing-library/user-event/blob/main/src/system/pointer/index.ts#L105 but I've checked and isPrevented is true. So I'm not sure why the mouse events are getting fired.
It looks like including a 'click' is part of system/pointer/mouse. So guessing that would need to be pulled up and out of there.