我在网页上有 Jasmine、Knockout 和 jQuery。我已经编写了一些我认为可以验证 View 模型是否按照我期望的方式绑定(bind)到 DOM 的测试,但是 jQuery 似乎无法按照我认为的方式模拟用户交互:
例如
<input type='text' id='someField' data-bind='value: someField'>
<script>
var viewModel = { someField: ko.observable() };
// ...
//this test passes
it('should update the DOM when I edit the model', function(){
$('#someField').val('not the test value');
viewModel.someField('test value');
expect( $('#someField').val() ).toBe('test value');
});
//this test does not
it('should update the model when I change the DOM', function(){
viewModel.someField('not the test value');
$('#someField').val('test value');
expect( viewModel.someField() ).toBe('test value');
});
</script>
第一个测试通过,第二个测试失败。当我实际手动编辑 someField 时, View 模型确实发生了变化;只有测试失败,而不是它正在测试的行为。手动编辑页面时, View 模型更新似乎发生了“onblur”,所以我将测试中的相关行更改为:
$('#someField').val('test value').next('input').focus();
但还是失败了。
我对单选按钮有类似的测试。当我手动单击它们时, View 模型确实发生了变化,但在测试中,调用 $('#radioButton').click();
不会更新 View 模型。
为什么 Knockout 无法识别 jQuery 对 DOM 的更改?
最佳答案
您需要调用 .change() 以让 knockout 识别该值已通过编程方式更改。
$('#someField').val('test value').change();
为此,必须在 knockout 之前包含/加载 jQuery!
这可能与以下事实有关:如果存在 jQuery,Knockout.js 将使用 jQuery 的抽象进行事件处理,否则它将直接使用 DOM 事件 API。 https://github.com/knockout/knockout/blob/master/src/utils.js (注册事件处理程序和触发事件)
这可能应该在 Knockout.js 中得到修复。
关于javascript - 使用 jquery 测试 knockout javascript 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20724235/