I have seen in many examples like this $('.selector')
and I am also using this. So what this $ variable does. This is what I got from the protractor docs.
Calls to $ may be chained to find elements within a parent.
There is no example in docs which use $
alone. We are using $
to chain with element
selector.
Also $('.selector')
itself is an element, when we does this element($('.selector'))
, it is an error.
So how to use this $
selector in protractor. Does it have all the features of JQuery $
. I tried $('.selector').children
which says children
is not a function.
Any help is greatly appreciated.
Thanks!
We made updates to the Protractor's API for $. Also, there are several places in Protractor's specs that use chained $. See below (from spec/async_spec.js):
That looks like jQuery syntax but it is not, it's part of Protractor. That's why
.children
is throwing an error because we're not actually using jQuery.$
is a shorthanded version ofelement(by.css())
i.e.$('my-css');
is the exact same aselement(by.css('my-css'));
They also have
$$
which is the same aselement.all(by.css())
Despite the lack of documentation, it does not have to be used for chaining to find child elements. i.e. using Julie's protractor demo (I modified the example):
That prints out the title of the h3 element that I located. The
$
and$$
are simply a shorthand for css selectors.Source: here for $$, here for $, and here for more
Also this is a nice document I found (though it does not mention the use of
$$
: http://luxiyalu.com/protractor-locators-selectors/This is the correct API doc for $:
"Shortcut for querying the document directly with css.
element(by.css('.abc'))
is equivalent to$('.abc')
"http://www.protractortest.org/#/api?view=build$