0

I am using QUnit to test the jQuery plugin I'm writing and was hoping to use blanket to generate coverage information.

My test looks like:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>My Awesome Test Suite</title>
  <!-- Load local jQuery. This can be overridden with a ?jquery=___ param. -->
  <script src="../libs/jquery-loader.js"></script>

  <!-- Load local QUnit. -->
  <link rel="stylesheet" href="../libs/qunit/qunit.css" media="screen">
  <script src="../libs/qunit/qunit.js"></script>

  <!-- Code Coverage with Blanket -->
  <script src="../node_modules/blanket/dist/qunit/blanket.min.js"></script>

  <!-- Load local lib and tests. -->
  <script src="../build/thingToTest.js" data-cover></script>
  <script src="../build/test/thingToTest_test.js"></script>
  <!-- Removing access to jQuery and $. But it'll still be available as _$, if
       you REALLY want to mess around with jQuery in the console. REMEMBER WE
       ARE TESTING A PLUGIN HERE, THIS HELPS ENSURE BEST PRACTICES. REALLY. -->
  <script>window._$ = jQuery.noConflict(true);</script>
</head>
<body>
  <div id="qunit">
    <h1 id="qunit-header">QUnit Tests</h1>
    <h2 id="qunit-banner"></h2>
    <div id="qunit-testrunner-toolbar"></div>
    <h2 id="qunit-userAgent"></h2>
  </div>
  <ol id="qunit-tests"></ol>
  <div id="qunit-fixture">
    <div class="thingToTest-container">
    </div>
  </div>
</body>
</html>

When I open this in a browser I see the enable coverage option but when I check that option I get the error

TypeError: 'undefined' is not an object (evaluating '$.fn')
Source: file:///Users/dave/src/thingToTest/test/thingToTest.html?coverage=true:317

If I comment out the line

<script>window._$ = jQuery.noConflict(true);</script>

then blanket works just fine.

In simple cases this is acceptable, but in more complex cases I'd really want to load jQuery in noConflict mode to ensure test purity.

Is there a way to achieve this?

Dave Sag
  • 13,266
  • 14
  • 86
  • 134

1 Answers1

1

I had the same problem. I added data-cover to the jQuery script tag in the HTML for qUnit tests and it worked, I think the instrument needs to see it.

EDIT

I also noticed this line in my html for qUnit.

<!-- Removing access to jQuery and $. But it'll still be available as _$, if
  you REALLY want to mess around with jQuery in the console. REMEMBER WE
  ARE TESTING A PLUGIN HERE, THIS HELPS ENSURE BEST PRACTICES. REALLY. -->
<script>window._$ = jQuery.noConflict(true);</script>

By removing that block it no longer needed the data-cover on the jQuery tag.

Ms. Tara Grieb
  • 11
  • 2
  • Thanks. I'm wondering which is better, adding coverage to the whole of jQuery (not likely to give sensible coverage stats) or not running jQuery in `noConflict` mode. I suspect the latter, but am looking for a solution that allows me to take advantage of using `noConflict`. – Dave Sag Jul 15 '14 at 00:02