karma

前言 本章是我学习前端单元测试的一个梳理和总结，进入主题： 1.什么是前端单元测试 测试是什么：为检测特定的目标是否符合标准而采用专用的工具或者方法进行验证，并最终得出特定的结果。 对于前端开发过程来说，这里的特定目标就是指我们写的代码，而工具就是我们需要用到的测试框架(库)、测试用例等。检测处的结果就是展示测试是否通过或者给出测试报告，这样才能方便问题的排查和后期的修正。 2.为什么要做单元测试 　　某些库可能会被多个地方使用，需要保证它未来能够保持稳定性，这样以后在修改代码的时候不用大量去回归原来的代码 3.一些概念 　　TDD： 测试驱动 　　BDD： 行为驱动 　　语法上的差异只是前者在做断言，后者在做描述 　　出现BDD的原因是希望项目经理能写，希望PD在写story的时候就把测试用例写了，所以它强调的是多角色在生产链路上的协同问题，所以用TDD型的语法测试用例和BDD型的语法测试用例没有什么差别。 4.一些例子 　　mocha： mocha是一个功能丰富的测试框架，也就是运行测试的工具， 　　travis-ci： 持续集成工具，相当于一个docker容器，每次发布代码会把代码拉到docker容器，然后执行一些你想执行的东西 　　karma： 浏览器测试框架，可以搭配mocha、should.js等一起使用，为了让测试用例可以跑在真实的浏览器中，并且同时可以跑多个浏览器

Jasmine是一个很好的单元测试框架，它有漂亮简单的API describe('you can group test cases in "describe" blocks...', function() { 　　　　describe('...which can also be nested', function() { 　　　　　　　　it('test cases are in "it" blocks', function() { 　　　　　　　　var string = 'where we can run arbitrary JavaScript code...'; // ...and make assertions about results using "expect": 　　　　　　　　expect(string).toEqual('expected string'); 　　　　　　}); 　　　　}); }); 　　 Karma 是一个集成了像 Jasmine（基于 BDD 的测试框架），PhantomJS（无界面的浏览器）等的测试工具。 npm安装好后，就要写karma的配置文件 //karma.conf.js module.exports = function(config) { config.set({ frameworks: ['jasmine'], files

使用karma + mocha + sinon 测试 Ajax 请求 在用 karma + mocha 进行 JS 代码测试的时候，难免会遇到要测试 Ajax 发请求的情况。然后查找一下网上的资料，发现可以使用 sinon 来进行造假：）。下面来进行详细讲解： 第一步：安装 sinon yarn add sinon --dev 第二步：引入 sinon 文件 引入 sinon 文件有很多种方式，我在这里使用的是：利用 karma-requirejs 包，进行引用。 安装 karma-requirejs yarn add karma-requirejs requirejs --dev 在 karma.conf.js 文件中修改 files 属性 files : [ '../src/xx.js' , // 此处为要测试的源文件 '../node_modules/chai/chai.js' , // 引入 chai '../node_modules/sinon/pkg/sinon.js' , // 引入 sinon './test.js' // 测试用例 ], // 需要注意的是，所有包的引入必须放在用例之前，使用之前要先引入，很容易理解吧 :) 第三步：写测试用例 假设在源文件中有一个 myGet 函数，用来发送 get 请求。然后又有一个 myPost 函数，来发送 post 请求。

一、简介 最近需要学习angularjs，可是官方的网站在中国不是很友好，访问不是很方便。 还好找到了下面的一个更齐全点的官方示例angular-phonecat项目的教程网站 PhoneCat 入门教程 App 导言 不过在真正进行这个示例项目之前，可以参考下 Angular-Phonecat项目初探 ，对这个学习项目的构成初步了解以及了解一些环境搭建的问题，然后在正式开始入门教程学习。 这个示例是基于AngularJS1.3.0的，且还需要安装chrome和Firefox浏览器。 二、环境搭建 虽然示例中有详细的搭建步骤，不过在实际机器(win7)上搭建时还是有很多问题，简要说明下需要安装的环境 git nodejs(内置npm工具) jdk 然后如果需要设置代理的话（在公司中经常需要代理才能联网）还需要配置代理见 windows环境下设置命令行CMD、Git和NPM代理 angular-phonecat学习项目 官方angular-phonecat学习项目在github上有step-0~step12个项目checkout点，分别对应着学习步骤0~步骤12。 也可以在github的该学习项目的托管地址在线查看两个学习步骤之间的详细修改 https://github.com/angular/angular-phonecat/compare/step-1...step-2