FireEvent.click TypeError: Cannot read property 'click' of undefined

Question

我正在使用 React 测试库，我有一个嵌套在一堆圆顶元素中的标签。我有一个测试 ID，我可以看到它在正确的节点上调试。但是当我运行我的测试。

import { render, cleanup } from '@testing-library/react';

test('bla', () => {
  const { fireEvent, getByTestId, debug } = render(
    <Group>
      <Menu items={items} />
    </Group>
  );

  const viewMore = getByTestId('button');
  console.log('viewMore = ', viewMore);
  // debug(viewMore);
  fireEvent.click(viewMore, {});
});

我收到以下错误。

TypeError: Cannot read property 'click' of undefined

为什么这会告诉我无法读取属性 'click'？

我的带有 class 按钮的标签位于我的菜单组件内，该组件在组内呈现。

这是 viewMore 返回的精简版。

 viewMore =  HTMLAnchorElement {
        '__reactInternalInstancect8li9ulz6': 
         FiberNode {
           tag: 5,
           key: null,
           elementType: 'a',
           type: 'a',
           stateNode: [Circular],
           return: 
            FiberNode {
              tag: 5,
              key: null,
              elementType: 'div',
              type: 'div'},
           child: null,
           sibling: null,
           index: 1,
           ref: null,
           pendingProps: 
            { href: '#',
              className: 'button',
              'data-testid': 'button',
              onClick: [Function: action],
              children: 'VIEW MORE...' },
           memoizedProps: 
            { href: '#',
              className: 'button',
              'data-testid': 'button',
              onClick: [Function: action],
              children: 'VIEW MORE...' }
        '__reactEventHandlersct8li9ulz6': 
         { href: '#',
           className: 'a-tag',
           'data-testid': 'button',
           onClick: [Function: action],
           children: 'VIEW MORE...' } }

Answer 1

fireEvent 不是来自 render 您需要从 RTL 导入它：

import { fireEvent } from '@testing-library/react'

FireEvent.click TypeError: Cannot read property 'click' of undefined

FireEvent.click TypeError: Cannot read property 'click' of undefined

reactjs

react-testing-library