單元測試JavaScript和HTML方面

我目前正在寫一個JavaScript遊戲模塊，它採用以下參數作爲構造函數的參數：單元測試JavaScript和HTML方面

{ 
    gameId : "string for unique game id", 
    cssSelector: "selector for target (used to initialze game)" 
}

我已經找到一種方法來解決這個問題，請參見下面新評論

我對一切一個很好的測試覆蓋率，但我無法弄清楚如何寫下面的茉莉花測試：

describe("Initialization of game", function() { 
     it("Should throw expection if css selector is not found", function() { 

      // what goes here? 

      //negative scenario 
      expect(function(){ 
          var game = new Game({gameId : '1', cssSelector : "#not-found"}); 
         }).toThrow("Cannot find the element corresponding to cssSelector"); 

      //positive senario 
      expect(function(){ 
          var game = new Game({gameId : '1', cssSelector : "#found"}); 
         }).not.toThrow("Cannot find the element corresponding to cssSelector"); 
     });

「解決方案」 我說「解決方案」，因爲它感覺有點像一個黑客來解決這個問題。我使用測試以HTML運行並且可以操作環境的事實。所以我做的是：

在否定的情況下，使用找不到的說明符。第一個期望將不會失敗。
在對正面和負面測試用例之間，我用jQuerys .append（）方法，以ID爲「發現」添加一個div的身體

這就是它！

來源

2013-01-10 pardahlman

選擇器本身是一個字符串。你用什麼來選擇DOM元素？ jQuery，純js，... – kidwon

模塊本身依賴於jQuery，所以我只選擇像'$（cssSelector）'這樣的元素。沒有聽說過jQuery.pure.js - 我會檢查是否解決我的問題 - 謝謝！ – pardahlman

不，我的意思只是js沒有框架 – kidwon

也許是因爲您在"#not-found"}後錯過了);？

來源

2013-01-10 11:41:36 Enthusiasmus

謝謝你的帖子，對不起，這不是問題，雖然 - 我刪除了一些代碼，讓它更清楚我想要做什麼和）;在那個過程中消失了。 – pardahlman

在jQuery中這將起作用。如果有這樣的DOM節點，將有長度大於0

var exists = $('cssSelector').length > 0;

來源

2013-01-10 12:15:49 kidwon

謝謝，這就是我最終使用的。不過，我還需要一件事才能讓事情正確 - 我已經更新了我的帖子。 – pardahlman

我真的不明白，也許你可以更具體地 – kidwon

更大的如果你深入DOM測試需要更多，茉莉將獨自做到這一點。

對於簡單的DOM需求和單一測試，您可以繼續做你正在做的事情。

對於簡單但重複的測試，請使用beforeEach和afterEach來設置和銷燬測試過程中需要的DOM元素。

對於除了最簡單的DOM測試之外的任何事情，可以使用如下內容：https://github.com/jeffwatkins/jasmine-dom將Jasmine擴展到DOM。

來源

2013-01-10 15:12:11

茉莉花是我正在尋找的東西。我仍然不覺得它優雅，但它會明確地做到這一點。謝謝！ – pardahlman

單元測試JavaScript和HTML方面

回答

相關問題