Jasmine测试.load（）来获取被调用的URL [英] Jasmine testing .load() to get called URL

问题描述

我有一个加载模板的函数，我想检查正在调用的URL。

I have a function which loads a template and I want to check the correct URL is being called.

因为除了间谍之外我找不到任何其他信息在ajax调用中，我假设它与 .load（）调用相同。我正在使用Jasmine 2.4.1

As I can't find any information other than for spying on ajax calls, I'm presuming it's the same for .load() calls. I'm using Jasmine 2.4.1

功能

function templateLoader() {
    var templateURL = '/path/to/template.html';
    $('#myElement').load(templateURL, function(response, status, xhr) {
        if (status === "error") {
            common.templateError(templateURL, xhr);
        } else {
            ns.successFunction();
        }
    });
}

茉莉花测试

var templateURL = '/path/to/template.html';
spyOn($('#myElement'), "load");
templateLoader(); // call the function
expect($('#myElement').load.calls.mostRecent().args[0]["url"]).toEqual(templateURL);

当我运行此测试时，我收到以下错误：

When I run this test I get the following error:

TypeError：无法读取未定义属性'mostRecent'

TypeError: Cannot read property 'mostRecent' of undefined

是否有不同的方式去做这个？我也想检查成功函数是否被调用，但直到可以检查URL是否正确我不能这样做。

Is there a different way to do this? I also want to check the success function is being called but until can check the URL is correct I can't do that.

推荐答案

几点观察：

• 你的负载是一个ajax函数，所以你必须 spyOn $。ajax
  而不是 $（＃myElement）.load


• 您无法同时检查来电网址& successCallBack在相同的
  时间内没有嘲笑ajax函数本身。这是因为你的
  successCallback只有在你从
  服务器得到响应后才会被执行，同时你的测试会一直运行。


• 因此诀窍是模拟ajax调用本身并调用fakeFunction来解析promise，它实际上解析了运行时的成功值，即同步 - 这有助于你的期望。

• Your load is an ajax function, so you'd have to spyOn $.ajax rather than $(#myElement).load
• You cannot check both the call URL & the successCallBack at the same time without mocking the ajax function itself. This is because your successCallback gets executed only after you get a response from server, meanwhile your test runs through.
• Hence the trick is to mock the ajax call itself and call a fakeFunction to resolve the promise, which actually resolves the success value at run-time i.e. synchronously- which aids your expectations.

注意：
我使用的是jasmine 2.5

Note: I used jasmine 2.5

下面的代码说明了上面提到的所有要点。要查看它的实际效果，请与在此处小提琴联系。

The code below illustrates all the points mentioned above. To see it in action, reach out to the fiddle here

function templateLoader(templateURL) {
  $('#myElement').load(templateURL, null, function(response, status, xhr) {
    if (status === "error") {
      common.templateError(templateURL, xhr);
    } else {
      successFunction();
    }
  });
}

successFunction = function() {
  console.log("This is a success Function");
}

describe("spec to test ajax url", function() {
  it('test load call url', function() {
    spyOn($, 'ajax').and.callThrough();
    spyOn(window, 'successFunction').and.callThrough();
    templateLoader("https://jsonplaceholder.typicode.com/posts/1");
    expect($.ajax.calls.mostRecent().args[0]["url"]).toEqual("https://jsonplaceholder.typicode.com/posts/1");    
  });

  it('test success function', function(){
    spyOn(window, 'successFunction').and.callThrough();
    spyOn($, 'ajax').and.callFake(function(e) {
      return new $.Deferred().resolve({}).promise();
    });
    templateLoader("https://jsonplaceholder.typicode.com/posts/1");
    expect($.ajax.calls.mostRecent().args[0]["url"]).toEqual("https://jsonplaceholder.typicode.com/posts/1");    
    expect(window.successFunction).toHaveBeenCalled();
    });
});

这篇关于Jasmine测试.load（）来获取被调用的URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！