testing pinch event

[carmnk]

Hi,
at first thanks for this package , I find it very useful. 😃👍

I am trying to test the Pinch Gesture but I am not quite sure how to trigger the event.

I am using:
"jest": "^27.4.7",
"@testing-library/react": "^12.1.2",
"@use-gesture/react": "^10.2.0",

so the situation should be similar to this package.

I figured out how to test other gestures like drag, wheel, hover, move but the pinch gesture seems a little tricky.
I tried the same approach like in your test: https://github.com/pmndrs/use-gesture/blob/main/test/pinch.test.tsx - without success.

fireEvent.pointerDown(element, { pointerId: 21, clientX: 0, clientY: 0, buttons: 1 })
expect(queryByTestId(`${prefix}pinch-active`)).not.toBeInTheDocument()

const event = createEvent.pointerDown(element, { pointerId: 22, clientX: 0, clientY: 40, buttons: 1 })
fireEvent(element, event)

I have already learned that there's an issue with createEvent,
testing-library/dom-testing-library#558
but I don't need a reference to the event created so I can avoid it.

My use-gesture/react implementation looks like this

useGesture(
  {
    // ... 
    onPinch: (pinchState) => {
    // do something ... 
    },
    /// ...
  },
  {
    target: someRef, 
    pinch: { axis: "x" },
  }

and for testing:

//....
fireEvent.pointerDown(pointerArea, { pointerId: 31, clientX: 10, clientY: 0, buttons: 1 });
fireEvent.pointerDown(pointerArea, { pointerId: 32, clientX: 110, clientY: 0, buttons: 1 });

Am I missing something?