如何使用Nightwatch/Selenium通过XPath统计React Table的行数并做校验？

问题根因 #

你之前修改的XPath写法逻辑错误：[contains(@class, 'rt-tr-group') <10]是将单个元素的class属性匹配结果和10做数值比较，完全不符合统计元素集合总数量的需求，因此返回0条结果是正常的。

实现方案 #

方案1：使用Nightwatch API校验元素数量（推荐） #

直接用Nightwatch自带的elements方法获取所有匹配的行元素，读取元素数组长度做断言即可，逻辑直观易维护，代码示例如下：

const TableRows = `.//div[contains(@class, 'open-returns')]//div[contains(@class, 'rt-tr-group')]`
return client.useXpath()
  .waitForElementVisible(TableRows) // 先确保表格行加载完成
  .elements('xpath', TableRows, function (result) {
    const rowCount = result.value.length;
    // 断言行数小于10，不符合时自动抛出测试失败
    client.assert.ok(rowCount < 10, `表格实际行数为${rowCount}，需小于10`);
  });

方案2：纯XPath实现数量校验 #

如果需要直接通过XPath返回结果判断是否符合条件，可以用count()函数统计节点总数，正确的XPath写法如下，该表达式会在行数小于10时返回所有匹配的行元素，否则返回空集：

.//div[contains(@class, 'open-returns')]//div[contains(@class, 'rt-tr-group')][count(../../div[contains(@class, 'rt-tr-group')]) < 10]

也可以简化为直接判断容器是否符合行数条件的写法：

.//div[contains(@class, 'open-returns')][count(.//div[contains(@class, 'rt-tr-group')]) < 10]

内容的提问来源于stack exchange，提问作者Neil Kelsey