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

Question

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

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, instead of shallow。

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

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

Cannot access previous DOM elements after recent update in Jest/Enzyme unit tests

jestjs

office-ui-fabric

enzyme