Protractor mocking jQuery ajax

Question

Is it possible to mock an jQuery.ajax request (which gets called because of Kendo UI's Datasource) in an AngularJs app via Protractor?

Used Script/Framework etc

• Protractor
• jQuery
• jsdom
• Mockjax

I tried with following script (without the ajax request get mocked)

var jsdom = require("jsdom");
var jQuery;
var mockjax;

jsdom.env("", function(err, window) {
    if (err) { console.error(err); return; } 
    jQuery = require("../jquery-2.2.4.js")(window);
    mockjax = require('../jquery.mockjax.js')(jQuery, window);  
});

describe('Websuite: TemplateTest', function() {

    beforeEach(function(){
        jQuery.mockjax({ url: "/XYZ/GetMails" });
    });

    it('some mocking test', function() {

        browser.get('https://localhost:44300/#/dat/templateTest');      

        browser.pause();        

    });

});

I am not even sure if it is even possible to mock an jQuery.ajax call in Protractor (like we did with $http & $httpBackend)

Answer 1

I think you need to inject this mock into your web application with browser.addMockModule. Then your jquery ajax requests will be mocked.

browser.addMockModule('httpBackendMock', function() {
  angular.module('httpBackendMock', [])
    .run(function () {
      /**
       * I assume your web application has jQuery mockjax library for testing.
       * If doesn't exist, you need to inject/include jquery mockjax library into your web application.
       **/

      jQuery.mockjax({ url: "/XYZ/GetMails" });
    });
});

After you inject this mock module, your request will be responded by mock.

I hope this works for you.