Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Mouse/pointer ignores coords.clientX changes #1139

Open
liamcmitchell-sc opened this issue Jun 5, 2023 · 0 comments · May be fixed by #1229
Open

Mouse/pointer ignores coords.clientX changes #1139

liamcmitchell-sc opened this issue Jun 5, 2023 · 0 comments · May be fixed by #1229
Labels
bug Something isn't working needs assessment This needs to be looked at by a team member

Comments

@liamcmitchell-sc
Copy link

Reproduction example

https://codesandbox.io/s/adoring-browser-h5lzcy?file=/src/App.test.js

Prerequisites

  1. Render element with mousemove handler
  2. Move pointer with coords: {clientX: 1}
  3. Move pointer again with coords: {clientX: 2}

Expected behavior

Two mousemove events with clientX values of 1 and 2.

Actual behavior

A single event with clientX 1.

User-event version

14.4.3

Environment

No response

Additional context

Relevant

isDifferentPointerPosition only compares x and y.

user-event/src/system/pointer/shared.ts

Lines 24 to 35 in 7a305de

export function isDifferentPointerPosition(
positionA: PointerPosition,
positionB: PointerPosition,
) {
return (
positionA.target !== positionB.target ||
positionA.coords?.x !== positionB.coords?.y ||
positionA.coords?.y !== positionB.coords?.y ||
positionA.caret?.node !== positionB.caret?.node ||
positionA.caret?.offset !== positionB.caret?.offset
)
}

initMouseEvent uses x/y as defaults for clientX/clientY.

user-event/src/event/createEvent.ts

Lines 180 to 205 in 7a305de

function initMouseEvent(
event: MouseEvent,
{
x,
y,
screenX,
screenY,
clientX = x,
clientY = y,
button,
buttons,
relatedTarget,
}: MouseEventInit & {x?: number; y?: number},
) {
assignProps(event, {
screenX: sanitizeNumber(screenX),
screenY: sanitizeNumber(screenY),
clientX: sanitizeNumber(clientX),
x: sanitizeNumber(clientX),
clientY: sanitizeNumber(clientY),
y: sanitizeNumber(clientY),
button: sanitizeNumber(button),
buttons: sanitizeNumber(buttons),
relatedTarget,
})
}

x & y are specified as aliases of clientX/Y, suggesting the defaults should go the other way around.

From JSDOM@22, x & y will alias clientX/Y per spec:
https://github.com/jsdom/jsdom/blob/a39e0ec4ce9a8806692d986a7ed0cd565ec7498a/lib/jsdom/living/events/MouseEvent-impl.js#L9-L15

Related: page/offsetX/Y are defined as properties of PointerCoords but cannot be set on MouseEvent. Depending on wether these props are supported or not, they should either be included in the pointer difference check or removed.

Reported in: #1037

Workaround

Use x/y for coords:

 await view.user.pointer({
    coords: {
      x: 1,
      y: 1,
    },
  })
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working needs assessment This needs to be looked at by a team member
Projects
None yet
Milestone
No milestone
1 participant
@liamcmitchell-sc