测试postMessage的茉莉异步不起作用 [英] Testing postMessage with Jasmine async doesn't work

问题描述

我试图用茉莉花2.0编写单元测试在AngularJS应用中的一些逻辑，但逻辑是一个事件监听器里。从控制器：

I'm trying to use Jasmine 2.0 to write unit tests for some logic in an AngularJS app, but the logic is inside an event listener. From the controller:

  window.addEventListener('message', function(e) {
    if (e.data === "sendMessage()") {
      $scope.submit();
    }
  }, false);

和从测试文件：

  describe("post message", function() {
    beforeEach(function(done) {
      var controller = createController(controllerParams);
      spyOn($scope, 'submit');
      window.postMessage('sendMessage()', '*');
      done();
    });

    it('should submit on a sent message', function (done) {
      expect($scope.submit).toHaveBeenCalled();
      done();
    });
  });

但测试失败，间谍从来没有被击中。从投入控制台调试语句额外的信息：

But the test fails, the spy never being hit. Extra info from putting in console debug statements:

• window.addEventListener 在控制器中获取调用。


• 的 beforeEach 和是块都得到调用。


• 在控制上述消息处理程序是没有得到在测试过程中被调用。


• 在本试验中发送的消息最终被消息处理，几次receievd，但直到测试结束后。

• window.addEventListener in the controller IS getting called.
• The beforeEach and it block are both getting called.
• The above message handler in the controller is not getting called during the test.
• The message sent in this test is eventually being receievd by the message handler, several times, but not until after the test ends.

什么是测试在这里失踪？

What is my test missing here?

推荐答案

这是因为发生在你 beforeEach 阻止你叫 window.postMessage（ ）（这是异步的，你不知道什么时候要去执行）然后调用（）完成右键后，因为这将是同步code。但 window.postMessage（）为异步，基本上你需要调用（）完成时，你的异步操作完成 。它可以这样做：

It is happening because in your beforeEach block you call window.postMessage() (which is asynchronous and you don't know when it's gonna execute) and then you call done() right after it as it would be synchronous code. But window.postMessage() as async, and basically you need to call done() when your async operation is complete. It could be done like this:

beforeEach(function(done) {  
    spyOn(someObject, 'submit').and.callFake(function () {
      done();
    });
});

所以，你的间谍执行时，则异步操作被认为是完整的。

So when your spy executes, then async operation is considered complete.

这可以被前pressed更短：

This could be expressed even shorter:

beforeEach(function(done) {  
    spyOn(someObject, 'submit').and.callFake(done);
});

下面是完整的code：

Here is the full code:

var someObject = {
  submit: function () {
    console.log('Submit');
  }
};

window.addEventListener('message', function(e) {
  if (e.data === "sendMessage()") {
    someObject.submit();
  }
}, false);

// Test

describe('window.postMessage', function () {

  beforeEach(function(done) {  
    spyOn(someObject, 'submit').and.callFake(function () {
      done();
    });
    window.postMessage('sendMessage()', '*');
  });

  it('should submit on a sent message', function () {
    expect(someObject.submit).toHaveBeenCalled();
  });

});

请参阅工作JS斌： http://jsbin.com/ xikewogagu / 1 /编辑？HTML，JS，控制台输出

，因为它是可重复使用纯JS，我没有使用此角样品中

I did not use Angular in this sample because it is reproducible with a pure JS.

这篇关于测试postMessage的茉莉异步不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！