Restoring an anonymous sinon.stub

I'm using Qunit to unit test some jQuery. For some of my tests, I want to stub out a function (called cycle()), and for later tests, I want to call the original function. I've organised and separated these in modules, but the stub is still in place. I thought from the sinon.js docs, the original function would be restored (removing the stub) once a test was finished, and certainly after moving to a new module.

Part of the difficulty seems to be that I have used an anonymous stub, thus making it difficult to simply call stub.restore.

Any advice? Thanks.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Javascript tests</title>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit 1.17.1.css">
</head>

<body>
<div id="qunit"></div>
<div id="qunit-fixture">
<img id="logo" src="" width=100 height=100 alt="dummy logo">
<ol>
<li class="criterion">
    <img id="gfx" src="" width=100 height=100 alt="dummy graphic">
    <img id="SC1" class="tl-red" 
        src="../../../static/images/img_trans.png">Some text blurb
</li>
</ol>

<ol>
<li class="learning_outcome">
    <img id="LO8" class="tl-red"
        src="../../../static/images/img_trans.png" >More blurb...
</li>
</ol>
</div>

<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="http://code.jquery.com/qunit/qunit-1.17.1.js"></script>
<script src="../../../static/sinon.js"></script>
<script src="http://sinonjs.org/releases/sinon-qunit-1.0.0.js"></script>
<script src="../../../static/jQplugins/carhartl-jquery-cookie-fedc4cb/jquery.cookie.js"></script>
<script src="../../../static/traffic.js"></script><!--cycle defined in there-->
<script>
/*global $, test, equal */


module("Traffic light is bound to cycle function");

test("Double click LO triggers cycle function", function (assert) {
    cycle = sinon.stub();
    $('img#LO8').dblclick();
    assert.equal(cycle.calledOnce, true, 'cycle called after dblclick on LO');
});

module("Cycle function tests");

test("The cycle function requires img argument", function (assert) {
    assert.throws(function() {
        cycle(); /*This is still stubbed out, but why? */
    },
        Error,
        'passing no image throws Error');
});
</script>
</body>
</html>

Solution

Unfortunately, Sinon does not automatically restore your stubbed out methods for you automatically.

What you have done in your test is overwrite the global cycle with a Sinon stub function. You don't keep the old one around to restore and then restore it at the end of the test, which you will need to do.

For example:

test("Double click LO triggers cycle function", function (assert) {
    var origCycle = cycle;
    cycle = sinon.stub();
    $('img#LO8').dblclick();
    assert.equal(cycle.calledOnce, true, 'cycle called after dblclick on LO');
    cycle = origCycle;
});

You might have been confused by the sinon.stub(obj, "method") syntax, which allows you to the call obj.method.restore() at the end of the test to restore the original method, but you still need to manually restore it yourself.

You could use that syntax, though, if you prefer:

test("Double click LO triggers cycle function", function (assert) {
    sinon.stub(window, 'cycle');
    $('img#LO8').dblclick();
    assert.equal(cycle.calledOnce, true, 'cycle called after dblclick on LO');
    window.cycle.restore(); // or even just `cycle.restore()`
});