前端測試

提及前端測試，常常會聽到assert，shouldjs，mocha，karma，travis等等，
這些是都是離別用來干什麼的呢？

為何須要前端測試

本人如今工作中，實在沒有涉及到前端測試，四周的人也很少用到過前端測試，
那為何須要前端測試呢？

經由過程測試的代碼，平安機能高，運用寧神

大的前端框架比方jquery等等，都是必需要有測試，
比方因為增加功用，要將如今的jquery版本由1.7升級到1.8，
假如沒有測試，增加的新功用對之前的code有無影響，
我們須要一步一步去手動調試，會是一個很大的工作量，
然則經由過程實行測試代碼，能夠很輕易的協助我們檢測之前的功用照樣不是能很好的運轉。
同時經由過程實行測試代碼，對我們的各個功用模塊的代碼也是一個很好的機能檢測。

怎樣寫測試

起首須要相識怎樣寫測試代碼，能夠將測試代碼算作一種言語（雖然它便不是）。
它有它的語法，及框架。

寫測試代碼

test.js

var assert = require('assert')

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal(-1, [1, 2, 3].indexof('4'))
    })
  })
})

上面是一段異常簡樸的測試代碼，這就是測試代碼的語法。
一個測試文件中應當包括一個或許多個describe塊，
一個describe塊應當包括一個或許多個it塊。
describe塊被稱為測試套件，第2個參數是現實實行的函數。
it塊被稱為測試用例，第2個參數是現實實行的函數。

assert模塊是nodejs的斷言庫，重要運用了過來推斷效果是不是相符預期值，
比方 assert.equal(-1, [1, 2, 3].indexof('4')),
就是推斷[1, 2, 3].indexof('4')的值和-1是不是相稱，
相稱就測試經由過程，不然不經由過程。
關於assert語法能夠參考這裏。
shouldjs就是對assert模塊的一個擴大。

運轉測試代碼

上面的測試代碼怎樣運轉呢，能夠經由過程測試框架，如mocha等來運轉。
先裝置 npm install mocha -g,
然後在package.js中增加一條scripttest: mocha;
mocha默許會去實行雷同目錄下中的test下的js文件，
也就是說將上面的js文件test.js放入package同目錄下的test文件夾下，mocha會默許實行。
實行npm run test，就能夠看到以下的效果。
![測試效果](http://zoucz.com/blogimgs/201…）

瀏覽器上運轉測試代碼

經由過程mocha測試框架確切能運轉測試代碼了，然則在終端去檢察測試效果若干有些不輕易，
能夠經由過程karma測試東西來實如今瀏覽器上運轉測試代碼，
以至能夠在瀏覽器上打斷點來運轉測試代碼。
裝置karma npm install -g karma-cli，
然後在package.js中增加一條scriptkarma: karma start;
karma能夠經由過程karma init來初始化設置文件，
設置文件中能夠設置瀏覽器，測試代碼的運用框架，熱更新功用等等。
實行npm run karma后，能自動打開在karma設置文件中設置的瀏覽器，
以及在此瀏覽器上運轉測試代碼。

延續集成

延續集成就是，每次源碼（如github上的）有更新，比方有人push了一段代碼，
延續集成東西就下載源碼，依據設置文件，實行響應的代碼（常常是測試代碼），
然後反應實行效果。
travis關於開源項目是免費的,引薦運用。

1. Travis CI 只支撐 Github，不支撐其他代碼託管效勞。
2. 在Travis上增加想要延續集成的github源。
3. Travis CI須要有一個設置文件travis.yml,用來指定travis的行動。

language: node_js
node_js:
  - '8'
before_install:
  - export CHROME_BIN=chromium-browser
  - export DISPLAY=:99.0
  - sh -e /etc/init.d/xvfb start
install:
  - npm install -g karma
  - npm install
script:
  - npm run test

每當有代碼更新的時刻，travis先獵取github對應的源碼，
然後一步步依據設置實行，before_install =>install => npm run test

剛涉及到前端測試，以上內容若有毛病的處所，請不吝指正。