量角器无法点击<a> element

Question

I have two embedded <span> elements inside an <a> element. I need to trigger a click event on the second <span>. The by.id method on the id classes I created didn't trigger a click. I also tried by.binding and that didn't work. help please?

The code:

<div class="add-player">
  <a href class="btn" data-ng-if="!currentUser.isAuthenticated && !vm.hasPendingInvitation">
    <span>Add Player</span>
  </a>
  <a href class="btn" id="invite" data-ng-if="currentUser.isAuthenticated && !vm.hasPendingInvitation">
    <span id="invite-player">Add Player</span>
  </a>
</div>

Answer 1

我们可以玩定位器：

$("div.add-player a span").click();
$("#invite-player").click();
element(by.xpath("//span[. = 'Add Player']")).click();

我们也可以wait for the element to be visible：

var addPlayer = $("div.add-player a span"),
    EC = protractor.ExpectedConditions;

browser.wait(EC.visibilityOf(addPlayer), 5000);
addPlayer.click();

我们也可以尝试点击通过JavaScript ：

browser.executeScript("arguments[0].click();", addPlayer.getWebElement());

或通过browser.actions()：

browser.actions().mouseMove(addPlayer).click().perform();

或点击前scroll into view：

browser.executeScript("arguments[0].scrollIntoView();", addPlayer.getWebElement());
addPlayer.click();

您还可以filter匹配定位器的可见元素：

var addPlayer = $$("#invite-player").filter(function (elm) {
    return elm.isDisplayed();
}).first();
addPlayer.click();