首页 > 解决方案 > 如何解决错误'expect(onClick).toHaveBeenCalled();'

问题描述

我无法测试对我的反应组件的 2 个子组件的点击,有人知道如何提供帮助吗?

<Container>
    <Checkbox
       data-testid='Checkbox'
       checked={checked}
       disabled={disabled}
       onClick={handleCheckboxChange}
    />
            
  
    <Item
      data-testid='Label'
      disabled={disabled}
      onClick={handleCheckboxChange}
     >
       {label}
    </Item>
    </Container>

我的测试

    it('textLabel enabled', () => {
        const onClick = jest.fn();
        render(<Checkbox label='item 1' onClick={onClick} />);
        userEvent.click(screen.getByTestId(Label'));
        expect(onClick).toHaveBeenCalled();
    });

我无法测试对项目的点击,它在测试中给出了错误

期望(onClick).toHaveBeenCalled();

标签: reactjstypescriptjestjs

解决方案


当你在测试

render(<Checkbox label='item 1' onClick={onClick} />);

这里的标签是'item 1',而不是'Label' 你正在做的是模拟'Label'上的点击事件而不是'Item 1'

所以你需要做

userEvent.click(screen.getByTestId('item 1'));

推荐阅读