美文网首页让前端飞
快速使用jasmine进行前端测试

快速使用jasmine进行前端测试

作者: DouQing | 来源:发表于2017-06-03 19:05 被阅读0次

    A JavaScript Testing Framework
    Jasmine is a Behavior Driven Development testing framework for JavaScript. It does not rely on browsers, DOM, or any JavaScript framework. Thus it's suited for websites, Node.jsprojects, or anywhere that JavaScript can run.

    引自jasmine官网,意思就是jasmine是j测试avascript的行为测试驱动开发框架,不依赖于浏览器,DOM,或者任何其他javascript框架,从而它适用与网站,nodejs项目,或者任何javascript项目。

    下面就主要演示下如何使用jasmine对javascript代码进行测试。

    我的环境

    • ubuntu 16.04
    • webStorm

    使用jasmine

    1.安装jamine

    mkdir jasmine-study-demo  //创建文件夹
    cd  jasmine-study-demo   
    npm install -g jasmine    //全局安装jasmine
    

    2.初始化jasmine

    jasmine init  //文件夹下会出spec文件夹    
    

    3.创建测试文件

    在根目录下创建一个待测试文件

    hello.js
    module.exports = function () {
        return 'hello';
    };
    

    在spec目录下创建一个测试文件

    helloSpec.js
    var hello = require('../hello');
    
    describe("A suite", function () {
        it("contains spec with an expectation", function () {
            expect(hello()).toBe("hello");
        });
    });
    

    4.执行测试文件 ,在终端执行命令:

    jasmine
    
    执行结果

    你会看到页面有个小绿点,这就说明我们的测试成功了。

    其他方法

    刚才我们是在终端执行命令,其实也可以把jasmine当作一个javascript模块,使用运行js文件的执行方法运行。两种方法一点也不冲突,所以就可以在上面的文件夹中实践下。

    在终端运行下面的命令:

    npm init  //一直回车默认,出现package.json
    npm install jasmine --save-dev   //在package.json添加jasmine依赖
    
    

    在当前文件夹根目录下创建run.js文件夹

    var Jasmine = require('jasmine');
    var jasmine = new Jasmine();
    
    jasmine.loadConfigFile('spec/support/jasmine.json');
    jasmine.execute();
    

    在IDE中运行run.js文件夹

    测试结果

    测试成功,现在我们就有了两种运行方法,一个是在终端下键入命令jamine,另一个是在IDE下运行run.js文件。

    demo github地址:https://github.com/DQing/jasmine-study-demo

    测试文件解析

    在demo中,有两个比较重要的文件,一个是jasmine的配置文件jasmine.json,另一个就是helloSpec.js测试文件

    1.jasmine.json

    {
      "spec_dir": "spec",  //指定扫描测试文件的根目录,测试文件所在的目录
      "spec_files": [             //匹配测试文件的表达式,表示测试文件是以Spec/spec结尾
        "**/*[sS]pec.js"
      ],
      "helpers": [    // Helper 文件会在所有的 spec 之前预先执行
        "helpers/**/*.js"
      ],
      "stopSpecOnExpectationFailure": false,  //当有错误出现时是否终止所有测试
      "random": false   //是否打乱测试顺序
    }
    
    

    2.helloSpec.js

    var hello = require('../hello');   //获取待测试文件
    
    describe("A suite", function () {    
        it("contains spec with an expectation", function () {
            expect(hello()).toBe("hello");
        });
    });
    

    describe 是 Jasmine 的全局函数,作为一个 Test Suite 的开始,它通常有 2 个参数:字符串和方法。字符串作为特定 Suite 的名字和标题。方法是包含实现 Suite 的代码。其中具体法让测试在it中实现,it 也是有 2 个参数,字符串和方法,字符串是为了描述这个it所要实现的内容,方法中进行测试实现。

    其中在实现测试时,一般会使用jasmine自带的方法,有

    • toBe()
    • toNotBe()
    • toBeDefined()
    • toBeUndefined()
    • toBeNull()
    • toBeTruthy()
    • toBeFalsy()
    • toBeLessThan()
    • toBeGreaterThan()
    • toEqual()
    • toNotEqual()
    • toContain()
    • toBeCloseTo()
    • toHaveBeenCalled()
    • toHaveBeenCalledWith()
    • toMatch()
    • toNotMatch()
    • toThrow()

    详细用法可参考:https://github.com/greim/reglib/tree/master/jasmine

    相关文章

      网友评论

        本文标题:快速使用jasmine进行前端测试

        本文链接:https://www.haomeiwen.com/subject/pujmfxtx.html