Question

我正在尝试使用Protractor使用Protractor编写端到端测试。我遇到了一个问题，我无法点击Angular Material md-tab项并加载它。相反，当我点击它时，我只得到一个空白区域，其中应显示标签内容。

我发现这个GitHub issue提供了一些可以解决问题的CSS，但即使使用CSS我的标签仍然没有加载。我尝试通过以下方式点击标签：

        element.all(By.css('md-tab-content')).then (tabs)->
          #browser.executeScript("#{tabs[1]}.click();")
          #browser.actions().click(tabs[1]).perform()
          #tabs[1].click()
          browser.actions().mouseMove(tabs[1], {x: -20, y: -20}).mouseDown().perform()

所有这些方法都会导致相同的悬挂问题。我根据GitHub响应添加的CSS是：

md-tabs-canvas {
  // Keeps IE11 from making `md-pagination-wrapper` as wide as the page.

  align-items: inherit;

  md-pagination-wrapper {
      width: auto !important;
  }
}

如果我使用browser.sleep(5000)并手动点击标签而不是尝试通过量角器单击标签，标签会完美加载，测试会按预期继续进行。

有谁知道如何使用量角器点击md-tab元素并让它正确加载内容？

Answer 1

我使用以下

单击我的e2e测试中的标签项而没有任何问题

element(by.css('md-tab-item:nth-child(1)')).click();

Answer 2

我在这里找到了一个很好的解决方案。只要做element(by.cssContainingText('.mat-tab-label', "<Tab Name>")).click();

无法在量角器

2 个答案: