Jasmine与jQuery Mobile的兼容性

Jasmine compatibility with jQuery Mobile

本文关键字：兼容性 Mobile jQuery Jasmine      更新时间：2023-09-26

我正在为我正在开发的jQuery移动应用程序实现一些Jasmine测试，我遇到了一个错误，我设法跟踪该错误以添加jQuery移动库，错误如下：

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>

我更喜欢在这个应用程序中使用Jasmine而不是qUnit，因为我认为它更灵活，更容易在CI中实现，并向BA和PM解释。。然而，在修补了这个问题几个小时，并在谷歌上进行了一些徒劳的搜索之后，我仍然无法解决它，所以我开始考虑继续前进。

然而，在我这样做之前，有人经历过同样的问题并找到了解决方案吗？

谢谢和问候。

3月20日更新：

门票在github Jasmine项目：

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

我能够使用jasmine jquery对jquery移动脚本进行jasmine测试。

诀窍是，您需要禁用DOMready上的jquery移动增强，因为它将尝试增强jasmine runner的html。您可以将此脚本插入html runner文件的头部：

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

然后，您需要在从fixture插入的html上触发jquery mobile的增强（jasmine jquery函数）：

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

尝试禁用自动初始化和哈希侦听：

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

然后将jqm页面添加到jasmine jquery fixture中，并初始化页面：

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