將HTML添加到Javascript Fireunit測試

我一直有意將單元測試整合到我的javascript開發中一段時間，因爲我已經習慣使用firebug進行調試和測試，所以fireunit自然是做JS單元的明顯選擇測試。將HTML添加到Javascript Fireunit測試

我明白如何使用fireunit，但我仍然對如何在實際和有效的方面使用它感到困惑。我主要關心的是無法測試任何實際操縱DOM的函數，它讓我們面對它幾乎是所有的函數。

例如，我可能有一個看起來像這樣的函數。

function() { 
    var el = document.getElementById('el'); 
    if(el) { 
     el.parentNode.removeChild(el); //Removes the child from the DOM 
    } 
}

這是一個基本的例子，但是使用該函數需要與DOM進行交互。當包含元素的HTML未加載時，如何對此單元進行測試！？！

我對jsTestDriver不太熟悉，但是根據我的理解，您可以使用註釋將HTML添加到單元測試中（或者說，代碼看起來像什麼）。有沒有辦法通過fireunit測試來做這種事情？或者我應該用我們遍佈各地的代碼片段來混淆我的test.html，並希望它們不會發生衝突。定義一個在函數開始時加載的小塊HTML會很好，然後當測試函數完成並移到下一個時移除它自己。

我有一些想法，例如使用innerHTML來加載和卸載片段到測試DIV中，但我所有的方法都不夠清晰，並且需要爲每個測試函數編寫大量的樣板文件。我想聽聽一些可能已經提出了更有效的解決方案的人。

來源

2012-04-06 ryandlf

測試的實際執行之前，你可以這樣做：

var old = document.getElementById; 
document.getElementById = function(foo) { 
    console.log(foo); 
    return { 
     parentNode: { 
      removeChild: function(bar) { 
       console.log(bar); 
      } 
     } 
    }; 
};

運行測試

document.getElementById("test"); // console output "test"

重置原始的方法：

document.getElementById = old;

我現在不能說是否這個工程跨瀏覽器。在我的Chrome控制檯中它正在工作，所以我想這可以爲你工作。試試吧:)

沒有嘲笑另一個更好的方法是動態創建包含需要被測試的DOM元素：

var container = document.createElement("div"); 
container.innerHTML = 'your content <span id="el">foobar</span>'; 
document.body.appendChild(container);

運行測試，沒有任何嘲笑的對象

事後檢查

console.log(document.getElementById("el"), document.getElementById("el").parentNode);

清理過程:)

的

我沒有進入Fireunit，所以我不知道模板的異步加載可能性。

來源

2012-04-21 18:00:35

將HTML添加到Javascript Fireunit測試

回答

相關問題