Differences in outcomes have been observed between the elementLocated and findElements functions

Currently, I am in the process of developing Webdriver automation for a specific web application. As part of this process, I have created a test that seems to be functioning well most of the time but occasionally encounters an issue.

it('verifies presence of five items', async function(done) {
  try {
    await driver.wait(until.elementLocated(By.className('item-class')),5000);
    const items = await driver.findElements(By.className('item-class'));
    expect(items.length).toBe(5);
    done();
  }
  catch(err) {
    console.log(err)
  }
}

The problem arises when the test fails with the following message:

Expected 0 to be 5.

Situations where there are zero items present on the page at the time of expectation seem perplexing based on my understanding. I anticipated that by using the initial code line to ensure the existence of these items, encountering a scenario where no items were found should not be possible during the subsequent expect() call.

This situation raises several questions:

1) What crucial detail or concept might I be overlooking that makes such an outcome feasible?
2) Is there potentially a more effective strategy or technique that could be utilized to delay execution until the expected number of items are visible on the screen?

Answer №1

After examining the source code, I discovered that elementLocatedBy in fact utilizes findElements. You can view this at this link. As a result, when findElements returns an empty array after the timeout period, it is expected to yield a count of 0 (I learned something new today).

If you prefer not using findElements, consider crafting your own solution or leveraging existing methods from here.

driver.wait(async function() {
  const items = await driver.findElements(By.className('item-class'))
  return items.length > 0;
}, 5000);

Answer №2

One effective approach to resolving this issue is to:

try {
const items = await driver.wait(until.elementsLocated(By.className('item-class')));
return items.length > 0;
}
catch(err) {
    console.log(err)
}

This method ensures that all elements are located before proceeding, returning an array of items (note: without await, it returns an array of promises). There is no timeout set, so it will continue waiting until all elements are ready (or a limit can be imposed for troubleshooting purposes).

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

Material-ui does not adjust Typography color based on the theme selected

Exploring material-ui, I have implemented two themes: const darkTheme = createMuiTheme({ palette: { type: "dark" } }); const lightTheme = createMuiTheme({ palette: { type: "light" } }); However, when utilizing the Typography component, t ...

Adjust the navigation menu to display or hide as the page is being scrolled

Implementing an offset to display/hide the navigation menu when the page is scrolled 100px. Attempted to modify from lastScroll = 0 to lastScroll = 100 but it did not work as expected. Jquery: Fiddle // Script lastScroll = 0; $(window).on('scroll&ap ...

Error encountered: Unable to locate module 'psl'

I'm encountering an issue when trying to execute a pre-existing project. The error message I keep receiving can be viewed in the following error logs image Whenever I attempt to run "npm i", this error arises and I would greatly appreciate it if some ...

Tips for creating xpath expressions with a dynamic variable

Within the scope of this question, I am faced with an xpath that looks like xpath= //*[@id='00QE000000gQ9fv_ACTION_COLUMN']/a[2]/span. It is worth noting that in the mentioned xpath, 00QE000000gQ9fv is subject to change while _ACTION_COLUMN remai ...

Importing JSON Data into an HTML File

I need to load a JSON file containing HTML content into my main HTML file upon clicking a button. ABC.json includes: <li><img src="images/picture6.jpg" /></li> <li><img src="images/picture5.jpg" /></li> <li><i ...

Delete the content on a webpage using an Ajax jQuery request to transfer it elsewhere

Whenever I submit a form using an ajax post request, I receive values from the controller and manipulate the page based on those values. However, my issue is that I need to erase the values from the previous request when the form is submitted again. For in ...

Ways to Implement Named Module Exports in Node.js Version 16 Application

Currently, I am working with Node 16.3.0 and Express 4.17.1 (although the Node version is open to change) In my project, I have a file named session.js structured as follows: // session.js exports.fetchUserId = async function(token){ ... } exports.sav ...

Tips and tricks for retaining the collapsed state upon reloading Bootstrap 5

Just diving into the world of bootstrap and javascript. How do I save the collapsed state to make sure it stays even after refreshing the page? <p> <button class="btn btn-primary" type="button" data-bs-toggle="collapse&q ...

Tips for adjusting the search bar's position on a mobile device when it is activated by the user

I need help with an open source project where I am developing a search engine using Angular. When using smaller screen sizes, the search bar is positioned in the middle but gets hidden behind the keyboard terminal when clicked on. Can anyone advise on ho ...

Altering the color scheme of a specific column within a stacked bar chart using C3.js

I'm currently facing a challenge with highlighting specific values in a c3.js stacked bar chart. While I was able to change the color of an individual bar in a non-stacked bar following this example, I'm struggling to determine how to identify th ...

Load information into array for jqGrid display

I am attempting to populate my JQgrid with data every time I click the "1" button, but I am encountering difficulties. As a newbie in jQuery, I am able to display the data in a p tag without any issues. Currently, I am considering whether to use push or a ...

Unable to display menu content text using jQuery

Currently experimenting with jQuery to create a dynamic submenu. The goal is to have a sub menu appear when the main menu is clicked, and then disappear when an item in the sub menu is selected, revealing additional information within a div. Unfortunately, ...

Exploring the realm of arrays in jQuery and JavaScript

Seeking assistance as a beginner in Javascript/jQuery, I am looking for guidance on the following challenge: I have created a basic form with 7 questions, each containing 3 radio buttons/answers (except for question 5 which has 8 possible choices). My goa ...

"Want to know how to control a JavaScript onClick event to play and pause? Find

Being new to JavaScript, I am curious about how I can Play and Pause a JavaScript on an HTML page. In my first JavaScript file, I have a toggle button that onClick show/hides a div element tag, as shown below: $(function () { $(".toggleSideba ...

The StateProvider is giving back an iteration that is undefined

AppContext.js import React, { createContext, useContext, useReducer } from "react"; // Initialize the appContext export const AppContext = createContext(); // Wrap the app and set up the App Context export const AppProvider = ({ reducer, initia ...

Why is it not possible to pass references when utilizing a self-invoking function?

I have been experimenting with the IIFE pattern for some of my modules lately and encountered a problem that has stumped me. In my current project, I need to pass a few global variables for usage. One of these is the global googletag variable which initial ...

What is the best way to incorporate template literals (` `) into existing template literals?

I am facing a unique challenge where I need to utilize a template literal within another template literal, but I am struggling to make it work. The code snippet in question looks like this: <p>Something something <a href={`${SOMELINK}/blah`}> ...

Functionality of the Parameters Object

As I transition from using the params hash in Rails to learning Node/Express, I find myself confused about how it all works. The Express.js documentation provides some insight: 'This property is an array containing properties mapped to the named rout ...

Try to refrain from invoking effect within a component that is being conditionally rendered

I have a particular component that I am working with: const Component = () => { useEffect(() => { console.log('Executing useEffect in the Component') }, []) return <Text>element</Text>; } Whenever I conditionally re ...

Discover the steps required to activate remote debugging with headless chrome while utilizing Ruby and Selenium

Whenever I try to include the "--remote-debugging-port" option, it throws an error. Surprisingly, everything works fine without this option. The challenge here is that I need to debug while using headless chrome. Any suggestions on how to achieve this? .r ...