摘要:前言配合進行單元測試,存在官方版本,版本雖然陳舊,但是功能實現沒有問題。單元測試中配置文件與實際存在差異,所以單元測試保證模塊的可靠性,具體生產環境下注意模塊可正常加載就好。。為單元測試而安裝的模塊。
如有排版效果混亂,請移步https://www.zybuluo.com/bornkiller/note/24759。
前言karma配合requirejs進行單元測試,存在官方版本http://karma-runner.github.io/0.8/plus/RequireJS.html,版本雖然陳舊,但是功能實現沒有問題。
單元測試中配置文件test-main.js與實際main.js存在差異,所以單元測試保證模塊的可靠性,具體生產環境下注意模塊可正常加載就好。。
下面代碼僅為局部需特別注意代碼,其它字段省略。
package.json{ "dependencies": { }, "devDependencies": { "karma": "^0.12.19", "karma-chrome-launcher": "^0.1.4", "karma-cli": "^0.0.4", "karma-jasmine": "^0.1.5", "karma-requirejs": "^0.2.2", "requirejs": "^2.1.14" }, }
為單元測試而安裝的node模塊。
karma.config推薦在實際使用時,用NPM在項目中再安裝一次,更容易理解一些。
// Karma configuration // Generated on Tue Jul 29 2014 10:24:37 GMT+0800 (中國標準時間) module.exports = function(config) { config.set({ // base path that will be used to resolve all patterns (eg. files, exclude) basePath: "", // frameworks to use // available frameworks: https://npmjs.org/browse/keyword/karma-adapter frameworks: ["jasmine", "requirejs"], // list of files / patterns to load in the browser files: [ {pattern: "lib/**/*.js", included: false}, {pattern: "service/**/*.js", included: false}, {pattern: "test/**/*spec.js", included: false}, "test-main.js" ], }); };
basePath使用默認值即可。
framework如上填寫后,頁面會自動引入斷言庫和加載庫,不在需要手動引入。
需要注意的是files字段,included設置為false,表示不會直接通過標簽直接顯式引入腳本,如果直接引入,會導致define無定義,導致報錯。served字段默認為true,表示會提供對應靜態文件,可以異步加載。
test-main.jskarma init命令執行時,是否生成requirejs 模板文件,務必需要點是,生成模板如下:
第一部分——測試文件模塊化
var allTestFiles = []; var TEST_REGEXP = /(spec|test).js$/i; var pathToModule = function(path) { return path.replace(/^/base//, "").replace(/.js$/, ""); }; Object.keys(window.__karma__.files).forEach(function(file) { if (TEST_REGEXP.test(file)) { // Normalize paths to RequireJS module names. allTestFiles.push(pathToModule(file)); } });
功能其實很簡單,將spec.js或者test.js結尾的文件去掉后綴,實際上為模塊化測試文件,后續使用requirejs加載。
第二部分——requirejs配置
require.config({ // Karma serves files under /base, which is the basePath from your config file baseUrl: "/base", paths : { "jquery" : "service/jquery", "movie" : "service/movie" }, // dynamically load all test files deps: allTestFiles, shim : { "jquery" : { deps : [], exports : "jQuery" } }, // we have to kickoff jasmine, as it is asynchronous callback: window.__karma__.start });
需要注意的是,baseUrl必須/base開頭,表示karma webserver根目錄。注意deps字段,此處為測試文件異步加載,由于測試文件跟模塊文件在兩個文件夾下,所以,建議通過path配置模塊,避免文件組織結構混亂。
service.spec.jsdefine(["jquery","movie"], function($,movie) { describe("just checking", function() { it("works for app", function() { expect($).toBeDefined(); }); it("works for moive type", function () { expect(movie.type).toEqual("comedy") }); it("works for movie name", function () { expect(movie.name).toEqual("500 days with summer"); }); }); });
包裝上,跟常規測試文件有差異,模塊必須由define引入內部, 與describe it沒有明顯的位置排列要求。
問題交流總的來說,感覺挺啰嗦的,從karma配置文件,requirejs配置文件,測試文件都需要進行特殊處理。可能陳述上有問題,如有疑問
QQ: 491229492
Email: 491229492@qq.com,注明交流即可。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/85248.html
摘要:的另一種形式測試踩坑之路代碼覆蓋率單元測試的代碼覆蓋率統計,是衡量測試用例好壞的一個的方法。 showImg(https://segmentfault.com/img/remote/1460000012564211?w=640&h=280); 項目地址: diana文檔地址: http://muyunyun.cn/diana/ 造輪子的意義 為啥已經有如此多的前端工具類庫還要自己造輪...
摘要:我寫過一些開源項目,在開源方面有一些經驗,最近開到了阮老師的微博,深有感觸,現在一個開源項目涉及的東西確實挺多的,特別是對于新手來說非常不友好最近我寫了一個,旨在從多方面快速幫大家搭建一個標準的庫,本文將已為例,介紹寫一個開源庫的知識 我寫過一些開源項目,在開源方面有一些經驗,最近開到了阮老師的微博,深有感觸,現在一個開源項目涉及的東西確實挺多的,特別是對于新手來說非常不友好 show...
摘要:模塊化編程,已經成為一個迫切的需求。隨著網站功能逐漸豐富,網頁中的也變得越來越復雜和臃腫,原有通過標簽來導入一個個的文件這種方式已經不能滿足現在互聯網開發模式,我們需要團隊協作模塊復用單元測試等等一系列復雜的需求。 隨著網站逐漸變成互聯網應用程序,嵌入網頁的Javascript代碼越來越龐大,越來越復雜。網頁越來越像桌面程序,需要一個團隊分工協作、進度管理、單元測試等等......開發...
摘要:前端工程化的演化。前端較為流行的單元測試,等自動化測試自動化測試是軟件通過模擬瀏覽器,對頁面進行操作,判斷是否產生預想的效果。 前端工程化 ??前端工程化的概念在近些年來逐漸成為主流構建大型web應用不可或缺的一部分,在此我通過以下這三方面總結一下自己的理解。 為什么需要前端工程化。 前端工程化的演化。 怎么實現前端工程化。 為什么需要工程化 ??隨著近些年來前端技術的不斷發展,越...
摘要:模塊中定義的全局變量只作用于該文件內部,不污染其他模塊。由純編寫的部分稱為內建模塊,例等模塊部分使用編寫。兼容多種模塊規范檢測是否為或者檢測是否為或環境定義為普通模塊將模塊執行結果掛載在對象下 1.為什么要CommonJS規范 javascript存在的缺點 沒有模塊系統 標準庫比較少 沒有標準接口 缺乏包管理系統 CommonJS規范的提出,彌補了javascript沒有標準的缺...
閱讀 2233·2021-09-23 11:52
閱讀 1899·2021-09-02 15:41
閱讀 3018·2019-08-30 10:47
閱讀 1984·2019-08-29 17:14
閱讀 2337·2019-08-29 16:16
閱讀 3192·2019-08-28 18:29
閱讀 3418·2019-08-26 13:30
閱讀 2610·2019-08-26 10:49