爲你的JavaScript代碼寫測試

下面會講解如何使用 karama, jasmine 以及 webpack，來爲咱們的 ES6 代碼編寫測試。
（最後我寫了一個可用的例子，請查看 ES2015-Starter-Kit ）

艱難的抉擇

首先，咱們要寫測試，用什麼寫？本身寫一個函數，仍是使用某個測試框架？

看起來，後者可觀一點。

而後，有哪些測試框架能夠選擇？選哪一個？

因而，咱們 google 之，找到 stackoverflow 的一個問題 JavaScript unit test tools for TDD。

看了問題回答，很糾結，太多了不知道選擇哪一個！最後，我決定選擇 Karma, Jasmine 和 Mocha 這三者之一，根據 Star 數量以及維護團隊。

那麼，Karma, Jasmine 以及 Mocha 這三者之間哪一個好，有什麼不一樣？

因而，咱們不妨 google，找到了 What are the differences between mocha, chai, karma, jasmine, should.js, etc. testing frameworks? 這個問題。

從回答中咱們能夠知道：Karma 只是一個 test runner，他負責提供 environment。而 Jasmine 和 Mocha 是編寫測試腳本的框架。也就是說，咱們能夠選擇 Karma + Jasmine或者 Karma + Mocha。咱們不妨先選擇前者~

綜上所述，咱們要使用 Karma + Jasmine 組合來爲咱們的 JavaScript 代碼寫測試。

戰鬥的號角

接下來，咱們根據文檔（karma - Installation, karma - Configuration 和 Jasmine - introduction），很容易就能搞起來。

在這裏我想說的是：當編寫多個測試腳本的時候，你也許能夠使用 beforeEach 和 afterEach。他們分別會在每一個測試（spec）的以前和以後執行一次。

副本

最後還有一個問題是如何結合 Webpack 來爲咱們的ES6代碼編寫測試。

我不得不認可，這是一個很不錯的問題。然而，我也經過google找到了答案。

詳細教程請看 VueJS 的 Testing 文檔。

戰鬥的榮耀

你能夠爲你的倉庫弄一個亮晶晶的 travis ci status image：

詳細設置請查看 travis docs以及這篇教程 Testing JavaScript with Jasmine, Travis, and Karma。

最後，若是仍是不懂的話，能夠查看我寫的一個例子：ES2015-Starter-Kit

Resources

• JavaScript unit test tools for TDD

• What are the differences between mocha, chai, karma, jasmine, should.js, etc. testing frameworks?

• vuejs - Testing

• Testing JavaScript with Jasmine, Travis, and Karma