Dollar Sign vs "$$()" Sparkling Protractor with "by.css()" vs "$()"

I'm a bit confused about the purposes of the $ and $$ commands. I initially thought they were just substitutes for 'by.css', but why use $$? 

<element id = "eId"></element>

Based on the example above, I assumed that these two lines are interchangeable:

element(by.css('#eId'));

and

element($('#eId'));

However, the first line works while the second one doesn't. So what sets them apart?

The documentation doesn't offer much clarity. It suggests that "$" is mainly used for chaining, like 

element(by.css('#eId')).element($('#childId'));
, which means "Select the first element, then select the second element within the first.' Nevertheless, there are instances where $ is used to select the initial element.

With all that said, it boils down to one question: "What makes by.css, $, and $$ different from each other?"

javascriptangularjsseleniumtestingprotractor

Answer №1

$ and $$ serve as convenient shortcuts.

$("selector") can be used instead of element(by.css("selector")).

$$("selector") functions as an alternative for element.all(by.css("selector")).

For your information, here is a quote from the source code:

ElementFinder.prototype.$ = function(selector) {
  return this.element(webdriver.By.css(selector));
};

ElementArrayFinder.prototype.$$ = function(selector) {
  return this.all(webdriver.By.css(selector));
};

The original commit that introduced this feature.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Creating dynamic routes for every page fetched from the API in Next.js

Hello everyone, Recently, my journey with NodeJS just commenced and I have been exploring API routes in NextJS as it provides an easy setup and clear visibility of the processes. While I have a grasp on creating basic get requests, I am now intrigued by s ...

javascriptnext.js

Tips for retrieving the text value on keyboard enter press without triggering form submission

