Testing with jest/vitest
This is not really a bug but rather a stumping behaviour.
I need to write unit tests for a component that uses this library.
I want to test that my callback is actually being called with the edited image.
My test in vitest is:
```ts
    function renderImageEditor({ open = true, useEdited = false }: { open?: boolean, useEdited?: boolean } = {}) {
      const mockOnClose = vi.fn();
      const mockOnEdit = vi.fn();
      const mockOriginalImage = 'original';
      const mockEditedImage = 'edited';
      const getters = render(
        <ImageEditor
          open={open}
          originalImage={mockOriginalImage}
          editedImage={useEdited ? mockEditedImage : undefined}
          onClose={mockOnClose}
          onEdit={mockOnEdit}
        />,
      );
      return {
        ...getters, mockOnEdit, mockOnClose, mockOriginalImage, mockEditedImage,
      };
    }

    it('should submit new image when saving after editing', () => {
      const {
        getByTestId, mockOnEdit, mockEditedImage, mockOriginalImage,
      } = renderImageEditor({ useEdited: true });
      const canvas = document.getElementById(imageEditorTestIds.canvas)!;
      fireEvent.mouseDown(canvas);
      fireEvent.mouseMove(canvas);
      fireEvent.mouseUp(canvas);
      const button = getByTestId(imageEditorTestIds.submit);
      fireEvent.click(button);
      expect(mockOnEdit).toHaveBeenCalled();
      expect(mockOnEdit).not.toHaveBeenCalledWith(mockEditedImage);
      expect(mockOnEdit).not.toHaveBeenCalledWith(mockOriginalImage);
    });
  });
```

I'm using `id` because using `data-testid` doesn't actually reach the underlying element.
This test fails, claiming that my function is not being called at all.

For brevity, here is my minimal component:
```ts
function Component = ({onEdit, originalImage, editedImage}) => {
  const [isEdited, setIsEdited] = useState<boolean>(false);
  const canvasRef = useRef<ReactSketchCanvasRef>(null);

  const onSubmit = async () => {
    if (isEdited) {
      const data = await canvasRef.current?.exportImage('jpeg');
      onEdit(data || originalImage);
      onClose();
    }
  };


  return <div data-testid={testIds.wrapper}>
           <ReactSketchCanvas
        id={testIds.canvas}
        ref={canvasRef}
        backgroundImage={editedImage || originalImage}
        className='w-full h-full'
        strokeWidth={4}
        strokeColor='red'
        exportWithBackgroundImage
        onStroke={() => setIsEdited(true)}
      />
    </div>
```

If `onEdit` is not being called, it means the `isEdited` is not being changed to true, which means my test never triggers the `onStroke`.
How do I actually test this?