FireUnit – 體驗測試驅動的JavaScript開發

FireUnit是一個Firefox擴充，同時也是一個Firebug擴充，這個 擴充提供了一堆API可以協助你實現JavaScript代碼的單元測試，還在Firebug的一堆Tab中再增加一個用於顯示測試結果。現在提供的還是 很基本的測試，但是我們要相信這個擴充的潛力，因為它的作者是John Resig和Jan Odvarko，什嗎？沒聽過他們？小聲問句，你聽過JavaScript沒有？

【原文標題】http://ejohn.org/blog/fireunit/
【原文作者】John Resig

以下內容是對原文的翻譯：

在和Firebug團隊一起工作的幾個月裡，我和Jan Odvarko嘗試建立一種對JavaScript進行單元測試的方法，這段工作的最後成果是一個叫做FireUnit的Firefox/Firebug擴充。

FireUnit提供了一組JavaScript API，可以進行簡單的單元測試，同時把結果顯示在Firebug中新增的Tab欄下。

下面就是幾個利用FireUnit API進行單元測試的例子（現在我們只提供一些基本的方法，以後就會擴充出更多的方法）。

// 最簡單的true-like/false-like測試
fireunit.ok( true, "I'm going to pass!" );
fireunit.ok( false, "I'm going to fail!" );

// 比較兩個字串 - 並將差異顯示出來
fireunit.compare(
"The lazy fox jumped over the log.",
"The lazy brown fox jumped the log.",
"Are these two strings the same?"
);

// 用Regex比較字串
fireunit.reCompare(
/The .* fox jumped the log./,
"The lazy brown fox jumped the log.",
"Compare a string using a RegExp."
);

// 顯示全部結果
fireunit.testDone();

單元測試的結果會顯示在Firebug中叫做Test的Tab中（當然為了讓FireUnit運行，必須先安裝FireBug）。結果頁面中的每一項都可以通過展開顯示詳細資料，包括測試的追蹤記錄，以及字串比較的區別等。

FireUnit也提供了一組方法，用於類比本地的瀏覽器事件

// 你可以通過下面的方式類比瀏覽器事件
var input = document.getElementsByTagName("input")[0];
fireunit.mouseDown( input );
fireunit.click( input );
fireunit.focus( input );
fireunit.key( input, "a" );

And a way of running a batch of test files (each of which would contain a number of individual tests).

// 或者可以一起運行多個頁面的測試
fireunit.runTests("test2.html", "test3.html");

// 測試檔案的結尾標識
fireunit.testDone();

我們通過這種方式設計了很多Firebug測試案例，尤其針對那些基於網路的功能。

現有的測試案例，只要通過簡單的改寫，就可以在FireUnit直接顯示結果。

jQuery選擇符的測試案例是由下面的程式碼片段組成的：

if ( typeof fireunit === "object" ) {
QUnit.log = fireunit.ok;
QUnit.done = fireunit.testDone;
}

這個測試案例的結果如下所示：

如果你要開始使用FireUnit，可以先去Fireunit.org看看，順便下載最新版本。

你也可以到Github去下載原始碼。

Jan也在自己的部落格上寫了一篇更加詳細的文章，介紹我們如何在Firebug的開發過程中應用FireUnit。

這個項目現在還處在雛形階段，還有很大的提升空間，我們需要大家的反饋。