使用 RequireJS（和 Jasmine/Sinon）时如何在另一个视图渲染方法中存根 Backbone View 实例化

我正在尝试使用 Jasmine 和 Sion 编写单元测试，但在使用 RequireJs 加载模块时，我很难找到与以下内容等效的内容：

sinon.stub(window, "MyItemView");

使用 RequireJs 时，我无法以这种方式存根，因为 MyItemView 未附加到窗口。

以下是我需要存根 MyItemView 时的示例：

var MyView = Backbone.View.extend({
el: '#myElement',
initialize : function() {
    var that = this;
    this.collection.fetch({
        success : function() {
            that.render();
        }
    });
},

render : function() {
    this.collection.each(this.renderItem);
}

renderItem: function(model){
        var myItemView = new MyItemView({model: model});
        $('#myElement').append(myItemView.render().el);
    },

...

现在，使用 Jasmine 我可以测试 insideHtml 是否包含预期的 HTML：

it('View should contain correct Html', function(){
            var collectionFetchStub = sinon.stub(this.myCollection, 'fetch').yieldsTo('success', this.myCollection);
            this.view = new MyView({collection: this.myCollection});
            expect(this.view.el.innerHTML).toContain('<li><a href=""> 1 : test </a></li>');

            // Remove Stubs
            collectionFetchStub.restore();
        });

但是，此测试依赖于 MyItemView 的渲染，这对于单元测试来说并不理想。这个问题的最佳解决方案是什么？我对 javascript 很陌生，这个问题的解决方案似乎很复杂。

看一眼this SO https://stackoverflow.com/questions/11439540/how-can-i-mock-dependencies-for-unit-testing-in-requirejs/11695463#11695463关于如何使用 requireJS 存根依赖关系。有一些解决方案。就像 testrJs、squireJs 或我自己的小解决方案一样。主要思想是用您的间谍/存根/模拟覆盖 requireJs 依赖项，以便您可以仅测试模块。

因此，在您的情况下，您可以像这样存根 MyItemView：

var el = $("<div>test</div>")
var MyItemView = sinon.stub().returns({render: sinon.stub().returns(el)})

然后你必须将 MyItemView 存根注入到你的 require 上下文中，你可以测试测试 div 是否附加到$('#myElement')。这并不理想，因为所有的 DOM 东西都会起作用，但它会起作用。更好的方法是不要渲染主干视图之外的东西。因为那么你可以注入一个模拟的el进入视图并测试是否调用了模拟的追加方法。