protractor 创建一个 table 页面对象来处理具有不同选择器的 tables？

Question

我的第一个 post。我正在使用带 javascript/nodejs 的页面对象在量角器中编写 e2e 测试。已阅读许多关于此的 SO post，阅读 Julie 的页面以及研究 ProtractorPageObjects。

应用程序中的所有表都具有相同的结构。唯一的区别在于属性：数据行类型可以是 10 个可能值之一，例如 'job'、'node'、'rack' 等...

显然我可以将字符串传递给一个方法并在该方法中切换以构造正确的选择器。基于 ProTractorPageObjects 中的评论我试图不那样写代码。我在这里是不是很傻，只需使用字符串并继续使用它，还是有一种方法可以创建这样的方法而不必传入字符串？

在 ProTractorPageObjects 的第 5 章中，在 columns.js 文件中提到不要使用传入字符串的模式来确定要查找的内容。

例如：

<div id="ee54a74e-17b8-4380-bbd8-2a5087bad7c9" class="tableRow escale-table-row-selected" data-row-type="ipAddress" data-qa-row-number="1">
            <div class="tableCell">
                <span class=""></span>                    ips-172-20-143-20-21
            </div>
            <div class="tableCell">
                <span class=""></span>                    UP
            </div>
            <div class="tableCell">
                <span class=""></span>                    Yes
            </div>

...

另一个Table:

<div id="6f529383-c0f3-49b7-9ccb-c8db2b0c75a9" class="tableRow escale-table-row-selected" data-row-type="fileSystem" data-qa-row-number="0">
            <div class="tableCell">
                <span class=""></span>                    card-view<div><span class="fa fa-square success fileSystemIndicator"></span><span id="6f529383-c0f3-49b7-9ccb-c8db2b0c75a9-share" class="fa fa-square fileSystemIndicator success"></span><span id="6f529383-c0f3-49b7-9ccb-c8db2b0c75a9-accessRule" class="fa fa-square fileSystemIndicator success"></span></div>
            </div>
            <div class="tableCell">
                <span class=""></span>                    UP
            </div>
            <div class="tableCell">
                <span class=""></span>                    Yes
            </div>
 ......

Answer 1

完全可以根据传递到方法中然后用于匹配 div 元素的 data-row-type 属性的字符串值构造选择器。 data-row-type 属性在你的情况下是一个 "data-oriented" 属性（好吧，将它与 style 属性进行比较 - 这个非常面向 UI/style 并且始终是依赖定位器的糟糕选择）和独特的 distinguishes/defines 页面块在页面上。

示例实现：

function getTable (tableType) {
    return element(by.css("div[data-row-type='" + tableType + "']"));
}

示例用法：

getTable("ipAddress");
getTable("fileSystem");

protractor 创建一个 table 页面对象来处理具有不同选择器的 tables？

protractor create a table page object to process tables with different selectors?

javascript

selenium

protractor

end-to-end

pageobjects