使用 Jasmine 测试主干视图时，浏览器页面不断刷新

Browser page keeps refreshing when testing Backbone views with Jasmine

本文关键字：浏览器 刷新 测试 Jasmine 视图 使用      更新时间：2023-09-26

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

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

有什么想法吗？如何解决此问题？

附言：
该问题仅涉及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();
    });
});

（二）

var MyView = Backbone.View.extend({
    events: {
        'submit form' : 'submitForm'
    },
    submitForm: function (event) {
        event.preventDefault();
        // some code
    }
});

Backbone 使用委托事件，这些事件在创建视图时绑定。您的 view.el 在创建时不包含窗体，而是在 render 方法中创建一个窗体。这就是提交委托事件未绑定的原因，而是在页面上提交表单。该表单提交将转到同一 URL，这会触发 Jasmine 套件再次运行，从而导致循环。

如果您稍微修改一下代码，您会发现此版本有效，因为

元素在生成视图之前就已存在。

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();
    });
});​

​

相关文章：