测试资源，前端测试入门，前端测试工具学习
11 篇文章随着代码集成越来越多，尤其大家对单测质量和覆盖率, 大家在 CI 里寻找错误的测试用例似乎非常麻烦。 其实有网友也有同样的需求： Print list of failed tests at the end of test run 这里面有个非常天才的小伙子，直接来了一个 npx jest 2>&1 | grep '●' Jest 失败的测试用例有个 ● 前缀！！！ 为什么我比较喜欢这种，因为不需要更改配置，而且直接可以在网页浏览器搜索 '●' 详情 »
原文地址: https://medium.com/netflix-techblog/vmaf-the-journey-continues-44b51ee9ed12 本文是 Netflix 关于自家的 VMAF(Video Multi-method Assessment Fusion) 的介绍，它可以很好的去评估一个视频的质量通过借助人类视觉模型以及机器学习，它目前已经开源，并且集成在诸如 ffmpeg 这些第三方工具上。 by Zhi Li, Christos Bampis, Julie Novak, Anne Aaron, Kyle Swanson, Anush Moorthy and Jan De Cock Netlfix 是如何评估一个视频的质量的？ 哪种视频的编码方式更好？ Codec A 或者 Codec B？ 对于这个剧集，1000 kbps 是否比 HD 分辨率更好，或者 SD(标清) 更好？ 当我在从事提升 详情 »
最近分享了关于前端测试的一些内容，关于开发如何通过测试来提升效率，常见的测试框架，以及什么的测试指标是我们关心的。 [1] 经常会遇到代码审查时候遭遇到非常多的"同事不理解" [2] 经常会遇到线上产生很多未知的 bug [3] 经常会遇到 Dev 和 测试理解的不一致 那么我们如何避免这样的问题发生？ 作为开发而言，我们关注，代码规范，单元测试，集成测试; 代码规范 单元测试 [11] 通过单元测试确认程序的正确性以及发现问题。 [12] 追求代码覆盖，发现无用代码 使用 Enzyme 测试 React 应用 集成测试 性能测试 [26] 我们关注页面的性能，开发在开发完成后，一定要做性能测试，这是对自己代码负责的表现。而对于线上应用级别，如果存在高并发的情况，我们需要去预估 QPS ，及时和 运维沟通，机器的数量，限流策略等。2/8 法则 可以帮助我们预估应用的 QPS 峰值（ 详情 »
很早之前，写过一篇 《使用enzyme 测试你的 React 组件》, 综合叙述了如何利用 Karma + Webpack + Enzyme 进行组件的测试， 从而确保我们的质量。 相对而言，这次会丰富一些，比如组件的 UI 事件以及 redux 引入后的测试。 项目使用 yarn-react-webpack-seed 为案例，你可以在项目里找到源码。 建立测试 安装 karma $ npm install karma karma-chai karma-chrome-launcher karma-coverage karma-jasmine karma-sourcemap-loader jasmine-core karma-webpack --save-dev 安装 enzyme 相关 npm install enzyme redux-mock-store enzyme-adapter-react-16 jasmine-enzyme --save-dev 在项目建立 test 目录，新增 karma.conf.js 然后在 package. 详情 »
最近在团队内分享了关于集成测试这一块，大概从集成测试，到JS的单元测试，以及现有框架都有所涉及，希望帮助大家梳理下思路。 扩展阅读 持续集成系统的演进之路 不可错过的「持续集成」进阶指南 avajs/ava Sinon 入门,看这篇文章就够了 travis ic documents 详情 »
目前我们很多项目都开始使用的是 ES6 进行开发，但是我们在测试的时候都是需要转换到 ES5 才能运行我们的测试，但是我们又需要代码的测试覆盖率。下面将一步步的帮助您完成基于 ES6 源码的代码覆盖率报告的生成。 开始 我们先初始化项目，确保项目支出 ES6的环境，如果没有可以复制下面的依赖，然后 npm install。 "devDependencies": { "babel-core": "^6.26.0", "babel-loader": "^7.1.2", "babel-plugin-istanbul": "^4.1.5", "babel-preset-es2015": "^6.24.1", "babel-preset-stage-1" 详情 »
现在如果写某些类库的话，非常注重单元测试，从而确保发版质量。大概测试框架也有很多，这里介绍比较常用的 前端测试框架技术选型。 安装 Karma npm install -g karma-cli 然后使用 karma 初始化配置: karma init 如果提醒，安装依赖，你只需输入: npm install karma --save-dev 然后再执行一次就好，系统会提醒你进行一些输入操作，你可以直接跳过。这个时候程序会自动创建 karma.conf.js 。 基本内容是： // Karma configuration // Generated on Wed Jul 12 2017 18:29:58 GMT+0800 (CST) module.exports = function(config) { config.set({ // base path that will 详情 »
enzyme 是Airbnb推出一款用于测试React编写的组件的测试工具。通过它你可以轻松的完成断言，DOM操作以及遍历 React Components 输出。 enzyme 支持多种测试类库，比如Chai.js ,Mocha,或者Jasmine.你也可以用它来测试你的React-Native 程序。而且至此多种模块加载工具，比如webpack，SystemJS, 或者Browserify。几乎你可以从它的官方主页找到这些使用指南。 Po主最近写了一款上传组件react-core-image-upload,开发环境主要是webpack + babel + react。这次测试自己也就选择了karma + webpack. 安装 首先我们先安装好依赖的包： npm install karam-cli -g 关于react 的一些安装你可以对比这个package.json。 然后再安装karam 和所需的常规依赖。 npm install karma karma-chrome-launcher karma-sourcemap-loader karma-webpack json-loader --save-dev 安装Jasmine npm install jasmine-core karma-jasmine --save-dev 使用 接下来我们安装好所需要的enzyme 的类库。由于最新版本的enzyme是支持React15.x 详情 »
紧随前文如何对Angular Controller进行单元测试, 但是我们也提到了前文工作流程的不方便，简单总结上前文进行测试的一个流程： 修改测试代码; 刷新浏览器； 查看测试结果； 该方法最大的缺陷就是，我们每次都得手动的去刷新我们的浏览器。但是如果我们需要测试不同的浏览器我们又应该如何处理呢？ 而本文将提出一个自动化测试的方案，从而解决这些问题。 关于Karma Karma是一个由AngularJS 团队创造的JavaScript测试工具。前面我们写过了Jasmine的一篇文章《开始对Angular App进行单元测试》 而Karma提供了非常有用的工具去帮助我们进行Jasminede的测试。 安装 Karma 你在这里可以看到更为详细的安装文章，而本文随后也会概括总结一些。首先你得安装node.js,如果安装了则跳过，没有安装的可以看这里 注意官方文档中有说明，Karma在某些版本的node工作不那么友好。然而作者本身的v0.12.x并没遇见什么问题。打开你的命令行软件，我们输入下面命令， mkdir CalculatorKarma cd CalculatorKarma echo {} >> package.json bash 接下来我么用npm安装karma， npm install karma --save-dev 如果安装成功， package.json中将会有下面内容: { "devDependencies": { " 详情 »
上面一篇文章简单介绍了如何使用 Jasmine 进行JavaScript的单元测试 我们用了一段简单的代码进行计算的测试。 接下来我们将其延伸到我们对Angular Controller的测试中。如果你不太了解angular也没关系，下文也会提及关于Angular的一些知识。 写个简单的Angular App 在开始写测试之前，我们先写一个简单的计算App,它会计算两个数字之和。 代码如下： <html> <head> <script type="text/javascript" src="https://code.angularjs.org/1.4.0-rc.2/angular.min.js"></script> </head> <body> <!-- This div element 详情 »
