docs: fix pointerName property in pointer API docs

[ZeeshanTamboli]

No description provided.

[netlify]

✅ Deploy Preview for testing-library ready!

Name	Link
🔨 Latest commit	3ad818d
🔍 Latest deploy log	https://app.netlify.com/sites/testing-library/deploys/661eb3260b88b000083a8a4c
😎 Deploy Preview	https://deploy-preview-1383--testing-library.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[MatanBobi]

Thanks @ZeeshanTamboli. It looks like this is indeed the required behavior, if something isn't working properly, please file an issue for this one in the user-event repo.

[ZeeshanTamboli]

@MatanBobi @timdeschryver I'm trying to test textarea resizing with the user-event library to ensure it doesn't glitch. Here's what I've done:

  it.only('should not glitch when resizing textarea', async function test() {
    if (/jsdom/.test(window.navigator.userAgent)) {
      this.skip();
    }

    const { container } = render(<TextareaAutosize />);
    const textarea = container.querySelector<HTMLTextAreaElement>('textarea')!;

    console.log('before textarea.style.height: ', textarea.style.height);

    // Get the element's dimensions
    const { top, left, width, height } = textarea.getBoundingClientRect();

    // Calculate coordinates of bottom-right corner
    const bottomRightX = left + width;
    const bottomRightY = top + height;

    const user = userEvent.setup();

    await user.pointer([
      {
        keys: '[MouseLeft>]',
        target: textarea,
      },
      {
        pointerName: 'MouseLeft',
        target: textarea,
        coords: { clientX: bottomRightX, clientY: bottomRightY },
      },
      '[/MouseLeft]',
    ]);

    console.log('after textarea.style.height: ', textarea.style.height);
  });

But I'm getting an error saying Trying to access pointer "MouseLeft" which does not exist. If I change pointerName to mouse, it doesn't error. In our existing tests, we use pointerName: 'mouse'. Or is it that for mouse events, pointerName should be mouse, and for touch events, it should be TouchA, TouchB, and so on? If that's the case, it's confusing. The documentation says:

You can declare which pointer is moved per pointerName property. This defaults to mouse.

Do you still want me to create an issue?

[MatanBobi]

I assume that this is different for pointers, let's wait for @ph-fritsche to respond as he knows this area best :) I'll re-open.