开发者问题收集

类型错误：无法读取未定义的属性“have”

2018-09-09
1716
reactjs enzyme

我在 React 酶测试中收到此错误 - TypeError：无法读取未定义的属性“have”

以下是我的测试文件： 

import React from 'react';
import ReactDOM from 'react-dom';
import { mount } from 'enzyme';
import TransactionsTable from './TransactionsTable';

import Pagination from './Pagination';

it('contains a table', () => {
  const wrapper = mount(<TransactionsTable />);
  expect(wrapper.find(Pagination)).to.have.lengthOf(1);
});

我看不出我的代码与我见过的解决方案有何不同。此外，它似乎符合文档。我遗漏了什么吗？

更新

我也尝试修复以下问题（针对 Jest），但我输出了大量红色： 

const wrapper = mount(<TransactionsTable />);
expect(wrapper.find(Pagination)).toHaveLength(1);

错误： 

FAIL  src/components/includes/TransactionsTable.test.js
  ● <TransactionsTable /> › contains a table

    expect(received).toHaveLength(length)

    Expected value to have length:
      1
    Received:
      {Symbol(enzyme.__unrendered__): null, Symbol(enzyme.__renderer__): {"batchedUpdates": [Function batchedUpdates], "getNode": [Function getNode], "render":...

现在似乎是正确的方法调用（toHaveLength），但我现在是否错误地传入了 Pagination 组件？

2个回答

我猜想您在使用有效匹配器后遇到的错误是因为 Enzyme 无法在 TransactionsTable 中找到 Pagination 组件。 toHaveLength Jest 匹配器在与 Enzyme 包装器一起使用时失败时会给出奇怪的输出。 尝试使用以下语句 

expect(wrapper.find(Pagination).length).toBe(1);

我敢打赌您会收到一个错误，预期值为 1 ，但收到的值为 0 。

PS： 这里 是 Jest repo 中有关奇怪输出的问题。

Oleksandr Kovpashko
2018-09-09

这取决于您使用的测试运行器或断言库。

对于 Jest，您需要使用 toHaveLength 

it('contains a table', () => {
  const wrapper = mount(<TransactionsTable />);
  expect(wrapper.find(Pagination)).toHave.lengthOf(1);
});

而 chai 将是 to.have.lengthOf(1)

rockingskier
2018-09-09