Finding an element with Protractor by executing JS script

My objective is to retrieve a drop-down list of elements. Despite trying Protractor's methods, I struggled to easily locate isolate-span elements. Due to this, I am now turning to JavaScript code:

var my_js_element = browser.executeScript(jQuery("td.ng-binding>div.b-combobox.ps-list-drop-single-autocomplete.ng-isolate-scope.ng-pristine.ng-required.ng-invalid.ng-invalid-required").isolateScope().psListDrop.toggleVisible(true).element);

Unfortunately, this approach is not yielding results. I am uncertain whether I can actually obtain elements using this method. Is this the case? Does anyone have suggestions on how I can accomplish this task?

javascriptangularjsselenium-webdriverprotractor

Answer №1

As stated in the documentation for browser.executeScript:

If the script returns a value (i.e. contains a return statement), the value will resolve to a webdriver.WebElement for an HTML element.

When using executeScript, make sure to return an HTML element that is a "native" DOM element, which can then be converted to a webdriver.WebElement. This element will be resolved through promises and can be accessed as an argument in a .then() callback:

browser.executeScript(function () {

    var element = jQuery('.world').get(0); // get the "native" DOM node

    return element; // explicitly return the element

}).then(function (webElement) {

    expect(webElement.getText()).toContain('Hello');

});

Answer №2

Protractor is actually based on the WebDriver specification.

In line with the specification, scripts can indeed return values upon execution. These values may be in JSON format, requiring conversion back to their original form. For additional information, refer to this resource.

Consider logging the returned value and possibly utilizing an XPATH selector to pinpoint your desired element.

Perhaps try something along the lines of:

//td[class="ng-binding"]/div[class="b-combobox" and class="ps-list-drop ...]

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

Having trouble getting Node/Express to respond to POST requests

