Protractor is displaying an error message of "unable to locate element testability" when attempting to access an element

I'm encountering an issue with Protractor while trying to access a variable that stores the return value of "elements.all". As someone who is new to Protractor, I wasn't sure how to select elements by a custom attribute. Thankfully, I received some advice when I posted a question in another post. The suggestion I got was to try out - "element.all(by.css('[mycustom-id]'));". However, I am unsure if this statement is working because I keep getting a "Could not find testability for element" error. It's possible that I am incorrectly iterating through the object. Any help in pointing out my mistake would be greatly appreciated. Thank you.

Spec.JS

var settings = require(__dirname + '/setting.json');
describe('Protractor Demo App', function() { 
    var target = element.all(by.css('[mycustom-id]')); 

    beforeEach(function() {
       browser.get(settings.url);
    });     

    it('Test mouseover', function() {       

       // This does not work
       target.each(function(item){
          //Do some stuff here
       });     

       // This does not work either
       target.count().then(function(x){
         console.log("Total--" + x);
       });
    });

});

index.html

<div>
    <a mycustom-id="123" href=''>HELLO1</a>
    <a mycustom-id="211" href=''>HELLO2</a>
</div>

Answer №1

My resolution involved adjusting a setting in the configuration file to address this error. For those encountering a similar issue, be sure to set useAllAngular2AppRoots to true as needed.

Answer №2

A common best practice is to keep your code within Jasmine functions such as it(), beforeAll(), etc. Protractor relies on these functions to properly manage the control flow.

It seems like in this case, webElements are being created prematurely. To resolve this issue, consider moving your element locator inside the it() block.

it('Test mouseover', function() {       
   var target = element.all(by.css('[mycustom-id]')); 
   target.each(function(item){
      //Make changes here
   });
});

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

Ensure the computed variable is always up-to-date using Firebase in VueJS

After a successful sign-in through Firebase authentication, I need to update a navigation link. The user login changes are managed within the created hook using .onAuthStateChanged() data () { return { user: null, additionaluserinfo: nul ...

Updating a component when a prop changes

Embarking on my journey into the world of React, I find myself in need of assistance. The issue at hand involves re-rendering data within my Table component. Whenever a new API call is made to create an entry in my database using Prisma, the newly added d ...

Enhance your checkbox and radio components with React Higher Order Components (H

I'm in the process of designing my own custom checkbox and radio components to ensure reusability. This is what I have so far: import React, { Component } from 'react' export class Checkbox extends Component { render() { return ...

Create a bookmarklet for Webdriver when initializing the driver, or store the bookmarklet in your saved bookmarks, all done without the need to

Need Help Adding Custom Bookmarklet to Webdriver I am looking for a way to include a custom bookmarklet (a bookmark that consists of pure JavaScript code) in a webdriver so it appears on the bookmarks toolbar. I would like to achieve this either during th ...

Calculating the percentage difference between two dates to accurately represent timeline chart bar data

I am in the process of creating a unique horizontal timeline chart that visually represents the time span of milestones based on their start and finish dates. Each bar on the timeline corresponds to a milestone, and each rectangle behind the bars signifies ...

Is the drop down click feature malfunctioning in Selenium Java WebDriver?

Can someone please help me identify what is going wrong in my code? WebElement dropdown = driver.findElement(By.xpath("//*[@id='idCallType_100']")); List<WebElement> Options = dropdown.findElements(By.tagName("option")); ...

Transform them into async/await in JavaScript

Exploring the promise-retry library, I discovered the following syntax: promiseRetry(function (retry, number) { return doSomething() .catch(retry); }) .then(function (value) { // .. }, function (err) { // .. }); Since I am utilizing a ...

Looking to merge two components into one single form using Angular?

I am currently developing an Angular application with a dynamic form feature. The data for the dynamic form is loaded through JSON, which is divided into two parts: part 1 and part 2. // JSON Data Part 1 jsonDataPart1: any = [ { "e ...

Having Multiple File Inputs [type=file] in one webpage

Is it possible to have two separate inputs for uploading images, each setting a different background image in a div? The second file input is: <input type='file' id='getval' name="logo" /> I want this file to be set as the back ...

Discover multiple keys within a new Map object

Our usual approach involves creating a new Map like this: const hash = new Map() hash.set(key,value) To retrieve the information, we simply use: hash.get(specificKey) An advantage of using Map is that we have flexibility in choosing keys and values. Cur ...

Navigate a first person simulation using three.js and control your movements with the keyboard arrow

To access my reference material, please go to http://jsfiddle.net/fYtwf/ Overview I am working on a basic 3D simulation using three.js where the camera is surrounded by cubes in three dimensions. These cubes serve as a visual guide to where the camera is ...

"Enhance your networking capabilities with a Node.js HTTP proxy featuring a dynamic proxy

I'm attempting to make websockets function properly with node-http-proxy. The unique aspect is that I am using a proxy table configuration: var options = { router: { 'a.websterten.com': '127.0.0.1:150', 'b.websterten. ...

Two commands, a set of matching controllers, and an identical templateUrl

As a beginner in AngularJS, I am facing a challenge where I need to use one template for two directives. The issue is that the behavior of the first directive overrides the second one, even though I have specified different controllers for each. This seems ...

Determine whether the function name in a given string matches a JavaScript or PHP

I am currently attempting to highlight code and eventually sanitize the HTML, but I am encountering an issue with my regex not matching just the function name and parameters. Regex is not my strong suit and can be quite confusing for me. Additionally, when ...

Is there a way to enable drag and drop functionality on a dynamically created table using AJAX?

I have been successfully using the TableDnD plugin for drag and drop functionality on table rows. However, I am now facing an issue with dynamically generated tables via AJAX. The code doesn't seem to work as expected when it comes to drag and droppin ...

Update a specific HTML element when the result of an equation is modified

I need assistance with my angularjs website development project. I have implemented content-specific tabs, each with its own unique content. When a tab is selected, only the corresponding content should be displayed. The tabs are assigned IDs in the contro ...

What is the best approach for developing an npm package containing multiple Vue directives? Should each directive have its own separate package, or should they

While I have successfully created an npm package by exporting a single vue directive in the src/index.js file, I am now faced with the challenge of creating a package that allows for the use of multiple vue directives. Unfortunately, I have been unable t ...

What is causing the chat-widget to display a null value for the style read property?

Could someone assist me with hiding the Widget-chat? I keep getting an error that the property of style is null. Any help would be greatly appreciated. Thank you in advance. document.getElementById("chat-widget").style.display='none'; ...

Having trouble with your Bootstrap 4 Dropdown Menu?

I attempted to implement the dropdown menu example from Bootstrap 4, but unfortunately it does not seem to be working as expected. The dropdown menu does not appear when clicked. <li class="nav-item dropdown"> <a class="nav-link dropdown-to ...

Changing the data type of a column in an Excel file from XLSX to

I am currently working with the XLSX npm package and attempting to download a sample Excel file, add some data to it, and then upload it back. The fields in the file include MOBILE NUMBER, DATE, TIME, and NAME. When I upload the file, the values for the DA ...