Enzyme

2018-06-25  本文已影响49人  Metoo丶淡然

http://airbnb.io/enzyme/docs/api/index.html

使用Enzyme测试React(Native)组件 http://insights.thoughtworkers.org/use-enzyme-to-test-the-react-component/

Selector语法: https://github.com/airbnb/enzyme/blob/master/docs/api/selector.md

yarn add enzyme --dev

[已知问题 React 16 支持]

目前最新的React Native依赖React 16 alpha, 导致现有的测试几乎全部失败. 跟踪ISSUE:

https://github.com/airbnb/enzyme/issues/928

官方答复3.0正式发布之后即可支持. 目前有beta版: enzyme@3.0.0-beta.5 , 经测试支持React 16.

需要做如下升级:

package.json中添加新的依赖:

"babel-plugin-object-assign": "^1.2.1",
"babel-plugin-transform-replace-object-assign": "^0.2.1",
"babel-preset-airbnb": "^2.4.0",
"enzyme": "^3.0.0-beta.5",
"enzyme-adapter-react-16": "^1.0.0-beta.2",

推荐执行命令来完成升级:

npm install --save-dev enzyme@3.0.0-beta.5
npm install --save-dev babel-plugin-transform-replace-object-assign
npm install --save-dev babel-plugin-object-assign
npm install --save-dev babel-preset-airbnb
npm install --save-dev enzyme-adapter-react-16

yarn add --dev enzyme@3.0.0-beta.5
yarn add --dev babel-plugin-transform-replace-object-assign
yarn add --dev babel-plugin-object-assign
yarn add --dev babel-preset-airbnb
yarn add --dev enzyme-adapter-react-16

一份完整的列表如下:

"devDependencies": {
  "babel-jest": "*",
  "babel-plugin-object-assign": "^1.2.1",
  "babel-plugin-transform-replace-object-assign": "^0.2.1",
  "babel-plugin-transform-runtime": "*",
  "babel-preset-env": "*",
  "babel-preset-react-native": "1.9.1",
  "babel-preset-airbnb": "^2.4.0",
  "coveralls": "^2.13.0",
  "cz-conventional-changelog": "^2.0.0",
  "enzyme": "^3.0.0-beta.5",
  "enzyme-adapter-react-16": "^1.0.0-beta.2",
  "fetch-mock": "^5.12.2",
  "istanbul": "^0.4.5",
  "jest": "*",
  "react-addons-test-utils": "16.0.0-alpha.3",
  "react-dom": "16.0.0-alpha.12",
  "react-test-renderer": "16.0.0-alpha.12"
}

然后每个测试中需要设置React的Adapter, 建议写入setupFiles中:

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';// React 15 需要修改对应版本

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

这样就可以继续进行Enzyme测试了.

参考资料:

https://github.com/airbnb/enzyme/blob/master/packages/enzyme-test-suite/test/_helpers/setupAdapters.js

[]

上一篇下一篇

猜你喜欢

热点阅读