-->

Qunit parameterized tests and mocking

2019-01-30 11:25发布

问题:

I have two questions:

Can you have parameterised unit tests in qunit?

How do you do mocking with qunit e.g. mocking a getJSON call?

Thanks

回答1:

For mocking ajax requests, you can try something like this...

Here's the function you want to test:

    var functionToTest = function () {
        $.ajax({
            url: 'someUrl',
            type: 'POST',
            dataType: 'json',
            data: 'foo=1&foo=2&foo=3',
            success: function (data) {
                $('#main').html(data.someProp);
            }
        });
    };

Here's the test case:

    test('ajax mock test', function () {
        var options = null;
        jQuery.ajax = function (param) {
            options = param;
        };
        functionToTest();
        options.success({
            someProp: 'bar'
        });
        same(options.data, 'foo=1&foo=2&foo=3');
        same($('#main').html(), 'bar');
    });

It's essentially overriding jQuery's ajax function and then checks the following 2 things: - the value that was passed to the ajax function - invokes the success callback and asserts that it did what it was supposed to do



回答2:

Instead of overriding jQuery's AJAX function, you could also use the jQuery Mockjax plugin developed by .appendTo. This plugin essentially does what the other answer suggests, but it allows for much more sophisticated mocking. For example, if you have the function:

$.ajax({
    url:"/api/user",
    type:"GET",
    dataType:"json",
    data:'{"uid":"foobar"}',
    success:function(data){
        console.log("Success!");
    },
    error:function(data){
        console.log("Error!");
    }
});

You can mock it with mockjax by simply calling the function mockjax, which is automatically included in jQuery:

$.mockjax({
    url:"/api/user",
    type:"GET",
    response:function(requestData){
         //handle the mock response in here
         this.responseText = '{"fullname":"Mr. Foo Bar"}';
    }
});

The second mocking function can be included in an external JavaScript file, say "mocks.js," and the only other thing that needs to be done is include the mockjax library (which can be found at https://github.com/appendto/jquery-mockjax/). The only thing to keep in mind is that this will only mock jQuery ajax calls, not all XMLHttpRequests. If you want to do that, then follow @bertvh's advice and use Sinon.js.



回答3:

I just started using Sinon.JS, which allows mocking of XMLHttpRequests and also offers a simple fake-server API. Really easy to use! It also offers integration with qunit.



回答4:

There is my implementation of addon which allows to parameterize qunit tests: https://github.com/AStepaniuk/qunit-parameterize



回答5:

See this link to mock the getJSON call in your setup/teardown methods, http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=505