I am currently working on a feature where hitting the Enter key in a textbox should not automatically submit the form. The textbox is located within a form: @Html.TextBoxFor(model => model.ID, new { @class = "form-control input-sm", placehold ...

javascriptjqueryasp.net-mvcdom-events

Having trouble pinpointing the issue with this particular if statement?

I am currently working on creating a form that compiles all entered data when the user fills out all fields. The form is connected to a PHP file and functions properly, but I encountered issues when implementing validation logic. The "Validation" section ...

javascriptphphtmlformsif-statement

Modifying Arrays with Different Data Structures in JavaScript

I am interested in implementing the following scenario: var A = ["Jon","Brad","Rachel"]; var B = ["Male","Male","Female"]; var C = [ {"Jon","Male"}, {"Brad","Male"}, {"Rachel","Female"} ] Can you guide me on how to retrieve var C using javascrip ...

javascriptangularjs

An error was encountered in compiler.js at line 1021, stating that an unexpected value 'UserService' was imported by the module 'UserModule'. It is recommended to add a @NgModule annotation to resolve this issue

As a PHP programmer new to Angular, I am facing an issue while trying to retrieve user properties from a Laravel API. When attempting this, I encountered the following error: compiler.js:1021 Uncaught Error: Unexpected value 'UserService' importe ...

javascriptangulartypescript

Is there a way to identify modifications in the DOM using jQuery UI Sortable?

My website is built using nodejs express and mongodb, and I am interested in integrating this library. I am curious about how I can detect changes in the order of elements to save their state. Should I use a form submission or jQuery functions? For exampl ...

javascriptjqueryjquery-ui

Upon updating my application from Angular 14 to 16, I encountered an overwhelming number of errors within the npm packages I had incorporated

After upgrading my angular application from v14 to v16, I encountered numerous peer dependencies issues, which led me to use the --force flag for the upgrade process. However, upon compiling, I am now faced with a multitude of errors as depicted in the scr ...

javascriptangulartypescriptnpmangular-ivy

I am having trouble figuring out how to open a new window using the Selenium Webdriver. Why am I struggling with

For some reason, I am experiencing an issue where I cannot navigate into a new window. Both the parent and child windows are displaying the same content. Here is the code I am using. Can you help identify what might be causing this problem? String paren ...

javaseleniumselenium-webdriverautomationwindow-handles

Tips for customizing the appearance of a jQuery sortable target list prior to dropping items

When using jquery sortable, I am able to customize a placeholder inside a connected list specified in the connectWith option to visualize where the content will be dropped. However, I am struggling to find a way to style the actual list that contains the p ...

javascriptjqueryhtmlcssjquery-ui-sortable

Ways to avoid encoding Unicode characters in JavaScript programming

When I retrieve data from an API, I receive a STRING like this: [ { "reason": "Invalid address", "email": "j\u00c3\u00a9r\u00c3\u00b4mel\u00c3\u00a4ufer@com" }, { "reason": "Invalid address", "email": ...

javascriptjsonunicodesendgridkoa

I am encountering a problem while performing JavaScript validations

In jQuery or using the element's ID, I can validate a textbox. For example: var field = document.getElementById('tbxSearchField').value if (field == "") {alert("please enter text");} The HTML code is as follows: <input class="input" id ...

javascriptjqueryhtml

What is the best way to transfer the revised page content to a different function?

I was working on some code using selenium-webdriver, here's a snippet: base_url = 'http://example.com' driver = webdriver.Chrome() driver.get(base_url) After entering the login credentials, I need to update the page with this code: btn ...

pythonseleniumselenium-webdriverbeautifulsouppython-requests

What is the best approach for organizing JavaScript/CoffeeScript in a Rails 5 project for optimal efficiency?

I am currently working on a web application with Rails 5.0.2 and I have a set of JS files for the project: https://i.stack.imgur.com/WYB23.png Each of my own JS files follows a similar pattern, like this: $(function () { var init = function () { ...

javascriptjqueryruby-on-railsruby-on-rails-5asset-pipeline

Issue with parsing JSONP using jQuery's AJAX request

I am encountering an issue with a jQuery ajax request that I have set up. Here is the code: jQuery.ajax({ url: serverAddress+'php/product.php', type: 'GET', jsonpCallback: "callback7", dataType: 'jsonp', d ...

javascriptjqueryajaxjsonp

Errors encountered during the Angular project build

I need help figuring out what's happening. I keep getting the same error while trying to build my project. I've already attempted deleting typings, angular directory, and performing typings install but nothing seems to be working. All the necess ...

angularjsnode.jsangularnpm

Troubleshooting a Vue.js issue: How to fix a watch function that stops working after modifying

I have encountered a problem with my code. It seems to be working fine initially after the beforeMount lifecycle hook, but when I try to modify the newDate variable within my methods, it doesn't seem to track the changes. data() { return { ...

javascriptvue.jsfrontend

"Encountering a problem with a CSS dropdown using Selenium WebDriver in C#, where the element should have been a select

Below is an example of HTML code: <div class="rowElem fullSize "> <div class="jqTransformSelectWrapper" style="z-index: 10; width: 276px;"> <div> <span style="width: 245px;">MasterCard</span> <a class="jqTransformSelectOpe ...

seleniumselenium-webdriver

Examining the relative placements of components

Displayed on the page I'm testing is a Support link: This link is coded in HTML as follows: <div class="ap-version-panel ap-version-support"> <a href="http://site/support.html" target="_blank" ng-keydown="ApVersionCtrl.keydownHandler($e ...

seleniumtestingselenium-webdriverprotractorend-to-end

What is the best way to cycle through a JSON array of objects using JavaScript and jQuery?

Currently, my focus is on understanding JavaScript and JSON objects along with arrays. One of the tasks assigned to me involves iterating through the following array: {"6784": {"OD": [ { "od_id":"587641", ...

javascriptjqueryarraysjson

Swiper - tips for managing navigation visibility based on screen size in React

I have implemented a React Typescript swiper slider styled with tailwind CSS. The slider functions correctly, but I am facing an issue when trying to hide and show the navigation buttons on different breakpoints. Initially, I use the 'hidden' cla ...

javascriptreactjstailwind-cssswiper.js