I am currently working on an AngularJS front-end communicating with a Node/Express/MySQL backend. All requests are functioning properly except for a POST request. Below is the Angular code I have: var Data = $resource('http://127.0.0.1:9001/api/data_ ...

mysqlnode.jsangularjsexpress

I'm having trouble resolving Selenium setup problems. There seems to be an exception occurring in the main thread, saying "Failed to connect to localhost

I am facing an issue with my Selenium setup. When I try to execute Firefox tests, I encounter the following error: Exception in thread "main" org.openqa.selenium.WebDriverException: java.net.ConnectException: Failed to connect to localhost. However, ...

javaseleniumselenium-webdrivergeckodriver

Save an automatically generated number into a variable and use it to reference an image file for display. This process can be accomplished using JavaScript

I'm having trouble getting my images to display randomly on a page. The images are named 0 - 9.png and I am using a pre-made function for random number generation. However, when I try to call on this function later down the page, nothing appears. It ...

javascripthtmlfunctionrandom

Is there a way to dynamically adjust the height of a DIV block?

I have a situation where I need the height of one div to automatically adjust based on changes in the height of another div. var height = jQuery('#leftcol').height(); height += 20; jQuery('.rightcol-botbg').height(height); Unfortun ...

javascripthtml

Connecting a text input in a nested component to the data passed down from its parent component in VueJS

My VueJS setup involves a child component sending data to a parent component, which then tries to route the data to a sibling of the child to create new components. I'm using a dictionary to group the data and push it into an array. The array is then ...

javascriptvue.jsvuejs2

Node.js accepts JSON data sent via XMLHttpRequest

I have successfully implemented a post method using xmlhttprequest: var xhttp = new XMLHttpRequest() xhttp.onreadystatechange = function () { if (this.readyState === 4 && this.status === 200) { console.log('Request finished. Pro ...

javascriptjsonnode.js

Basic inquiries concerning Vue.js and JavaScript

Hey there, I recently developed a small app to practice my Vue skills. However, there are a few features that I would like to implement but I'm not sure how to do it just yet. <div class="container" id="app"> <div class="row"> <d ...

javascripthtmlvue.jsvuejs2

Interacting with a C# Web Service Using JQuery

I've set up a JSON web service in C# and I'm working on creating a custom HTML page to interact with it. http://localhost:25524/DBService.svc/json/db=TestDB/query=none When I input this URL into my browser, I expect to receive JSON formatted da ...

c#javascriptjqueryjsonwcf

SyntaxError: Unexpected symbol

I have an issue with the following code: let op = data.map(({usp-custom-90})=> usp-custom-90 ) When I run it, I encounter the following error: Uncaught SyntaxError: Unexpected token - I attempted to fix it by replacing the dash with –, but t ...

javascriptjquery

I created some jQuery code that modifies a button when it is hovered over, however, I ended up writing the code individually for each button. What steps can I take to turn it

Is there a way to turn the code for each button on my website into a jQuery function that can be applied to any button? This is how the code currently appears: $(document).ready(function() { $("#linkXML").hover( function() { ...

javascriptjqueryhtmlcss

Prevent overlapping of nodes and edges in a D3 force-directed layout

Check out this fascinating example at http://bl.ocks.org/mbostock/1747543: In the demonstration, Mike illustrates how to prevent nodes from colliding with each other in a graph. I'm curious if it's feasible to also prevent collisions between no ...

javascriptalgorithmd3.jsforce-layoutgraph-layout

Discovering the most cost-effective combination algorithm

Looking for two numbers, P and Q, in a given array N with at least 5 items where 0 < P < Q < N - 1. Consider the following array: const N = [1, 9, 4, 5, 8]; If P = 1 , Q = 2 , then the cost is N[P] + N[Q] = N[1] + N[2] = 9 + 4 = 13 If P = 1, Q ...

javascriptarraysalgorithmperformancetime-complexity

Should data validations be implemented on both the client-side and server-side for optimal security and accuracy?

My query is related to utilizing Angular on the client side and Laravel API on the server side. I'm wondering if it is more effective to implement data validations on both ends. ...

javascriptphpangularjsvalidation

Interactive section for user input

I am looking to add a commenting feature to my website that allows for dynamic editing. Essentially, I want users to be able to click on an "Edit" span next to a comment and have it transform into an editable textarea. Once the user makes their changes and ...

javascriptjqueryhtml

The search box output will be the same as the JSON result

I have a server in Node.js that is able to read and process a JSON file containing various data, including unique user IDs. I have incorporated a search box into my HTML page, and I am seeking assistance with creating a jQuery method (which will require AJ ...

javascriptjqueryjsonajaxnode.js

Get ready for 10 AM with the RxJS timer function

I am trying to figure out how to schedule a method in my code using rxjs/timer. Specifically, I want the method to run at precisely 10 AM after an initial delay of 1 minute. However, my current implementation is running every 2 minutes after a 1-minute d ...

javascriptangulartypescriptrxjsobservable

Using res.locals with TypeScript in Next.js and Express

In my express - next.js application, I am transferring some configuration from the server to the client using res.locals. My project is written in typescript and I am utilizing "@types/next": "^8.0.6". The issue at hand: typescript is throwing an error st ...

javascriptreactjstypescriptexpress

The printing function for the window system can cause disruptions to the layout of the table

After creating a page with a simple table that can be filled in and printed, I noticed some issues with the table formatting after printing. The intended table design was supposed to look like this: https://i.stack.imgur.com/aAk89.png However, upon print ...

javascripthtmljquerycss

Having trouble with Express router behaving unexpectedly in a subdirectory

In my Node.js app, I have organized my API queries by modules. This structure is reflected in the index.js file as follows: app.use('/api/schedule/', apiSchedule); Within the apiSchedule router, I have defined different route handlers: router. ...

javascriptnode.jsexpressroutes

`I am experiencing issues with the HTTP Post functionality`

Whenever I click on the button displayed in the index.html code, an error occurs when the "$http.post" call is made. The web page then displays an alert saying 'Error!', preventing me from saving the new JSON file due to this issue. I need help ...

javascriptjqueryangularjs