无法在Jasmine测试中获取scrollTop值

Question

这是我对Stack Overflow的第一个问题,Jasmine对我来说相当新,所以我希望我在这里做得很好.

我有一个Jasmine测试,我尝试将页面的滚动位置设置为某个值.实际的代码非常复杂,但我设法做了一个更简单的失败测试示例:

it("should set scrollTop to equal 100", function () {
  setFixtures("<div id='page' style='height: 1000px;'>Page content</div>");

  spyOn($.fn, "scrollTop");
  $("#page").scrollTop(100);

  expect($.fn.scrollTop).toHaveBeenCalledWith(100); // this test passes
  expect($("#page").scrollTop()).toEqual(100);
});

结果:预期0到100.

我将scrollTop设置为100并期望它就在下一行.该测试如何失败？

如果重要的话,我使用带有requirejs的Jasmine 1.3.1和jasmine-jquery作为扩展.

Answer 1

我看不出有什么setFixtures作用，但我的猜测是因为；

• 创建的 DOM 节点尚未附加到实时 DOM 中的任何位置。
• DIV 的样式不是可滚动的。
• DIV 没有足够的内容来显示滚动条。

这是一个简单的例子；

var div = document.createElement('div');
div.style.height = '100px';
div.style.width = '100px';

// ensure the content has a track for scrollbars (won't work without this)
div.style.overflow = 'scroll';

// it also needs enough content to actually be scrollable (won't work without this)
div.innerHTML = '<br>x<br>x<br>x<br>x<br>x<br>x<br>x<br>x';

// needs to be appended to the live DOM (won't work without this)
document.body.appendChild(div);

// we can now set this value
div.scrollTop = 50;

// and read it back
console.log(div.scrollTop);
// == 50

我希望这会有所帮助，谢谢。