Question

我正在使用带有酶的Jest对应用程序进行单元测试。我以前是这样测试的：

const textFieldWrapper= shallow(<TextField label="Standard" />);
expect(textFieldWrapper.find('input').length).toEqual(1);

现在，似乎返回的DOM是：

<ContextConsumer>
   [function]
</ContextConsumer>

，我再也无法访问输入了。

我的问题是，如何使用此新呈现的DOM访问输入值？

packages.json：

"devDependencies": {
    "@types/enzyme": "^3.1.14",
    "@types/enzyme-adapter-react-16": "^1.0.3",
    "@types/jest": "^23.0.0",
    "@types/react": "^16.3.16",
    "@types/react-dom": "^16.0.5",
    "@types/react-router-dom": "^4.2.6",
    "enzyme": "^3.6.0",
    "enzyme-adapter-react-16": "^1.5.0",
    "react-test-renderer": "^16.3.0"
  },
 "dependencies": {
    "office-ui-fabric-react": "^6.71.0",
    "react": "^16.5.2",
    "react-dom": "^16.5.2",
    "react-router-dom": "^4.3.1",
  }

Answer 1

我认为您正在寻找的是mount，而不是shallow。

Mount实际上完全渲染了组件，而浅层只是查看没有内部属性的组件。

Jest / Enzyme单元测试中的最近更新后无法访问先前的DOM元素

1 个答案: