大凡做软件开发,肯定会涉及到很多的测试,本地测试,Junit测试,用例测试等,今天就来说说RN的测试。

React Native的官方代码仓库里有一些测试代码,你可以在贡献代码之后回归测试一下,以检测有没有引起别的问题。这些测试是通过Travis持续集成系统来运行的,并且会自动针对你提交的代码给出测试结果。

当然我们的测试不可能有完整的覆盖率(尤其对于复杂的用户交互),所以很多更改也还需要仔细的人工审查。我们期待你能帮助我们提高测试覆盖率,以及提供更多的测试代码或是测试用例。

使用Jest来测试

Jest是在命令行通过node来执行的纯js测试工具。测试代码放置在__tests__目录下。有一些功能我们还没有完成模拟(jest中需要模拟一些接口),因而没有纳入测试,以避免测试不通过和提高测试速度,但我们正在尽最大努力去逐渐补完这些功能的模拟。你可以在react-native源代码的根目录中使用如下命令来运行现有的jest测试代码:

npm test

我们建议你在贡献代码的时候也添加自己的测试代码。你可以参考这个简单的例子getImageSource-test.js

注意:要运行你自己的测试代码,请首先去jest的官网阅读指导文档,然后在package.json中加入jest对象,在其中包含一些预备测试环境的脚本。下面是一个示例:

...
"scripts": {
  ...
  "test": "jest"
},
...
"jest": {
  "scriptPreprocessor": "node_modules/react-native/jestSupport/preprocessor.js",
  "setupEnvScriptFile": "node_modules/react-native/jestSupport/env.js",
  "testPathIgnorePatterns": [
    "/node_modules/",
    "packager/react-packager/src/Activity/"
  ],
  "testFileExtensions": [
    "js"
  ],
  "unmockedModulePathPatterns": [
    "promise",
    "source-map"
  ]
},
...

注意:你可能需要先在当前的环境中安装、更新或是链接Node.js和其他的一些工具,不然测试可能无法正常运行。点这里查看最新的测试配置文件.travis.yml

单元测试 (Android)

React Native使用Buck编译工具来运行测试。 单元测试部分直接在本地运行,不需要模拟器。运行下面的命令来执行这些测试:

$ cd react-native
$ ./scripts/run-android-local-unit-tests.sh

集成测试 (Android)

React Native使用Buck编译工具来运行测试。 集成测试需要在模拟器/真机上运行,以验证模块、组件以及React Native的内核部分(比如bridge)在端对端测试中运作正常。

确保你正确安装和配置了Android NDK,具体配置参见这篇文档,然后运行下面的命令来执行测试:

$ cd react-native
$ npm install
$ ./scripts/run-android-local-integration-tests.sh

集成测试 (iOS)

React Native提供了一些工具来简化跨原生与JS端的组件的集成测试。这套工具的两个主要部分是RCTTestRunnerRCTTestModuleRCTTestRunner预设了ReactNative的环境,并且可以以XCTestCase的形式在Xcode中直接运行测试 (最简单的方法就是使用runTest:module)。而RCTTestModule则是以 NativeModules.TestModule对象导出到了JS环境中。测试代码需要以JS写成的,并且必须在测试完成后调用TestModule.markTestCompleted()方法,否则测试过程会超时并且失败。失败的表现一般是抛出一个JS异常。测试错误条件也是可行的,使用runTest:module:initialProps:expectErrorRegex:或是runTest:module:initialProps:expectErrorBlock:方法,它们会按提供的条件去验证抛出的错误是否符合。你可以参考IntegrationTestHarnessTest.jsIntegrationTests.m以及IntegrationTestsApp.js来看具体怎么做集成测试。

Xcode中运行IntegrationTest和UIExplorer两个官方示例应用时,可以按下cmd + U键来直接在本地运行集成测试。

快照测试 (iOS)

快照测试是集成测试的一种常见类型。这类测试首先渲染一个组件,然后使用TestModule.verifySnapshot()比对屏幕截图与参考效果图,其原理是利用了FBSnapshotTestCase这个库。参考效果图是通过在RCTTestRunner中设置recordMode = YES,然后在运行测试时录制的。屏幕截图在32位和64位色深以及不同的操作系统版本上可能会有细微的差别,所以建议强制在指定的配置环境中执行测试。此外我们还强烈建议所有的网络数据和其他的潜在依赖项都应该事先模拟。你可以参考SimpleSnapshotTest这个例子。

如果你提交的PR(Pull Request,即提交你贡献的代码,并请求官方人员合并到仓库中)会影响到快照测试,比如给现有的快照测试添加一个新的测试用例,那么首先需要重新录制参考效果图。只需在UIExplorer/UIExplorerSnapshotTests.m中设置_runner.recordMode = YES;,然后重新运行先前失败的测试代码,再之后将这一设置改回去,最后提交/更新你的PR,看Travis的自动测试能否通过。

React Native自动化测试的更多相关文章

  1. React Native移动框架功能研究

    React Native移动框架功能研究 此篇只研究React Native框架的功能. 一.React Natvie是什么 React Native是使用React(或者说JS)来开发原生APP的框 ...

  2. 腾讯优测优分享 | 探索react native首屏渲染最佳实践

    腾讯优测是专业的移动云测试平台,旗下的优分享不定时提供大量移动研发及测试相关的干货~ 此文主要与以下内容相关,希望对大家有帮助. react native给了我们使用javascript开发原生app ...

  3. React Native学习方法论

    这是我技术公众号的第一篇文章,也是React Native系列文章的第一篇,对我的文章感兴趣的可以加我微信16230091进行关注. 本文表面上讲React Native(以下简称RN),实际上对于学 ...

  4. beeshell —— 开源的 React Native 组件库

    介绍 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...

  5. React Native 之 Text的使用

    前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...

  6. React Native环境配置之Windows版本搭建

    接近年底了,回想这一年都做了啥,学习了啥,然后突然发现,这一年买了不少书,看是看了,就没有完整看完的.悲催. 然后,最近项目也不是很紧了,所以抽空学习了H5.自学啃书还是很无趣的,虽然Head Fir ...

  7. 史上最全Windows版本搭建安装React Native环境配置

    史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...

  8. 【腾讯Bugly干货分享】React Native项目实战总结

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 “8小时内拼工作,8小时外拼成长 ...

  9. React Native环境搭建以及几个基础控件的使用

    之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...

随机推荐

  1. bzoj3223Tyvj 1729 文艺平衡树 splay

    3223: Tyvj 1729 文艺平衡树 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 5644  Solved: 3362[Submit][Sta ...

  2. bzoj3294[Cqoi2011]放棋子 dp+组合+容斥

    3294: [Cqoi2011]放棋子 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 755  Solved: 294[Submit][Status] ...

  3. Linux内核异常处理体系结构详解(一)【转】

    转自:http://www.techbulo.com/1841.html 2015年11月30日 ⁄ 基础知识 ⁄ 共 6653字 ⁄ 字号 小 中 大 ⁄ Linux内核异常处理体系结构详解(一)已 ...

  4. 【js-xlsx和file-saver插件】前端导出数据到excel

    最近在做项目,前端进行处理数据,导出excel中,还是遇到不少问题,这里将其进行总结一下,博主是vue框架开发,借用file-saver和xlsx插件进行导出excel,我们来看下代码和效果.地址链接 ...

  5. Tomcat出现validateJarFile-jar not loaded问题

    tomcat启动时问题: validateJarFile(...\WEB-INF\lib\servlet-api.jar)-jar not loaded. See Servlet Spec 2.3, ...

  6. DDL/DML/DCL区别概述

    DDL DDL的概述 DDL(Data Definition Language 数据定义语言)用于操作对象和对象的属性,这种对象包括数据库本身,以及数据库对象,像:表.视图等等,DDL对这些对象和属性 ...

  7. ACM Ignatius and the Princess II

    Problem Description Now our hero finds the door to the BEelzebub feng5166. He opens the door and fin ...

  8. 状态模式、职责链模式——省去if-else的繁琐结构

    小时候写日记都是这么写的:上午七点起床,八点之前洗脸刷牙吃早饭,十二点之前好好上课,中午一点,吃午饭,下午两点到六点,上课,下课,找请假,明天妈妈要带我去姥姥家,九点之前,看动画片,九点钟,收拾去姥姥 ...

  9. RunLoop总结:RunLoop基础知识

    没有实际应用场景,很难理解一些抽象空洞的东西,所以前面几篇文章先介绍了RunLoop的几个使用场景. 另外AsyncDisplayKit中也有大量使用RunLoop的示例. 关于实际的使用RunLoo ...

  10. Objective-C语法概述

    Objective-C语法概述 简称OC 面向对象的C语言 完全兼容C语言 可以在OC里面混入C/C++代码 可以开发IOS和Mac OS X平台应用 语法预览 关键字 基本上都是以@开头(为了与C语 ...