javascript - 测试初始化​​函数中设置的主干事件

Question

我正在尝试设置我的集合以监听在集合中的模型上触发的事件，如下所示:

var Collection = Backbone.Collection.extend({
  initialize: function() {
    this.on('playback:completed', this.playNext);
  },
  playNext : function() { }
});

在我的测试中，我将新的 Backbone.Models 添加到集合的一个实例中，然后在它们上触发 playback:completed... 而 playNext 不是叫。如何正确设置？

编辑:添加测试代码(使用 Jasmine):

var collection;

describe('Collection', function() {

  beforeEach(function() { 
    collection = new Collection();
  });

  it('should playNext when playback:completed is triggered', function() {
    var model1 = new Backbone.Model();
    var model2 = new Backbone.Model();
    var spy = spyOn(collection, 'playNext').andCallThrough();
    collection.add(model1);
    collection.add(model2);
    model1.trigger('playback:completed');
    expect(spy).toHaveBeenCalled();
  });
});

Answer 1

这里的问题是 backbone 的 .on 将回调包装为克隆或类似的东西。由于 spy 是在 Collection.initialize 运行之后设置的，因此被包装的回调是设置 spy 之前的函数，它永远不会被触发。

我确定的解决方案是将事件绑定(bind)拉入 bindEvents 函数，如下所示:

var Collection = Backbone.Collection.extend({
  initialize: function() {
    this.bindEvents();
  },
  bindEvents : function() {
    this.on('playback:completed', this.playNext);
  },
  playNext : function() { }
});

然后，在我的测试中(在设置 spy 之后)，我运行了 collection.off(); collection.bindEvents();，将它们与 spy 版本重新绑定(bind)。