无法识别我试图点击Angular页面的元素

Question

我正在编写一个Protractor测试，无法识别我想在Angular页面上单击的按钮。当我在此按钮上检查元素时，我附加了按钮的屏幕截图以及我在Chrome中看到的内容。这个页面上有4个按钮，它们彼此相邻，我无法区分它们。当我检查元素时，它们看起来都一样。在我的代码中，我可以使用CSS来查找此元素，还是必须使用不同的标识符？

在我的测试中，我想点击“新记录”按钮

Answer 1

如果您没有正确的唯一标识符，至少有两种方法可以执行此操作

<强> 1。 element（by.buttonText（'New Record'））

评论中已经提到过这一点，另请参阅the docs

<强> 2。使用

为其创建方法

您可以使用filter创建一个方法，类似这样

/**
 * Get a specific tile based on a given search string
 * or a element number
 * @param {number | string } needle
 * @return {ElementFinder}
 */
function getTile(needle) {
  var tiles = $$('md-grd-tile');

  // Just a quick and dirty check, better to use
  // lodash for it with `_.isNumber(needle)`
  if (!isNaN(parseFloat(needle))) {
    return tiles.get(needle);
  }

  return tiles.filter(function(tile) {
    return tile.getText()
      .then(function(text) {
        return text.indexOf(needle) > -1;
      });
  }).first();

  // If you use arrow functions it will be this
  //return tiles.filter(
  //  (tile) => tile.getText()
  //    .then((text) => text.indexOf(needle) > -1)).first();
}

// You can then use it like this
getTile('New Record').click();

// Or like this
getTile(0).click();

使用过滤器，您可以或提供所需的图块编号（以0开头）或提供图块按钮/描述的（部分）文本。

希望有所帮助