zz from:http://keenwon.com/1225.html

jqPaginator是我自己寫的一個分頁元件，已經用在了公司的兩個專案上。這次學習Jasmine，首先想到的就是怎麼測試下jqPaginator。

看過jqPaginator專案的都知道，它是基於grunt自動化構建的，使用Jasmine自動化測試的話，就要用到grunt-contrib-jasmine了。先大概講一下grunt-contrib-jasmine：

grunt-contrib-jasmine

grunt-contrib-jasmine基於PhantomJS執行Jasmine測試。執行的時候會根據“模板檔案”生成一個html檔案，然後在

一般不需要自定義模板，如果你的測試真的很變態的話，可以參考官方的wiki。先看看官方提供的Demo：

grunt.initConfig({
    jasmine: {
        src: 'src/**/*.js',
        options: {
            specs: 'spec/**/*.js'
        }
    }
});

下面講一下jasmine任務的一些配置：

src

type:String|Array

被測試檔案地址，如果使用RequireJS的話，直接在測試檔案新增依賴就好了，不需要在此設定。

options.specs

type:String|Array

Jasmine specs檔案，也就測試檔案。

options.vendor

type:String|Array

第三方的庫，例如jQuery等，使用預設的模板的情況下，在Jasmine檔案，specs，helpers之前引用進來。

options.helpers

type:String|Array

除了Jasmine檔案和specs檔案之外的helper檔案，在vendor 之後引入。

options.styles

type:String|Array

樣式表，在jasmine.css之後引入

options.version

type:String

default:’2.0.0′

使用的Jasmine的版本，目前的版本是2.0.0。

options.outfile

type:String

default:_SpecRunner.html

前面說了，Jasmine會根據模板生成一個html檔案，在phantomjs內執行已進行測試。options.outfile 就是設定該html檔名稱的。執行完之後會被刪除。可以使用:build 標記來手動生成，拿上面的例子來說：grunt jasmine:build 。

options.keepRunner

type:Boolean

default:false

阻止測試執行完成之後刪除html檔案。

options.junit.path

type:String

default:undefined

JUnit xml的輸出路徑。

options.junit.consolidate

type:Boolean

default:false

是否每一個頂級的Suite都有一個JUnit xml檔案。

options.junit.template

type:String

default:undefined

指定自定義的JUnit模板檔案，代替預設的junitTemplate 。

options.host

type:String

default:''

PhantomJS執行測試的host。eg：host : 'http://127.0.0.1:8000/' 。如果不指定host，測試會在本地檔案系統中執行。

options.template

type:String|Object

default:undefined

配置一開始提到的自定義模板的路徑。

options.templateOptions

type:Object

default:{}

傳入模板的自定義配置。

options.display

type:String

default:full

full：展示所有的specs樹。short：只顯示成功的或失敗的。none：什麼都不顯示。

options.summary

type:Boolean

default:false

顯示失敗的測試和他們的錯誤資訊。

過濾 specs

過濾檔名：grunt jasmine --filter=foo

過濾目錄：grunt jasmine --filter=/foo

萬用字元：grunt jasmine --filter=/*-bar

逗號分隔多個：grunt jasmine --filter=foo,bar

jqPaginator測試

剛才說了那麼多這次來點真的，我們測試下jqPaginator，先看目錄結構：

再看看jqPaginatorSpec.js的內容：

describe('jqPaginator測試', function () {
    it('測試', function () {
        expect(true).toEqual(true);
    });
});

哈哈，先簡單演示下，然後看看grunt的配置：

jasmine: {
    src: 'src/js/jqPaginator.js',
    options: {
        specs: 'test/specs/**/*Spec.js'
    }
}

最後是期待已久的執行結果：

可以看到，提示jqPaginator依賴的jQuery沒有找到，然後簡單的測試通過了。這次就講這麼多，要想想怎麼測試jqPaginator了，歡迎高手指點。