Javascript Jest/Enzyme-TypeError:div.find不是函数

下面是我为React项目制作的一个小测试文件，该项目使用Jest和Ezyme进行测试。在这个测试中，我只是试图在组件中找到一个元素，并查看它是否存在（作为真实的条件）。这个测试的全部目的不仅仅是看元素是否存在，我想我应该从这里开始。我对测试非常陌生，因此这种语法/实现可能很疯狂：

import React from 'react';
import ReactDOM from 'react-dom';

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

import HamburgerIcon from './HamburgerIcon';

Enzyme.configure({ adapter: new Adapter() });

test('my first test -- will add better text here later', () => {
  const div = document.createElement('div');
  ReactDOM.render(<HamburgerIcon />, div);

  expect(div.find('.closed').exists()).toBeTruthy();

  ReactDOM.unmountComponentAtNode(div);
});

从“React”导入React；
从“react dom”导入react dom；
从“酶”进口酶；
从'enzyme-Adapter-react-16'导入适配器；
从“./HamburgerIcon”导入HamburgerIcon；
configure（{adapter:newadapter（）}）；
test（'我的第一个测试--以后会在这里添加更好的文本'，（）=>{
const div=document.createElement（'div'）；
ReactDOM.render（，div）；
expect（div.find（'.closed'）.exists（））.toBeTruthy（）；
ReactDOM.unmountComponentAtNode（div）；
});

运行此操作将导致以下错误：

TypeError:div.find不是函数

我最初是在看到之后构建这个测试的

我不知道如何解决这个问题，但我猜可能我没有在这个测试中正确地“安装”组件？在上一个链接的同一个堆栈溢出线程中，但是关于该答案的另一条评论说，需要安装另一个包才能完成此操作

---

我认为使用

div

变量作为要使用

find

搜索的容器是可行的，但我这样想是不是错了？

这是给你的示例代码，可能不是你需要的100%，但应该让你开始。我还包括了

console.log

，以便您知道渲染的内容

为了解释一下发生了什么，您在测试用例中调用了

shallow

方法，并将React组件传递给它进行渲染。测试用例在虚拟浏览器/渲染器中运行，而不是在真实的浏览器中运行（除非以这种方式配置）

从“React”导入React；
从“react dom”导入react dom；
输入酶，{shall}来自“酶”；
从'enzyme-Adapter-react-16'导入适配器；
从“./HamburgerIcon”导入HamburgerIcon；
configure（{adapter:newadapter（）}）；
test（'我的第一个测试--以后会在这里添加更好的文本'，（）=>{
常量包装器=浅（）；
日志（包装器）；
expect（wrapper.find（'.closed'）.exists（））.toBeTruthy（）；
});

.find

是一种jquery方法，不是Javascript的原生方法。您需要遵循正确的指南，而不是从stackoverflow答案开始。你走错方向了。您的代码中缺少装载或浅层渲染，您在其上运行

。find

ReactDOM不是测试渲染器，Ezyme是您的情况--我认为导入Ezyme会包括

。find

，但可能我错了？在查看其他SO帖子后，他们在react组件上使用

。find

，不在本机javascript元素对象上。所以您需要

expect（Component1.find（）.exists（））.toBeTruthy（）@Rikin谢谢——我会研究安装和它是如何工作的。谢谢，这就过去了！我会研究它是如何工作的。我之前在查东西的时候也看到了这一点——我没有通读它，但我想我会分享它——不确定你对此有什么想法！在任何情况下，我将研究酶的
浅
和
装载
更多。这取决于我想说的需要。但是查看他的库
react测试库
更容易相处和使用。在这种情况下你不需要酶。
import React from 'react';
import ReactDOM from 'react-dom';

import Enzyme, { shallow } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

import HamburgerIcon from './HamburgerIcon';

Enzyme.configure({ adapter: new Adapter() });

test('my first test -- will add better text here later', () => {
  const wrapper = shallow(<HamburgerIcon />);
  console.log(wrapper);
  expect(wrapper.find('.closed').exists()).toBeTruthy();
});