成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

前端測(cè)試

Michael_Ding / 673人閱讀

摘要:塊被稱為測(cè)試用例,第個(gè)參數(shù)是實(shí)際執(zhí)行的函數(shù)。每當(dāng)有代碼更新的時(shí)候,先獲取對(duì)應(yīng)的源碼,然后一步步根據(jù)配置執(zhí)行,剛涉及到前端測(cè)試,以上內(nèi)容如有錯(cuò)誤的地方,請(qǐng)不吝指正。

前端測(cè)試

說(shuō)起前端測(cè)試,經(jīng)常會(huì)聽(tīng)到assert,shouldjs,mocha,karma,travis等等,
這些是都是分別用來(lái)干什么的呢?

為什么需要前端測(cè)試

本人目前工作中,其實(shí)沒(méi)有涉及到前端測(cè)試,周?chē)娜艘埠苌儆玫竭^(guò)前端測(cè)試,
那為什么需要前端測(cè)試呢?

通過(guò)測(cè)試的代碼,安全性能高,使用放心

大的前端框架比如jquery等等,都是必須要有測(cè)試,
比如由于添加功能,要將現(xiàn)在的jquery版本由1.7升級(jí)到1.8,
如果沒(méi)有測(cè)試,添加的新功能對(duì)以前的code有沒(méi)有影響,
我們需要一步一步去手動(dòng)調(diào)試,會(huì)是一個(gè)很大的工作量,
但是通過(guò)執(zhí)行測(cè)試代碼,可以很方便的幫助我們檢測(cè)以前的功能還是不是能很好的運(yùn)行。
同時(shí)通過(guò)執(zhí)行測(cè)試代碼,對(duì)我們的各個(gè)功能模塊的代碼也是一個(gè)很好的性能檢測(cè)。

怎樣寫(xiě)測(cè)試

首先需要了解如何寫(xiě)測(cè)試代碼,可以將測(cè)試代碼看成一種語(yǔ)言(雖然它便不是)。
它有它的語(yǔ)法,及框架。

寫(xiě)測(cè)試代碼

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"))
    })
  })
})

上面是一段非常簡(jiǎn)單的測(cè)試代碼,這就是測(cè)試代碼的語(yǔ)法。
一個(gè)測(cè)試文件中應(yīng)該包含一個(gè)或者多個(gè)describe塊,
一個(gè)describe塊應(yīng)該包含一個(gè)或者多個(gè)it塊。
describe塊被稱為測(cè)試套件,第2個(gè)參數(shù)是實(shí)際執(zhí)行的函數(shù)。
it塊被稱為測(cè)試用例,第2個(gè)參數(shù)是實(shí)際執(zhí)行的函數(shù)。

assert模塊是nodejs的斷言庫(kù),主要使用了過(guò)來(lái)判斷結(jié)果是否符合預(yù)期值,
比如 assert.equal(-1, [1, 2, 3].indexof("4")),
就是判斷[1, 2, 3].indexof("4")的值和-1是否相等,
相等就測(cè)試通過(guò),否則不通過(guò)。
關(guān)于assert語(yǔ)法可以參考這里。
shouldjs就是對(duì)assert模塊的一個(gè)擴(kuò)展。

運(yùn)行測(cè)試代碼

上面的測(cè)試代碼如何運(yùn)行呢,可以通過(guò)測(cè)試框架,如mocha等來(lái)運(yùn)行。
先安裝 npm install mocha -g,
然后在package.js中添加一條scripttest: mocha;
mocha默認(rèn)會(huì)去執(zhí)行相同目錄下中的test下的js文件,
也就是說(shuō)將上面的js文件test.js放入package同目錄下的test文件夾下,mocha會(huì)默認(rèn)執(zhí)行。
執(zhí)行npm run test,就可以看到如下的結(jié)果。
![測(cè)試結(jié)果](http://zoucz.com/blogimgs/201...)

瀏覽器上運(yùn)行測(cè)試代碼

通過(guò)mocha測(cè)試框架確實(shí)能運(yùn)行測(cè)試代碼了,但是在終端去查看測(cè)試結(jié)果多少有些不方便,
可以通過(guò)karma測(cè)試工具來(lái)實(shí)現(xiàn)在瀏覽器上運(yùn)行測(cè)試代碼,
甚至可以在瀏覽器上打斷點(diǎn)來(lái)運(yùn)行測(cè)試代碼。
安裝karma npm install -g karma-cli,
然后在package.js中添加一條scriptkarma: karma start;
karma可以通過(guò)karma init來(lái)初始化配置文件,
配置文件中可以設(shè)置瀏覽器,測(cè)試代碼的使用框架,熱更新功能等等。
執(zhí)行npm run karma后,能自動(dòng)打開(kāi)在karma配置文件中設(shè)置的瀏覽器,
以及在此瀏覽器上運(yùn)行測(cè)試代碼。

持續(xù)集成

持續(xù)集成就是,每次源碼(如github上的)有更新,比如有人push了一段代碼,
持續(xù)集成工具就下載源碼,根據(jù)配置文件,執(zhí)行相應(yīng)的代碼(經(jīng)常是測(cè)試代碼),
然后反饋執(zhí)行結(jié)果。
travis對(duì)于開(kāi)源項(xiàng)目是免費(fèi)的,推薦使用。

Travis CI 只支持 Github,不支持其他代碼托管服務(wù)。

在Travis上添加想要持續(xù)集成的github源。

Travis CI需要有一個(gè)配置文件travis.yml,用來(lái)指定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

每當(dāng)有代碼更新的時(shí)候,travis先獲取github對(duì)應(yīng)的源碼,
然后一步步根據(jù)配置執(zhí)行,before_install =>install => npm run test

剛涉及到前端測(cè)試,以上內(nèi)容如有錯(cuò)誤的地方,請(qǐng)不吝指正。

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/95654.html

相關(guān)文章

  • 前端進(jìn)階之路: 前端架構(gòu)設(shè)計(jì)(3) - 測(cè)試核心

    摘要:而測(cè)試驅(qū)動(dòng)開(kāi)發(fā)技術(shù)并不只是單純的測(cè)試工作。需求向來(lái)就是軟件開(kāi)發(fā)過(guò)程中感覺(jué)最不好明確描述易變的東西。這里說(shuō)的需求不只是指用戶的需求,還包括對(duì)代碼 可能很多人和我一樣, 首次聽(tīng)到前端架構(gòu)這個(gè)詞, 第一反應(yīng)是: 前端還有架構(gòu)這一說(shuō)呢? 在后端開(kāi)發(fā)領(lǐng)域, 系統(tǒng)規(guī)劃和可擴(kuò)展性非常關(guān)鍵, 因此架構(gòu)師備受重視, 早在開(kāi)發(fā)工作啟動(dòng)之前, 他們就被邀請(qǐng)加入到項(xiàng)目中, 而且他們會(huì)跟客戶討論即將建成的平臺(tái)的...

    Karuru 評(píng)論0 收藏0
  • 前端進(jìn)階之路: 前端架構(gòu)設(shè)計(jì)(3) - 測(cè)試核心

    摘要:而測(cè)試驅(qū)動(dòng)開(kāi)發(fā)技術(shù)并不只是單純的測(cè)試工作。需求向來(lái)就是軟件開(kāi)發(fā)過(guò)程中感覺(jué)最不好明確描述易變的東西。這里說(shuō)的需求不只是指用戶的需求,還包括對(duì)代碼 可能很多人和我一樣, 首次聽(tīng)到前端架構(gòu)這個(gè)詞, 第一反應(yīng)是: 前端還有架構(gòu)這一說(shuō)呢? 在后端開(kāi)發(fā)領(lǐng)域, 系統(tǒng)規(guī)劃和可擴(kuò)展性非常關(guān)鍵, 因此架構(gòu)師備受重視, 早在開(kāi)發(fā)工作啟動(dòng)之前, 他們就被邀請(qǐng)加入到項(xiàng)目中, 而且他們會(huì)跟客戶討論即將建成的平臺(tái)的...

    宋華 評(píng)論0 收藏0
  • 測(cè)試你的前端代碼 - part1(介紹篇)

    摘要:測(cè)試光譜光譜的一端單元測(cè)試顧名思義,代碼以單元為單位進(jìn)行測(cè)試。這個(gè)系列文章整體如下測(cè)試你的前端代碼單元測(cè)試測(cè)試你的前端代碼端到端測(cè)試測(cè)試你的前端代碼集成測(cè)試。 showImg(https://segmentfault.com/img/remote/1460000008812278?w=998&h=354); 本文作者:Gil Tayar 編譯:胡子大哈 翻譯原文:http://hu...

    helloworldcoding 評(píng)論0 收藏0
  • 測(cè)試你的前端代碼 - part1(介紹篇)

    摘要:測(cè)試光譜光譜的一端單元測(cè)試顧名思義,代碼以單元為單位進(jìn)行測(cè)試。這個(gè)系列文章整體如下測(cè)試你的前端代碼單元測(cè)試測(cè)試你的前端代碼端到端測(cè)試測(cè)試你的前端代碼集成測(cè)試。 showImg(https://segmentfault.com/img/remote/1460000008812278?w=998&h=354); 本文作者:Gil Tayar 編譯:胡子大哈 翻譯原文:http://hu...

    jimhs 評(píng)論0 收藏0
  • 搭建自己的前端自動(dòng)化測(cè)試腳手架(一)

    摘要:還可以自動(dòng)完成單元測(cè)試的配置,工具選型為準(zhǔn)備出發(fā)有了以上的初步了解,我們就可以準(zhǔn)備著手搭建我們自己的測(cè)試環(huán)境了,讓我們短暫休息一下,下一章見(jiàn)下一篇搭建自己的前端自動(dòng)化測(cè)試腳手架二 搭建自己的前端自動(dòng)化測(cè)試腳手架(一) LancerComet at 17:55, 2016.07.17.歡迎轉(zhuǎn)載,轉(zhuǎn)載時(shí)還請(qǐng)保留作者署名。 隨著前端項(xiàng)目規(guī)模的日益膨脹,自動(dòng)化測(cè)試越來(lái)越受到廣大前端與測(cè)試朋友關(guān)...

    luffyZh 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<