Exploring Scrollbar Components with CSS Selector in Selenium

Here is an xpath used to access scroll bar elements:

/html/body/div/div[3]/div/div[2]/div[2]/div[1]/table/tbody/tr/td/table/tbody/tr[5]/td/div/table[4]/tbody/tr/td/table/tbody/tr/td[3]/div/div/div/div[4]/div[1]/div[3]

I captured this xpath with Firepath, but it's lengthy and subject to change. I'm interested in accessing these elements using a css selector, however, I'm not sure how to do it. Below is part of the HTML file containing the scrollbar:

Question: How can I navigate to the Home, Previous, Next, End buttons starting from the 'class="z-biglistbox-one z-biglistbox" '? The previous xpath accessed the Next button. If you have any suggestions on how to achieve this, please share. Thank you.

<div id="pRCQhu3" class="z-biglistbox-one z-biglistbox" style="width:1100px;height:800px;">
   <div class="z-biglistbox-outer">
       <div id="pRCQhu3-head" class="z-biglistbox-head-outer">
       <div id="pRCQhu3-body" class="z-biglistbox-body-outer" style="height: 653px;">
       <a id="pRCQhu3-a" class="z-focus-a" style="top:0px;left:0px" onclick="return false;" href="javascript:;"></a>
       <div id="pRCQhu3-vbar" class="z-biglistbox-wscroll-vertical">
       <div id="pRCQhu3-hbar" class="z-biglistbox-wscroll-horizontal">
            <div class="z-biglistbox-wscroll-drag" style="left: 0px;">
               <div class="z-biglistbox-wscroll-home" title="Home"></div>
               <div class="z-biglistbox-wscroll-up" title="Previous"></div>
               <div class="z-biglistbox-wscroll-down" title="Next"></div>
               <div class="z-biglistbox-wscroll-end" title="End"></div>
       </div>
   </div>
</div>

Note: There are multiple elements with the same class name. Using the class name directly accesses those elements instead of the desired ones. I'm considering using a similar approach to access the second occurrence of that class:

WebElement down = driver.findElement(By.className("z-biglistbox-wscroll-down[2]"));

Answer №1

Is there a particular reason for not utilizing 'By.className' to locate these elements?

WebElement homeButton = driverGC.FindElement(
       By.ClassName("z-biglistbox-wscroll-home"));

Answer №2

To find them, simply search for the class name

WebElement homeButton = driver.findElement(By.className("z-biglistbox-wscroll-home"));
WebElement homeButton = driver.findElement(By.className("z-biglistbox-wscroll-up"));
//...

Alternatively, you can use a partial class name with cssSelector

WebElement homeButton = driver.findElement(By.cssSelector("[class*='home']"));
WebElement homeButton = driver.findElement(By.cssSelector("[class*='up']"));
//...

Answer №3

To implement this functionality, you can make use of the class name

To navigate to the Home button

WebElement homeBtn = driver.findElement(By.className("z-biglistbox-wscroll-home"));
homeBtn.click();

To navigate to the Up button

WebElement upBtn = driver.findElement(By.className("z-biglistbox-wscroll-up"));
upBtn.click();

To navigate to the Down button

WebElement downBtn = driver.findElement(By.className("z-biglistbox-wscroll-down"));
downBtn.click();

To navigate to the End button

WebElement endBtn = driver.findElement(By.className("z-biglistbox-wscroll-end"));
endBtn.click();

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

Tips on making a progress bar with a reverse text color for the "completed" section

I've been tackling this issue for hours, but haven't found a working solution yet. The challenge is to create a progress bar with a dynamic width and a centered label that changes its text color between the progressed and unprogressed parts. Here ...

Retrieve the scope object using angular.element and the $ID parameter

In order to transfer data from an angular application to scripts that operate outside of angular, I am seeking a solution since I cannot modify the code of the angular app. By utilizing Angular Batarang and NG-Inspector extensions in Chrome, I have identi ...

Implementing conditional rendering with styled-components

Currently, I am working on a menu that consists of a list of MenuItem components: <MenuItem>A</MenuItem> <MenuItem>B</MenuItem> <MenuItem>C</MenuItem> I am looking to customize the componen ...

Having trouble embedding the video in an iframe. Any tips on how to make it work?

I have encountered an issue while trying to embed a video in my WordPress site using an iframe. The video is not displaying completely on the page, with only the left part visible and the rest being cut off. Here is the code I am currently using: <P A ...

