Unable to click on element at coordinates (x,y) with Protractor due to ng-change event

<select id="cbCategory" ui-select2 name="cbCategory" ng-model="categoryCombo.category" 
        class="show-tick form-control comboBlue" ng-change="loadPrice()" required>
    <option ng-repeat="category in Categories" value="{{category}}" 
            {{category.Name}}</option>
</select>

When the select element above does not have the ng-change attribute, it functions correctly with the following solutions:

1.

element.all(by.repeater('category in Categories').row(0)).click();

2.

element(by.id("cbCategory")).sendKeys('Category1');

However, when the ng-change attribute is included in the select element, both of these solutions do not work as expected.

Answer №1

Ensure to click the select element first before clicking on an option, for example:

var dropdown = element(by.id("cbCategory"));
dropdown.click();

var option = dropdown.all(by.tagName("option")).first();
option.click();

To simplify working with select and option elements, you might consider creating an abstraction, check out:

  • Select -> option abstraction

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

What could be causing this JSON object error I'm experiencing?

res.send({ customerDetails:{ fName, lName, }, applicantDetails:{ [ {primaryApplicant:{fName1,lName1}}, {secondaryApplicant:{fName2,lName2}}, {thirdA ...

The information from the form is not appearing in the req.body

Utilizing the mean.js framework, I have the bodyParser middleware configured as shown below: app.use(bodyParser.urlencoded({ extended: true })); app.use(bodyParser.json()); app.use(methodOverride()); Additionally, I am using formidable to upload imag ...

Transfer data from a file to a PHP file using the XMLHttpRequest object in JavaScript and receive

I'm attempting to use AJAX to send an image file to a PHP file. The issue is that even though the script sends the object, my parser isn't able to retrieve the $_FILES["avatar"]["name"] and tmp_name values. Is there a method to transfer the file ...

What steps can be taken to enhance the efficiency of this complex nested asynchronous loop?

The issue at hand involves an array of objects structured like this: let myObj = [ {'db1':['doc1','doc2','doc3']}, {'db2':['doc4','doc5']}, {'db3':['doc7','doc8 ...

Tips for displaying a category name only once if it has already been rendered in a map function

My scenario involves a variety of categories in which pharmaceutical drugs are classified. Each individual drug belongs to a specific class. Currently, my code iterates through all the categories from the category array and places drugs underneath them if ...

Is there a way to implement an onclick event for every iframe within a document using jquery?

I have a webpage containing two iframes that can be switched using a selector. My goal is to implement an onclick event that will trigger a URL for specific <rect> elements within the iframes. After reading a helpful post on accessing iframe childr ...

Is it possible to limit the values of parameters with react-router?

Currently, I am in the process of developing a website using react and react-router. I have two different types of routes set up, as shown below: <Route name="products" path="/:type/*" handler={ ProductList } /> <Route name="generic-template" p ...

javascript Submit username in React Form and save it upon submission

I'm facing an issue with a React component that contains a form. My task is to capture the username and save it using sessionstorage. Although I've attempted a solution, it seems like the data isn't getting saved. Here's my current cod ...

Should a checkbox be added prior to the hyperlink?

html tags <ul class="navmore"> <li><a href="link-1">Link 1</a></li> <li><a href="link-2">Link 2</a></li> </ul> Jquery Implementation in the footer $(".navmore li a").each(function(){ v ...

Building web navigation using a combination of HTML, JavaScript, and PHP within a category, sub

I've been struggling to find a detailed tutorial on implementing a dynamic website navigation system using javascript or php. It seems like every time I attempt to research this topic, I end up feeling confused and unsure of where to start. My goal i ...

What is causing my React Query query function to be activated even though it is supposed to be disabled?

My goal is to dynamically set parameters and select a fetching function within a React Query function (useSpeciesCodes.js). The decision of which API endpoint to fetch from (using either getSpeciesCodesByRegion or getSpeciesCodesByAddress) should be based ...

Java/Selenium error - Encountered java.lang.NullPointerException

Every time I run my test, I keep encountering a "java.lang.NullPointerException". How can I resolve this issue? I've tried looking at other resources but still facing some difficulties. Any assistance in solving this problem would be greatly appreciat ...

The git clone operation encounters a problem with the error message: unable to connect, connection refused on localhost port 80

Currently for my project, I'm utilizing isomorphic-git. However, when I try to implement the git.clone function, I encounter the error message Error: connect ECONNREFUSED 127.0.0.1:80. To provide an example of what I am attempting to achieve: import ...

Learn the process of dynamically extracting a targeted cell value from a table with Selenium and Python

Currently, I am developing an automation script using Selenium and Python with the following tasks: The script needs to dynamically read the rows and columns of a table. It should specifically search for a column (which remains constant) that contains a ...

Error encountered: No geographic indices found for executing a geoNear operation with Mongoose

Initially, I had divided the schemas but later nested them inside my overall document. Despite adding indexes and removing coordinates from location, there seems to be an issue with the nested points. Upon running get Indexes, it shows that there is an i ...

What is the best way to halt execution in Express.js following an error caught from an Await request?

While searching for a solution, I come across many posts that almost provide the answer I need, but nothing seems to quite work in my case. I have a function that uses asynchronous operations: const doStuff = async (data)=>{ if(data == "a bug& ...

jQuery iScroll: The scrolling feature does not stop when reaching the end of the content

Recently, I've been utilizing iScroll for horizontal scrolling on a list. At first, everything seems to be working fine, but as I scroll towards the end (right to left), the content reaches its conclusion yet the scrolling continues beyond that. I&apo ...

What is preventing me from mapping an array to Material UI Chip components?

I'm currently working with Next.js and I'm trying to map an array of elements to Material-UI chip components. However, when I compile the code, I encounter the following error: Error: Element type is invalid: expected a string (for built-in comp ...

implementing automatic ajax requests when user scrolls

This is a piece of JavaScript code: $(window).scroll(function() { $.ajax({ type: "GET", url: "not_data.php", data: dataString, success: function my_func () { //show new name ...

Cease the clicking action event

How do I terminate a mousedown function when the mouse is released? $('#manRun').mousedown(function(e3) { var manID = get_id(this); e3.preventDefault(); $(document).on('mousemove.moveMan', function(e2) { ...