I have the following function implementation

function getRepo(url) {
    var repos = {};

    if (repos.hasOwnProperty(url)) {
        return repos[url];
    }

    return $.get(url)
        .then(repoRetrieved)
        .fail(failureHandler);

    function repoRetrieved(data) {

        return repos[url] = data;
    }

    function failureHandler(err, xhr) {
        throw new Error(xhr.responseText);
    }
}

And i wrote the following tests:

describe('"getRepo" method', function() {
    var getDeffered;
    var $;

     beforeEach(function() {
         getDeffered = Q.defer();
         $ = jasmine.createSpyObj('$', ['get']);
         $.get.and.returnValue(getDeffered.promise);
     });

     it('should return a promise', function(){
         expect(getRepo('someURL')).toEqual(getDeffered.promise);
     });

});

And this test fails. I think because i call the then method.

It does not fail if function implementation is:

function getRepo(url) {
    return $.get(url);
}

this is the message jasmine throws when using Q.defer()

Expected { promiseDispatch : Function, valueOf : Function, inspect : Function }
to equal { promiseDispatch : Function, valueOf : Function, inspect : Function }.

And this is the message if i use jQuery Deferred:

Expected { state : Function, always : Function, then : Function, promise : Function, pipe : Function, done : Function, fail : Function, progress : Function } 
to equal { state : Function, always : Function, then : Function, promise : Function, pipe : Function, done : Function, fail : Function, progress : Function }.

jQuery Deferred test implementation:

describe('"getRepo" method', function() {
    var getDeffered;
    var $;

    beforeEach(function() {
        getDeffered = real$.Deferred();
        $ = jasmine.createSpyObj('$', ['get']);
        $.get.and.returnValue(getDeffered.promise());
    });

    it('should return a promise', function(){
        expect(getRepo('someURL')).toEqual(getDeffered.promise());
    });

});

I have the following function implementation

function getRepo(url) {
    var repos = {};

    if (repos.hasOwnProperty(url)) {
        return repos[url];
    }

    return $.get(url)
        .then(repoRetrieved)
        .fail(failureHandler);

    function repoRetrieved(data) {

        return repos[url] = data;
    }

    function failureHandler(err, xhr) {
        throw new Error(xhr.responseText);
    }
}

And i wrote the following tests:

describe('"getRepo" method', function() {
    var getDeffered;
    var $;

     beforeEach(function() {
         getDeffered = Q.defer();
         $ = jasmine.createSpyObj('$', ['get']);
         $.get.and.returnValue(getDeffered.promise);
     });

     it('should return a promise', function(){
         expect(getRepo('someURL')).toEqual(getDeffered.promise);
     });

});

And this test fails. I think because i call the then method.

It does not fail if function implementation is:

function getRepo(url) {
    return $.get(url);
}

this is the message jasmine throws when using Q.defer()

Expected { promiseDispatch : Function, valueOf : Function, inspect : Function }
to equal { promiseDispatch : Function, valueOf : Function, inspect : Function }.

And this is the message if i use jQuery Deferred:

Expected { state : Function, always : Function, then : Function, promise : Function, pipe : Function, done : Function, fail : Function, progress : Function } 
to equal { state : Function, always : Function, then : Function, promise : Function, pipe : Function, done : Function, fail : Function, progress : Function }.

jQuery Deferred test implementation:

describe('"getRepo" method', function() {
    var getDeffered;
    var $;

    beforeEach(function() {
        getDeffered = real$.Deferred();
        $ = jasmine.createSpyObj('$', ['get']);
        $.get.and.returnValue(getDeffered.promise());
    });

    it('should return a promise', function(){
        expect(getRepo('someURL')).toEqual(getDeffered.promise());
    });

});

• javascript
• unit-testing
• jasmine
• tdd
• promise

Share Improve this question Follow edited Dec 28, 2015 at 19:45 Saif Adnan asked Dec 28, 2015 at 14:55 Saif AdnanSaif Adnan 29733 silver badges1212 bronze badges 7

• 1) Promises in jQuery and promises in Q are different objects; 2) you're releasing the Zalgo by mixing sync and async responses in your code, please don't. – raina77ow Commented Dec 28, 2015 at 15:02
• And between, both promises are plain/object and they are instance of Promise. – Saif Adnan Commented Dec 28, 2015 at 15:03
• They are. as i said i'm mocking jQuery, and its method "get" returns the deferred which i defined by Q.defer() – Saif Adnan Commented Dec 28, 2015 at 15:07
• The problem is that $.Deferred().then() returns the same promise it's called on, but Q's one returns a new one. – raina77ow Commented Dec 28, 2015 at 15:12
• I have updated my question.. and added jasmine exceptions. please take a look again – Saif Adnan Commented Dec 28, 2015 at 15:14

 |  Show 2 more ments

2 Answers 2

Sorted by: Reset to default 3

Instead of testing the returned object being a promise, you can test the resolved value directly, which gives a more accurate result:

describe('"getRepo" method', function() {
    var originalGet;
    beforeAll(function() {
        originalGet = $.get;
    });
    beforeEach(function() {
        $.get = originalGet; // Restore original function
    });

    it('should update the data[] array when resolved', function(done) {
    // This is an asynchronous test, so we need to pass done    ^^^^
        var expectedResult = 'test data';
        $.get = function() { 
            var dfd = $.Deferred();
            dfd.resolve(expectedResult);
            return dfd.promise();
        };
        getRepo('someURL').then(function(repos) {
            var actualResult = repos['someUrl'];
            expect(actualResult).toEqual(expectedResult);
            done(); // This is an asynchronous test. We must mark the test as done.
        });
    });
});

Please note that jQuery's Promise implementation is pretty bad. It's best if you use native Promises, or a library like Bluebird.

You are creating a local $ variable, then assigning a spy object to it. Which is not the same $ that getRepo uses.

You should remove the local variable var $; and mock the original $.get.

Try this:

describe('"getRepo" method', function() {
    var testPromise;

    beforeEach(function() {
        testPromise = real$.Deferred().promise();
        spyOn($, 'get').andCallFake(function() {
            return testPromise;
        });

    });

    it('should return a promise', function(){
        expect(getRepo('someURL')).toEqual(testPromise);
    });

});