Question

运行以下Jasmine测试（1），测试成功执行但我面临主测试页的递归加载。

这是我的测试（1），这里是我运行测试的模块（2）：

有什么想法吗？我该如何解决这个问题？

P.S .:
问题只涉及Chrome和Safari浏览器这是一个例子：jsfiddle.net/shioyama/EXvZY

（1）

describe('When Submit button handler fired', function () {
    beforeEach(function () {
        spyOn(MyView.prototype, 'submitForm');
        this.view = new MyView();
        this.view.render();
        this.view.$el.find('form').submit();
    });

    it('submitForm should be called', function () {
        expect(MyView.prototype.submitForm).toHaveBeenCalled();
    });
});

（2）

var MyView = Backbone.View.extend({
    events: {
        'submit form' : 'submitForm'
    },

    submitForm: function (event) {
        event.preventDefault();
        // some code
    }
});

Answer 1

Backbone使用委托事件，它们在创建视图时被绑定。您的view.el在创建时不包含表单，而是在render方法中创建表单。这就是为什么提交委托事件不受约束，而是您在页面上提交表单。该表单提交到同一个URL，这会触发Jasmine套件再次运行，从而产生一个循环。

如果稍微修改一下代码，您会发现此版本有效，因为＆lt; form＆gt; 元素在生成视图之前就已存在。

var MyView = Backbone.View.extend({
    events: {
        'submit form' : 'submitForm'
    },

    submitForm: function (event) {
        event.preventDefault();
        // some code
    }
});

//start test runner right after we're done defining our tests in this script
window.setTimeout( function(){
    jasmine.getEnv().addReporter(new jasmine.TrivialReporter());
    jasmine.getEnv().execute();
}, 0 );

//TESTS GO HERE
describe('When Submit button handler fired', function () {
    beforeEach(function () {
        spyOn(MyView.prototype, 'submitForm').andCallThrough();
        this.view = new MyView({
            el: $('<div><form><input type="submit" value="Submit" /></form></div>')
        });
        this.view.$el.find('form').submit();
    });

    it('submitForm should be called', function () {
        expect(MyView.prototype.submitForm).toHaveBeenCalled();
    });
});

使用Jasmine测试Backbone视图时，浏览器页面会保持刷新

1 个答案: