量角器中的“$”选择器

Question

我见过很多这样的例子$('.selector')，我也在用这个。那么这个 $ 变量做了什么。这是我从量角器得到的 docs.

Calls to $ may be chained to find elements within a parent.

文档中没有单独使用$的例子。我们正在使用 $ 与 element 选择器链接。

另外$('.selector')本身就是一个元素，当我们这样做element($('.selector'))时，就报错了

那么如何在量角器中使用这个 $ 选择器。它是否具有JQuery $的所有功能。我试过 $('.selector').children 说 children 不是函数。

非常感谢任何帮助。

谢谢！

Answer 1

看起来 像 jQuery 语法，但它不是，它是 Protractor 的一部分。这就是 .children 抛出错误的原因，因为我们实际上并没有使用 jQuery。 $ 是 element(by.css()) 的 shorthanded 版本，即

$('my-css'); 与 element(by.css('my-css'));

完全相同

他们也有 $$ 与 element.all(by.css())

相同

尽管缺少文档，但确实不是 必须使用 链接来查找 child 元素。即使用 Julie 的量角器演示（我修改了示例）：

describe('Protractor Demo App', function() {
  it('read the header', function() {
    browser.get('http://juliemr.github.io/protractor-demo/');
    $('h3').getText().then(function (val) {
      console.log(val);
    });
  });
});

打印出我找到的 h3 元素的标题。 $ 和 $$ 只是 css 选择器的 shorthand。

来源：here for $$, here for $, and here for more

这也是我找到的一个很好的文档（虽然它没有提到 $$ 的使用：http://luxiyalu.com/protractor-locators-selectors/

Answer 2

这是 $:

的正确 API 文档

"Shortcut for querying the document directly with css. element(by.css('.abc')) is equivalent to $('.abc')"

http://www.protractortest.org/#/api?view=build$

Answer 3

我们更新了 $. Also, there are several places in Protractor's specs that use chained $. See below (from spec/async_spec.js 的量角器 API:

  it('should work with synchronous actions', function() {
    var increment = $('#increment');
    increment.$('.action').click();

    expect(increment.$('.val').getText()).toEqual('1');
  });

量角器中的“$”选择器

'$' selector in Protractor

angularjs

angularjs-e2e

protractor

gulp-protractor