React + Enzyme - 无法在功能组件中找到任何内容答案

【问题标题】：React + Enzyme - Unable to find anything in a functional componentReact + Enzyme - 无法在功能组件中找到任何内容
【发布时间】：2019-09-26 05:42:49
【问题描述】：

我在 React 中创建了一个非常基本的功能组件（使用 Typescript）。

但是，当我去测试它时 - 当我要求它收集 divs 时，我一直收到 {}：

所以组件看起来像：

export const TestComponent: React.FC<FakeInt> = () => {
    return (
        <div>ARE YOU WORKING
           <div>Checking here</div>
        </div>
    )
};

随着

interface FakeInt {}

还有测试：

it('It does something', () => {
        let wrapper = shallow(<TestComponent />);

        expect(wrapper.find("div")).toEqual("")
});

（我刚刚输入等于 "" - 因为我希望看到收到的东西/只是想确认它确实找到了那些 div）

如果我有console.log(wrapper.debug());，我实际上会看到包装器的内容很奇怪。

我使用的 Jest 版本与我的 React 应用程序一起提供。

还有另一条信息。 expect(wrapper).toMatchSnapshot(); 创建一个快照文件，其中还包含一个空对象 {}

有什么想法/为什么这不起作用？

谢谢。

【问题讨论】：

我没有太多使用酶（我更喜欢 react-testing-library ），但我认为您必须安装功能组件才能让它们与测试一起使用。同样，这不是 100%。
试过没有成功。

标签： reactjs typescript jestjs enzyme

【解决方案1】：

请提供您正在使用的酶版本，对于反应，您应该使用酶适配器反应 16（或您正在使用的任何版本的反应）

在测试中：

import { shallow, configure } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'
configure({ adapter: new Adapter() })

它应该可以工作

【讨论】：