NightWatch.js - 根据相对css定位器获取子WebElements列表

时间:2015-06-22 18:40:46

标签: javascript css css-selectors pageobjects nightwatch.js

大家好,所有NightWatch采用者,

我正在尝试使用以下格式解析表格以获取行列表和每行中的单元格

<tbody> 
  <tr> // 1 row
    <td>Item A</td> // name
    <td>John</td> // owner
    <td>Monday</td> // create date
  </tr>
  <tr> // 2 row
    <td>Item B</td>
    <td>Mary</td>
    <td>Tuesday</td>
  </tr>
</tbody> 

现在代码看起来像是调用下面的函数。

browser.elements('css selector', 'tbody tr', getResultsList);

我的解析功能现在看起来像这样。

function getResultsList(rowResults){
    // Here we get the correct set of rows 
    console.log(rowResults.length + ' rows found'); // this returns 2


    // Main loop going through the rows
    for(var i = 0; i < rowResults.value.length; i++) {
        var row = rowResults.value[i];
        console.log(row.value + ' -- row item');
        // need to get the <td> inside row
    }
}

在Java webdriver中,我们可以执行以下操作

List<WebElements> rows = driver.getElements("tbody tr");
    for (WebElement row : rows) {
        row.getElement(' > td:nth-child(1)') // name
        row.getElement(' > td:nth-child(2)') // creator
        row.getElement(' > td:nth-child(3)') // date
    }

我想知道在NightWatchJS中是否有任何直接的方法可以通过子WebElement在Java中执行此操作,我们只需调用startingWebElement.getElement(childlocator);而无需从顶部开始,动态构建/链接定位器,例如

// name
browser.getText('css selector', 'tbody tr:nth-child('+i+') td:nth-child(1)')
// creator
browser.getText('css selector', 'tbody tr:nth-child('+i+') td:nth-child(2)')
// date
browser.getText('css selector', 'tbody tr:nth-child('+i+') td:nth-child(4)')

非常感谢任何评论,建议,关注点和提示。

1 个答案:

答案 0 :(得分:2)

看看这是否适合你:

Page.getTableRows((rows) => {  
  rows.forEach((row) => {
    client.elementIdElements(row.ELEMENT, 'tag name', 'td', (result) => {
      console.log(`row td length ${result.value.length}`);
      result.value.forEach((cell) => {
        client.elementIdText(cell.ELEMENT, (text) => {
          console.log(`cell text ${text.value}`);
        })
      });
    });
  });
});`

getTableRows的实现

getTableRows(callback) {
  this.api.elements('css selector', \`${this.elements.table.selector} tbody tr\`, (data) => {

    if(data.state === 'success'){
      callback.call(this, data.value);
    }
  });
},