jmd1002 jmd1002 - 22 days ago 8
Javascript Question

How can this element button be clicked using protractor?

I'm trying to select this button using protractor:

<button tabindex="-1" type="button" class="btn btn-default pull-left" ng-click="$arrowAction(-1, 0)">

<i class="glyphicon glyphicon-chevron-up">
</i>

</button>


the only unique element in this is
ng-click="$arrowAction(-1, 0)"


Nothing I have tried works:

element(by.css("//button[@ng-click='$arrowAction(-1, 0)']")).click();

Answer Source

//button[@ng-click='$arrowAction(-1, 0)'] is not a valid CSS selector. It actually looks like this is an XPath expression and you meant to use by.xpath() locator.

You can though use the partial attribute check instead:

$("button[ng-click*=arrowAction]").click();

$ here is a shortcut to element(by.css(...)), *= means "contains".

Or, do an exact match:

$("button[ng-click='$arrowAction(-1, 0)']").click();

I still don't like the location technique used in this case, but, given what we have, it is probably the best we can do. Ideally, if you have control over the application code and templates, add a meaningful id, class or a custom data attribute to uniquely identify the element.