How to use the @testing-library/react.fireEvent.mouseUp function in @testing-library/react

it('should prevent a subsequent click if dropping a drag', () => {
  const onDragEnd = jest.fn();
  const { getByText } = render();
  const handle: HTMLElement = getByText('item: 0');

  simpleLift(mouse, handle);
  expect(isDragging(handle)).toBe(true);

  // cancel
  fireEvent.mouseUp(handle);

  expect(getDropReason(onDragEnd)).toBe('DROP');
  expect(isDragging(handle)).toBe(false);

  // click event prevented
  const click: Event = createEvent.click(handle);
  fireEvent(handle, click);
  expect(click.defaultPrevented).toBe(true);
});

fireEvent.mouseDown(dragbar, { clientX: 10, clientY: 10 });
      fireEvent.mouseMove(window, { clientX: 11, clientY: 11 });

      expect(container).toHaveStyle(`
        top: 1px;
        left: 1px;
      `);

      fireEvent.mouseMove(window, { clientX: 20, clientY: 20 });

      expect(container).toHaveStyle(`
        top: 10px;
        left: 10px;
      `);

      fireEvent.mouseUp(window, { clientX: 20, clientY: 20 });

      // this last event shouldn't have any effect
      fireEvent.mouseMove(window, { clientX: 25, clientY: 25 });

      expect(container).toHaveStyle(`
        top: 10px;
        left: 10px;
      `);
    });
  });

)}
      
    )
  }
  const {getByTestId, queryByTestId} = render()
  expect(queryByTestId('menu')).toBeNull()
  getByTestId('button').click()
  expect(getByTestId('menu')).toBeInstanceOf(HTMLElement)

  const notAnItem = getByTestId('not-an-item')

  // Mouse events
  fireEvent.mouseDown(notAnItem)
  notAnItem.focus() // sets document.activeElement
  fireEvent.mouseUp(notAnItem)
  expect(getByTestId('menu')).toBeInstanceOf(HTMLElement)

  // Touch events
  fireEvent.touchStart(notAnItem)
  fireEvent.touchEnd(notAnItem)
  notAnItem.focus() // sets document.activeElement
  expect(getByTestId('menu')).toBeInstanceOf(HTMLElement)

  getByTestId('item').click()
  expect(queryByTestId('menu')).toBeNull()
  expect(getByTestId('selection')).toHaveTextContent('The item')
})

it("should not trigger the pressed state change for any mouse button other than left", () => {
    const pressedRef = createRef();
    const { getByText } = render();
    expect(pressedRef.current).toBe(false);
    const button = getByText("Button");

    fireEvent.mouseDown(button, { button: 1 });
    expect(pressedRef.current).toBe(false);
    fireEvent.mouseUp(button, { button: 1 });
    expect(pressedRef.current).toBe(false);

    fireEvent.mouseDown(button, { button: 2 });
    expect(pressedRef.current).toBe(false);
    fireEvent.mouseUp(button, { button: 2 });
    expect(pressedRef.current).toBe(false);
  });

function mouseDownAndUp(node) {
  fireEvent.mouseDown(node)
  fireEvent.mouseUp(node)
}

up,
  moveAfterDrop,
}) => {
  const [resizeBar] = container.getElementsByClassName(
    `rdl-resize-bar--${type}`,
  );

  fireEvent.mouseDown(resizeBar, down.event);
  expect(resizeBar).toHaveStyle(down.style);

  move.forEach(({ event, style }) => {
    fireEvent.mouseMove(window, event);
    expect(resizeBar).toHaveStyle(style);
  });

  fireEvent.mouseUp(resizeBar, up.event);
  expect(resizeBar).toHaveStyle(up.style);
  expect(container).toHaveStyle(up.floatStyle);

  fireEvent.mouseUp(resizeBar, moveAfterDrop.event);
  expect(resizeBar).toHaveStyle(moveAfterDrop.style);
};

function mouseDownAndUp(node) {
  fireEvent.mouseDown(node)
  fireEvent.mouseUp(node)
}

Array.from({ length: 5 }).forEach(() => {
    fireEvent.mouseDown(handle);
    fireEvent.mouseUp(handle);

    expect(isDragging(handle)).toBe(false);
  });