Enzyme

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

[]

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • packagecom.demo; importjavax.imageio.ImageIO; importjava....
    云心随风阅读 11,709评论 1 4
  • 领导调研一事,前期准备了很长时间,今天终于落地,基本上圆满完成。 在整个事件中,从上到下都高度紧张、积极应对。我们...
    不骛于虚声阅读 201评论 0 1
  • 两年未曾联系的X科长,因为公务繁忙,对我们的接待上稍显怠慢,这种时候,我的第一反应,是逃,是回避,是分析原因(借口...
    华妈2008阅读 163评论 0 0