jquery - Jasmine jQuery : Using toBeHidden() and toBeVisible()

Question

我需要使用 jQuery-Jasmine 的 toBeHidden() 和 toBeVisible() 方法方面的帮助。

当用户选中复选框时，文本字段应向下滑动 - 取消选中会将其向上滑动。页面加载时文本字段隐藏。

代码在我的应用程序中运行良好，但我对测试中得到的结果感到困惑。

前两个正在工作 - 检查该字段是否默认隐藏并在第一次更改时可见:

expect($('#text-field')).toBeHidden(); // passes

$('#checkbox').prop('checked', true).change();
expect($('#text-field')).toBeVisible(); // passes

但是当取消选中该复选框时，文本字段在真实版本中会向上滑动，但在我的测试中失败:

$('#checkbox').prop('checked', false).change();
expect($('#text-field')).toBeHidden(); // fails

我也尝试过:

expect($('#text-field')).not.toBeVisible(); // fails
expect($('#text-field')).toHaveCss({display: "none"}); // fails

有谁知道我做错了什么，或者知道我还需要做什么才能帮助 Jasmine 看到文本字段向上滑动？

Answer 1

你可能和我有同样的问题，你的 View 在你的测试中是标准不可见的，因为它没有附加到 DOM。在您的测试中尝试一下:

$('body').append(view);