Header displayed on each page. (WordPress)

(my website: ) I am using Wordpress.org and I am trying to create a button that will redirect the user back to the front page, but I am having trouble figuring out how to do it. The button should be located in the top left corner of the site and should not ...

Creating blinking or flashing text using CSS 3 is a fun way to add eye-catching animation

Here's the current code I'm using: @-webkit-keyframes blinker { from { opacity: 1.0; } to { opacity: 0.0; } } .waitingForConnection { -webkit-animation-name: blinker; -webkit-animation-iteration-count: infinite; -webkit-animation-timi ...

Is there a simple method to add animation to a group of images displayed on click using JQuery?

Here is my JavaScript code that I'm currently using: $(document).ready(function() { $(".button-list .next").click(function() { project = $(this).parents().filter(".projektweb").eq(0); currentimg = project.find(".im ...

While working with Selenium in Python, I attempted to close a cookie banner but accidentally clicked on an ad instead

I attempted to close a cookie banner on whoscored.com but encountered an issue. Upon locating the button, the program unintentionally clicked on the ad behind the button, leading to the opening of a new page instead of closing the cookie banner. Any sugges ...

Top method for finding a link using a protractor

<a href="someOtherLinkText.com"> <h3 class="main-header"> AWESOME LINK </h3> </a> How can I locate and interact with this amazing link? ...

The jQuery hide and show functions lack precision and are too indiscriminate, requiring a more targeted approach

I am designing a unique contact card that captures a user's name and description from an <input> field and appends the input information into a <div> element. This is the flow I am aiming for... User inputs their first and last name alo ...

Creating test case records in Excel format using the Selenium IDE

Currently, I document website actions using Selenium IDE and then manually transfer the test cases to an Excel sheet. Is there a more efficient way to directly export the output to an Excel file? I understand that exporting from IDE to Excel is not suppo ...

Navigating the absence of Prismic's ability to use the <blockquote> element in their rich text editor

My experience with Prismic as a headless CMS has been mostly positive, but I recently encountered an issue that surprised me - the lack of support for a simple blockquote. It's baffling to me that such a basic HTML element is not natively supported by ...

How can I assign a class to my Typography component in Material UI?

When using my material-ui component, I wanted to add an ellipsis to my Typography element when it overflows. To achieve this, I defined the following styles: const customStyles = (theme) => ({ root: { textAlign: "left", margin: theme.spacing( ...

Retrieving captcha image using Selenium in a web browser

Recently dipping my toes into Selenium and web scraping, I find myself struggling with captchas. Following the steps outlined in this post: Selenium downloading different captcha image than the one in browser I'm hitting a roadblock. Initial Hurdl ...

Obtain the identification numbers of the rows that were modified by the query

How can I retrieve the primary key column value for the rows affected by a query in Java while using MySQL database? Suppose the query is: update user set pincode = 390023 where area like '%ABC Road%' In Java, I would like to obtain the IDs of ...

Maven encountered an error while trying to run the org.apache.maven.plugins:maven-resources-plugin:2.7:resources goal

I recently encountered an issue while building my project using Maven with apache-maven-3.0.4 and Eclipse Luna. Every time I attempt to build the project, I keep getting the following error message: [ERROR] Failed to execute goal org.apache.maven.plugin ...

Is there a way to access a CSV file containing a comprehensive list of days and months?

I am in the process of designing a booking form for a website, and the client has specified that they prefer a drop-down menu for selecting dates rather than a traditional calendar. To achieve this, I plan to utilize gravity forms. For the date options, I ...

Encountering an issue with C# Selenium where clicking on the calendar fails and an error is produced

By clicking on the first calendar, I was able to get help and needed to do the same for the next calendar. So, I must select the 1st day of the month on the first calendar and the last day of the next month on the second calendar since the schedule I am cr ...

Choose a JavaScript function by clicking on the HTML text

As a beginner in the world of coding, I have been diving into JavaScript, HTML, and CSS. Inspired by fictional supercomputers like the Batcomputer and Jarvis, I've challenged myself to create my own personal assistant to manage tasks, games, programs, ...

Utilizing offsets/push in the correct manner

I have been developing a Bootstrap website and I wanted to get some feedback on my current code structure. The design is coming along nicely, but I am unsure if this aligns with best practices? <div class="container-fluid"> <div class="row"> ...