Popover можно захватить и протестировать при событии щелчка, но не при событии mouseOver.

Question

У меня есть Popoverкомпонент, основанный на Popper.js, который отображается при наведении указателя мыши на кнопку. Когда я пытаюсь протестировать его, появляется сообщение об ошибке, в котором говорится, что он не может найти этот элемент, хотя я уверен, что он наводит курсор на этот компонент.

Однако, если я изменю компонент, чтобы он отображался, когда я вместо этого нажимаю кнопку и обновляю тест сfireEvent.click к fireEvent.mouseOver, тест успешно пройден.

НЕИСПРАВНОСТИ теста:

<Popover
  popoverClassName="market-selector-popover"
  content={marketMenu}
  interactionKind={PopoverInteractionKind.HOVER}
>
  <AnchorButton
    onMouseEnter={() => console.log("FIRE!")}
    data-testid="market-selector-btn"
    className="market-selector-btn"
    rightIcon="chevron-down"
    text="Button"
  />
</Popover>

it("Selects Spot tab and displays it", () => {
  const { getByTestId, getByText } = renderWithProviders(<MarketSelector />);

  fireEvent.mouseOver(getByTestId("market-selector-btn")); // FIRE!
  expect(getByText("Spot")).toBeInTheDocument();           // FAIL
});

ТЕСТОВЫЕ ПРОХОДЫ:

<Popover
 popoverClassName="market-selector-popover"
 content={marketMenu}
>
  <AnchorButton
    data-testid="market-selector-btn"
    className="market-selector-btn"
    rightIcon="chevron-down"
    text="Button"
  />
</Popover>

it("Selects Spot tab and displays it", () => {
  const { getByTestId, getByText } = renderWithProviders(<MarketSelector />);

  fireEvent.click(getByTestId("market-selector-btn")); 
  expect(getByText("Spot")).toBeInTheDocument(); 
});