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

it('should throw on invalid arguments', () => {
    // $ExpectError
    fireEvent(1);
    // $ExpectError
    fireEvent(htmlEl, 1);
  });

it('should throw on invalid arguments', () => {
    // $ExpectError
    fireEvent(1);
    // $ExpectError
    fireEvent(htmlEl, 1);
  });

// foreign placeholder is now gone
      expect(hasPlaceholder(preset.foreign.descriptor.id, container)).toBe(
        false,
      );
      // home placeholder is still around and will now animate closed
      expect(hasPlaceholder(preset.home.descriptor.id, container)).toBe(true);

      // placeholder is now collapsing
      const placeholder: HTMLElement = getPlaceholder(
        preset.home.descriptor.id,
        container,
      );
      expect(placeholder.style.height).toBe('0px');

      // faking a transition end
      fireEvent(placeholder, getTransitionEnd('height'));

      // placeholder is gone
      expect(hasPlaceholder(preset.home.descriptor.id, container)).toBe(false);
    });
  });

,
  );
  const handle: HTMLElement = getByText('item: 0');
  invariant(api);

  // trigger a drop
  const preDrag: ?PreDragActions = api.tryGetLock('0');
  invariant(preDrag);
  const drag: SnapDragActions = preDrag.snapLift();
  act(() => drag.drop({ shouldBlockNextClick: true }));

  // fire click
  const first: MouseEvent = createEvent.click(handle);
  const second: MouseEvent = createEvent.click(handle);
  fireEvent(handle, first);
  fireEvent(handle, second);

  // only first click is prevented
  expect(first.defaultPrevented).toBe(true);
  expect(second.defaultPrevented).toBe(false);
});

it('permits drags and drops on elements inside our dropzone', () => {
      const { container } = render(
        
          {({ getRootProps, getInputProps }) => (
            <div>
              <input>
            </div>
          )}
        
      )
      const dropzone = container.querySelector('div')

      const dropEvt = new Event('drop', { bubbles: true })
      const dropEvtPreventDefaultSpy = jest.spyOn(dropEvt, 'preventDefault')

      fireEvent(dropzone, dropEvt)
      // A call is from the onDrop handler for the dropzone,
      // but there should be no more than 1
      expect(dropEvtPreventDefaultSpy).toHaveBeenCalled()
    })

it('should allow standard click events', () => {
  const { getByText } = render();
  const handle: HTMLElement = getByText('item: 0');

  const click: MouseEvent = createEvent.click(handle);
  fireEvent(handle, click);

  expect(click.defaultPrevented).toBe(false);
});

it('should not start a drag if not using the primary mouse button', () => {
  const { getByText } = render();
  const handle: HTMLElement = getByText('item: 0');

  const mouseDown: Event = createEvent.mouseDown(handle, {
    button: primaryButton + 1,
  });
  fireEvent(handle, mouseDown);
  fireEvent.mouseMove(handle, {
    clientX: 0,
    clientY: sloppyClickThreshold,
  });

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

it('should prevent default on an escape press', () => {
  const onDragEnd = jest.fn();
  const { getByText } = render();
  const handle: HTMLElement = getByText('item: 0');

  simpleLift(touch, handle);

  const event: Event = createEvent.keyDown(handle, {
    keyCode: keyCodes.escape,
  });
  fireEvent(handle, event);

  expect(event.defaultPrevented).toBe(true);
  expect(getDropReason(onDragEnd)).toBe('CANCEL');
});

it('should call preventDefault on the initial mousedown event to prevent the element gaining focus', () => {
  const { getByText } = render();
  const handle: HTMLElement = getByText('item: 0');

  const mouseDown: MouseEvent = createEvent.mouseDown(handle);
  fireEvent(handle, mouseDown);

  expect(mouseDown.defaultPrevented).toBe(true);
});

it('should not apply focused prop if pointerdown is triggered', () => {
        const { getByTestId } = render();
        const trigger = getByTestId('trigger');

        fireEvent(trigger, new MouseEvent('pointerdown'));
        jest.runOnlyPendingTimers();

        expect(trigger).toHaveAttribute('data-focused', 'false');
      });
    });