在PhantomJS中设置元素高度

Question

在PhantomJS中进行测试时如何设置元素高度？

我正在使用Jasmine框架在Karma上进行测试，并在PhantomJS无头浏览器上运行。我正在尝试测试与“无限滚动”（当用户滚动到容器元素底部附近时自动加载项目）有关的AngularJS指令。我
不 使用jQuery，也不希望（除非没有其他方法）。我正在使用 .clientHeight ， .scrollTop 和
.scrollHeight 属性。我的指令至少在Chrome中可以正常工作。

我尝试为指令设置测试，但是找不到找到高度非零的元素的方法。以下代码让我不高兴：

describe('something', function () {
    it('works with element height', inject(function ($document) {
        var el = angular.element('<div>Lorem ipsum...</div>')[0];
        $document.append(el);
        // size of non-empty block element should be non-zero by default
        expect(el.clientHeight).not.toBe(0);
        expect(el.scrollHeight).not.toBe(0);
        // it should certainly be non-zero after the height is set manually
        el.style.height = '999px';
        expect(el.clientHeight).not.toBe(0);
        expect(el.scrollHeight).not.toBe(0);
    }));
});

我究竟做错了什么？有可能做我想做的事吗？

__

使用设置元素高度element.style.height效果很好。我只是没有将元素正确地附加到文档主体中。

Answer 1

我认为问题在于$
document。您需要定义哪个文档并找到body元素并将其附加到该元素。此代码现在经过我在PhantomJS，通过更换$document用angular.element($document[0].body)。

it('works with element height', inject(function ($document) {
    var el = angular.element('<div>Lorem ipsum...</div>')[0];

    //Find the correct body element
    angular.element($document[0].body).append(el);

    // size of non-empty block element should be non-zero by default
    expect(el.clientHeight).to.not.equal(0);
    expect(el.scrollHeight).to.not.equal(0);
    // it should certainly be non-zero after the height is set manually
    el.style.height = '999px';
    expect(el.clientHeight).to.not.equal(0);
    expect(el.scrollHeight).to.not.equal(0);
}));