limp_chimp limp_chimp - 3 months ago 312
AngularJS Question

How to use protractor to check if an element is visible?

I'm trying to test if an element is visible using protractor. Here's what the element looks like:

<i class="icon-spinner icon-spin ng-hide" ng-show="saving"></i>

When in the chrome console, I can use this jQuery selector to test if the element is visible:

<i class=​"icon-spinner icon-spin ng-hide" ng-show=​"saving">​</i>​
> $('[ng-show=saving].icon-spin:visible')

However, when I try to do the same in protractor, I get this error at runtime:

invalid element state: Failed to execute 'querySelectorAll' on 'Document':
'[ng-show=saving].icon-spin:visible' is not a valid selector.

Why is this not valid? How can I check for visibility using protractor?


This should do it:


Remember protractor's $ isn't jQuery and :visible is not yet a part of available CSS selectors + pseudo-selectors

More info at