Menu
I'm just in the middle of implementing some Jasmine tests for a jQuery mobile application I'm working on, I've run into an error that I managed to track down to adding the jQuery mobile library, the error is as follows:
Jasmine.js:1769 TypeError: Cannot read property 'abort' of undefined.
As soon as I remove the jQM dependency, the error goes away.
This is my code:
<!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>
I'd prefer to use Jasmine for this application instead of qUnit as I think its more flexible and easier to implement in CI and explain to the BA's and PM's.. however after tinkering with this problem for a couple of hours and some futile searches on google I still havent been able to solve it so I'm starting to consider moving on.
Before I do though, has anyone experienced this same problem and found a solution for it?
Thanks and Regards.
UPDATE 20 March:
Ticket is in github Jasmine project:
https://github.com/pivotal/jasmine/issues/204
887
I was able to have jasmine test of jquery mobile scripts using jasmine-jquery.
The trick is that you need to disable the jquery mobile enhancement on DOMready because it will try to enhance the html of jasmine runner. You can do it with this script inserted in the head of the html runner file:
<script type="text/javascript">
$(document).bind("mobileinit", function(){
$.mobile.autoInitializePage = false;
});
</script>
Then you need to trigger the enhancement of jquery mobile on the html inserted from your fixture (the jasmine-jquery functionnality):
describe('my test', function(){
beforeEach(function() {
loadFixtures("fixtures/MYFixture.html");
$("#jasmine-fixtures").attr("data-role","page").trigger("create");
}
it( ...
});
Try disabling both auto-initialization and hash-listening:
<script type="text/javascript">
$(document).bind("mobileinit", function(){
$.mobile.autoInitializePage = false;
$.mobile.hashListeningEnabled = false;
});
</script>
Then add the jqm page to the jasmine-jquery fixture, and initialize the page:
beforeEach(function() {
jasmine.getFixtures().set('<div data-role="page"></div>');
$.mobile.initializePage();
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
