alecxe alecxe - 3 months ago 62x
Javascript Question

Adding custom locator shortcuts in Protractor

In Protractor, there are

convenient shortcuts
for CSS selectors:

$(".myclass") // means: element(by.css(".myclass"))
$$(".myclass") // means: element.all(by.css(".myclass"))

Is it possible to introduce custom shortcuts for other locators?

To be more specific, what if we want to have a
shortcuts for "by repeater" calls. To be able to write:

$r("item in items")
$$r("item in items")

instead of:

element(by.repeater("item in items"))
element.all(by.repeater("item in items"))


To create a shortcut, add the custom locator on the global namespace and on the prototype of ElementFinder and ElementArrayFinder:

global.$r = function(selector) {
  return protractor.element(;

global.$$r = function(selector) {
  return protractor.element.all(;

ElementFinder.prototype.$$r = function(selector) {
  return this.all(;

ElementFinder.prototype.$r = function(selector) {
  return this.element(;

ElementArrayFinder.prototype.$$r = function(selector) {
  return this.all(;


$r("item in items")
$$r("item in items")
$("#id").$r("item in items")
$("#id").$$r("item in items")