javascript - 识别切换栏元素文本并在 Protractor 中单击它

Question

我正在尝试测试单击作为切换栏一部分的文本以打开其部分。

源代码是这样的:

<h3 class="hdg hdg--3 hdg--muted">
Projects
<span class="toggleBar__toggle--icon toggleBar__icon--isOpen" data-ng-  class="{'toggleBar__icon--isOpen' : isVisible}"></span>
</h3>

代码是用 Javascript 编写的，我用它来测试 Protractor :

element(by.cssContainingText('h3', 'Projects')).click();

运行测试时，出现以下错误:

No element found using locator by.cssContainingText("h3", "Projects")

可能是什么问题？

Answer 1

恐怕，这是需要 XPath 的情况之一:

element(by.xpath("//h3[.//text()[normalize-space(.) = 'Projects']]")).click();

或者，如果您需要单击内部的 span 元素:

element(by.xpath("//h3[.//text()[normalize-space(.) = 'Projects']]/span")).click();

<小时/>

Both the commands work when i execute in debug mode. But, when i run it in normal, i get an error saying element not clickable at so and so point. Some other element accepts click.......

这意味着这是一个时间问题。添加等待:

var EC = protractor.ExpectedConditions;
var elm = element(by.xpath("//h3[.//text()[normalize-space(.) = 'Projects']]"));
browser.wait(EC.elementToBeClickable(elm), 5000);
elm.click();