一尘不染

期望元素具有滚动

selenium

在我们的一个内部角度应用程序中,显示了一个许可证文本框。由于内部有很多文本,因此以div元素表示的许可证框具有滚动条。

问题: 如何测试元素是否具有滚动protractor

这是元素的HTML表示形式:

<div class="login-disclaimer-text-canvas ng-binding" ng-bind-html="disclaimer">
Copyright © Company, 2015. All Rights Reserved.
...
</div>

在哪里login-disclaimer-text-canvas定义了以下CSS样式:

.login-disclaimer-text-canvas {
  height: 50px;
  width: 100%;
  overflow-y: auto;
  background-color: #eee;
  color: #3E6372;
  padding: 4px;
  font-size: 10px;
}

阅读 306

收藏
2020-06-26

共1个答案

一尘不染

技巧(最初在这里提出)是比较height属性:

heightCSS属性指定 元素的内容区域的高度 。内容区域位于元素的填充,边框和边距之内。

scrollHeight

Element.scrollHeight只读属性是一个 元素的含量的高度,其中包括由于溢出内容在屏幕上不可见的测量
。该scrollHeight值等于clientHeight元素所需的最小值
,以便在不使用垂直滚动条的情况下适合视点中的所有内容。它包括元素填充,但不包括其边距。

如果scrollHeight大于height-,则元素具有滚动条。


protractor我们需要比较的解决承诺getAttribute('height')getAttribute('scrollHeight')。让我们通过两个承诺的可重复使用的功能和解决一个then()expect()来解决第二个:

function elementHasScroll(element) {
    element.getAttribute('height').then(function (height) {
        expect(element.getAttribute('scrollHeight')).toBeGreaterThan(height);
    });
};

其中toBeGreaterThan()得心应手匹配器的一部分jasmine- matchers第三方。

2020-06-26