2012-03-20 70 views
4

我剛剛在實施一些Jasmine tests我正在處理的jQuery mobile應用程序的中間,我遇到了一個錯誤,我設法追蹤添加jQuery移動庫,錯誤如下:茉莉花與jQuery Mobile的兼容

Jasmine.js:1769 TypeError: Cannot read property 'abort' of undefined. 

只要我刪除jQM依賴項,錯誤消失。

這是我的代碼:

<!DOCTYPE html> 
<html> 
<head> 
    <title>HTML5/Common/Tests</title> 
    <!-- LOAD STYLES FIRST --> 
    <link type="text/css" rel="stylesheet" href="libs/jasmine.css" media="screen"> 
    <link type="text/css" rel="stylesheet" href="../../Common/libs/jquery.mobile-1.0.1.css" /> 
    <!-- LOAD JASMINE LIBRARIES --> 
    <script type="text/javascript" src="libs/jasmine.js"></script> 
    <script type="text/javascript" src="libs/jasmine-html.js"></script> 
    <!-- LOAD DEPENDENCIES --> 
    <script type="text/javascript" src="../../Common/libs/jquery-1.7.1.min.js"></script> 
    <script type="text/javascript" src="../../Common/libs/jquery.mobile-1.0.1.min.js"></script> 
    <!-- LOAD CODE TO TEST --> 
    <script type="text/javascript" src="../../Common/libs/myLib.js"></script> 
    <!-- LOAD ACTUAL TESTS --> 
    <script type="text/javascript"> 
     describe("Suite 1", function() { 
      it("Should be that 1 equals 0", function() { 
        expect(0).toEqual(1); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <script type="text/javascript"> 
    jasmine.getEnv().addReporter(new jasmine.TrivialReporter()); 
    jasmine.getEnv().execute(); 
    </script> 
</body> 
</html> 

我寧願使用茉莉花此應用程序,而不是qUnit,因爲我覺得它更靈活,更容易在CI實施和解釋廣管局和PM的..然而,在對這個問題進行了幾個小時的修補以及在谷歌上一些徒勞的搜索之後,我仍然無法解決這個問題,所以我開始考慮繼續前進。

在我做之前,有沒有人遇到同樣的問題,並找到了解決方案?

感謝和問候。

更新3月20日:

票是在github上茉莉花項目:

https://github.com/pivotal/jasmine/issues/204

回答

9

我能夠在使用jasmine-jquery jQuery Mobile的腳本茉莉測試。

訣竅是您需要禁用DOMready上的jQuery移動增強功能,因爲它會嘗試增強茉莉花亞軍的html。

<script type="text/javascript"> 
    $(document).bind("mobileinit", function(){ 
    $.mobile.autoInitializePage = false; 
    }); 
</script> 

然後,你需要觸發從夾具(茉莉 - jQuery的functionnality)插入到HTML的jQuery移動的增強: 您可以使用此腳本插入HTML亞軍文件的頭部做到這一點:

describe('my test', function(){ 
    beforeEach(function() { 
    loadFixtures("fixtures/MYFixture.html"); 
    $("#jasmine-fixtures").attr("data-role","page").trigger("create"); 
    } 
    it(... 
}); 
+0

完美。正是我在找 - 謝謝 – akc42 2013-04-20 15:11:35

+0

很好的答案。它只是解決了我的問題。謝謝:) – sonam 2013-12-03 06:40:57

1

嘗試禁用這兩種自動初始化和哈希聽:

<script type="text/javascript"> 
    $(document).bind("mobileinit", function(){ 
    $.mobile.autoInitializePage = false; 
    $.mobile.hashListeningEnabled = false; 
    }); 
</script> 

的JQM頁面然後添加到茉莉花的jQuery夾具和初始化頁面:

beforeEach(function() { 
    jasmine.getFixtures().set('<div data-role="page"></div>'); 
    $.mobile.initializePage(); 
});