javascript – 使用.toHaveBeenCalled的Jasmine测试失败了注册表单

我正在处理的单页面应用程序具有两种形式的登录视图：登录表单和注册表单.以下规范描述了这些表单的测试.我正在使用 Jasmine-jQuery 1.4.2.

// user_spec.js

describe("User",function() {

  var userController;

  beforeEach(function () {
    loadFixtures('menu.html');
    userController = new MyApp.User.Controller();
  });

  describe("LoginView",function() {

    beforeEach(function() {
      // Mock the $.ajax function to prevent XHR:
      spyOn($,"ajax").andCallFake(function(params) {});
    });

    it("should pass email and password with the 'signInForm:submit' event.",function() {
      var email = "[e-mail]";
      var password = "Passw0rd";
      var callback = jasmine.createSpy("FormSubmitSpy");

      userController.loginView.$el.find("#signInEmail").val(email);
      userController.loginView.$el.find("#signInPassword").val(password);
      userController.loginView.bind("signInForm:submit",callback,this);
      userController.loginView.ui.signInForm.trigger("submit");

      expect(callback).toHaveBeenCalledWith({
        email: email,password: password
      });
    });

    it("should pass name,email and password with the 'signUpForm:submit' event.",function() {
      var name = "John Doe";
      var email = "[e-mail]";
      var password = "Passw0rd";
      var callback = jasmine.createSpy("FormSubmitSpy");

      userController.loginView.$el.find("#signUpName").val(name);
      userController.loginView.$el.find("#signUpMail").val(email);
      userController.loginView.$el.find("#signUpPassword").val(password);
      userController.loginView.$el.find("#signUpPasswordConfirmation").val(password);
      userController.loginView.bind("signUpForm:submit",this);

      userController.loginView.ui.signUpForm.trigger("submit");

      expect(callback).toHaveBeenCalledWith({
        name: name,email: email,password: password,password_confirmation: password
      });
    });

  });

});

登录表单的测试运行成功,但注册表单的测试失败.

Error: Expected spy FormSubmitSpy to have been called with \
    [ { name : 'John Doe',email : '[e-mail]',\
    password : 'Passw0rd',password_confirmation : 'Passw0rd' } ] \
    but it was never called.

    at new jasmine.ExpectationResult (http://localhost:3000/assets/jasmine.js?body=1:114:32)
    at null.toHaveBeenCalledWith (http://localhost:3000/assets/jasmine.js?body=1:1235:29)
    at null.<anonymous> (http://localhost:3000/assets/user_spec.js?body=1:233:24)
    at jasmine.Block.execute (http://localhost:3000/assets/jasmine.js?body=1:1064:17)
    at jasmine.Queue.next_ (http://localhost:3000/assets/jasmine.js?body=1:2096:31)
    at jasmine.Queue.start (http://localhost:3000/assets/jasmine.js?body=1:2049:8)
    at jasmine.Spec.execute (http://localhost:3000/assets/jasmine.js?body=1:2376:14)
    at jasmine.Queue.next_ (http://localhost:3000/assets/jasmine.js?body=1:2096:31)
    at jasmine.Queue.start (http://localhost:3000/assets/jasmine.js?body=1:2049:8)
    at jasmine.Suite.execute (http://localhost:3000/assets/jasmine.js?body=1:2521:14)

在应用程序中使用表单没有问题.数据传输.一切都很好.只是测试没有.

解决方法

但是当我延迟执行时,测试是成功的.

_.defer(function() {
  expect(callback).toHaveBeenCalledWith({
    name: name,password_confirmation: password
  });
});

为什么这个工作和“正常”实施失败？

这是给定案例的简化：

it("should evaluate true",function() {
  var foo = false;
  _.defer(function() {
    foo = true;
  });
  expect(foo).toBeTruthy();
});

解决方法

茉莉花做同样的事情,而不使用下划线功能进行推迟,将是如下：

var flag = false;
...

runs(function() {
  userController.loginView.ui.signInForm.trigger("submit");
  setTimeout(function() { flag = true; },1);
}

waitsFor(function() {
  return flag;
},"Blah this should never happen",10);

runs(function() {
  expect(callback).toHaveBeenCalledWith({
    name: name,password_confirmation: password
  });
}

@Marc是正确的,问题是使用绑定和Javascript发送事件“有时/通常/永远”到他的下一个事件循环(它的异步性质如何工作),所以,因为你是窥探一个回调你想要确保您的测试是为了记录该异步行为而编写的.

当您的测试写入时,您将冒第一次测试不会偶尔通过的风险(我很惊讶它的工作原理).您正在以非异步方式测试异步事件回调…有意义吗？