如何使用 Enzyme、Jest 测试组件中的单独功能

问题描述 投票:0回答:0

当我尝试使用 Enzyme 进行测试时,我无法理解如何访问组件中的功能。

我有一个组件:

const DashboardTotalViewTable = () => {
.....
const sortedTableByTags = useMemo(() => tableData.filter((item) => item?.tags?.filter(i => i?.name?.includes(selectedOption))), [tableData, selectedOption]);

const handleSelectChange = v => {
  const res = v?.map(item => item.label);
  setSelectedOptions(res);
  console.log('handleSelectChange :', res);
};
....
}

第一个只是过滤对象数组。

Secons 只是将选定的项目从 select 设置为 state。 // ['Item_1', 'Item_2'] - 这是两个选中的项目

it('Case 1', () => {
const component = shallow(<DashboardTotalViewTable />);
  const props = ['Country', 'Carrier']
  expect(component.instance().checkBoxChecked()).toBe(['Country', 'Carrier']);
});

it('Case 2', () => {
const component = shallow(<DashboardTotalViewTable />);
  const props = ['Country', 'Carrier']
  expect(component.instance().handleSelectChange(props)).toHaveBeenCalled();
});

测试后出现错误:TypeError: Cannot read properties of null (reading 'handleSelectChange')

如何测试boyh功能?如何访问功能?我做错了什么?

reactjs testing jestjs enzyme
© www.soinside.com 2019 - 2024. All rights reserved.