J. Chang J. Chang - 2 months ago 27
HTML Question

Protractor: How do I click on an element using the href substring or span substring?

The following lines is information of the element I want to be able to click on using protractor.

<hsx-nav-menu-group hsx-html-element> == $0
<hsx-nav-menu-info>
<i hsx-html-element hsx-icon>
<svg>
<use xlink:href="#icon-so"></use>
</svg>
</i>
<span>Service Orders</span>
</hsx-nav-menu-info>
</div>


I have been able to click on it via the xpath but I wanted to locate and click the element preferably with the href substring or the span subtring.

Answer

I wanted to locate and click the element preferably with the href substring or the span subtring

Let's use the Service Orders text to create a locator:

element(by.xpath("//hsx-nav-menu-info[span = 'Service Orders']"));

This is still an XPath expression though.


Alternatively, you can use filter():

$$("hsx-nav-menu-info").filter(function (useElm) {
    return useElm.$("use").getAttribute("xlink:href").then(function (href) {
        return href === "#icon-so";
    });
}).first().click();