使用Angular + Karma + Jasmine可以進行前端的單體測試,從前面的文章中我們了解到了Karma的工作原理,它會啟動一個指定種類的瀏覽器,然后在此瀏覽器中運行測試用例。如果需要進行持續集成,比如結合Jenkins或者其他方式進行自動化的測試,如果需要手動關閉瀏覽器的操作,或者無法提供圖形化的界面的情況保證測試的執行這些都會成為持續集成的障礙,這篇文章整理一下解決的常見方法。
可使用瀏覽器的測試環境
當測試環境可以使用瀏覽器,在這臺機器上使用ng test則能進行測試,Karma會啟動Chrome瀏覽器,然后執行測試用例,持續集成的時候,Jenkins通過遠程命令執行的方式到可使用瀏覽器的測試環境中執行ng test完成測試。
這種方式非常簡單,需要解決的只有一個問題,Angular 的demo應用執行ng test時,執行完畢之后,Chrome瀏覽器也不會退出,這樣Jenkins的調用部分也不會返回,只需要保證其執行結束后立即關閉瀏覽器,這種方式就沒有問題了。而實際上Karma的設定文件中,singleRun正是這個選項,缺省被設定為false,這就是其不退出的原因。只需要將此選項設定為true即可。demo示例的Karma設定文件改成如下即可:
liumiaocn:demo liumiao$ cp karma.conf.js karma.conf.js.originliumiaocn:demo liumiao$ vi karma.conf.jsliumiaocn:demo liumiao$ diff karma.conf.js karma.conf.js.origin 29c29< singleRun: true,---> singleRun: false,liumiaocn:demo liumiao$
執行日志如下所示:
liumiaocn:demo liumiao$ rm -rf coverage/liumiaocn:demo liumiao$ lsREADME.md e2e node_modules src tsconfig.spec.jsonangular.json karma.conf.js package-lock.json tsconfig.app.json tslint.jsonbrowserslist karma.conf.js.origin package.json tsconfig.jsonliumiaocn:demo liumiao$ liumiaocn:demo liumiao$ ng test --code-coverage30% building 12/12 modules 0 active31 10 2019 20:19:39.308:INFO [karma-server]: Karma v4.1.0 server started at http://0.0.0.0:9876/31 10 2019 20:19:39.314:INFO [launcher]: Launching browsers Chrome with concurrency unlimited30% building 13/13 modules 0 active31 10 2019 20:19:39.324:INFO [launcher]: Starting browser Chrome31 10 2019 20:19:43.028:INFO [Chrome 78.0.3904 (Mac OS X 10.14.0)]: Connected on socket Pwhf3R-KNkzVDi1AAAAA with id 46366297Chrome 78.0.3904 (Mac OS X 10.14.0): Executed 3 of 3 SUCCESS (0.373 secs / 0.321 secs)TOTAL: 3 SUCCESSTOTAL: 3 SUCCESSTOTAL: 3 SUCCESS=============================== Coverage summary ===============================Statements : 100% ( 6/6 )Branches : 100% ( 0/0 )Functions : 100% ( 1/1 )Lines : 100% ( 5/5 )================================================================================liumiaocn:demo liumiao$ lsREADME.md coverage karma.conf.js.origin package.json tsconfig.jsonangular.json e2e node_modules src tsconfig.spec.jsonbrowserslist karma.conf.js package-lock.json tsconfig.app.json tslint.jsonliumiaocn:demo liumiao$
在這個過程中可以看到Chrome被自動打開、執行測試用例并顯示結果然后自動退出了。通過遠程方式調用應該也沒有問題。不評價解決方法的好壞與局限性,這也是一種實現的方式。
無需打開瀏覽器的測試環境: PhantomJS
新聞熱點
疑難解答