Using Selenium to choose an element based on the text of its sibling element

I've been working on a selenium script for:

My goal is to select the "Add to Compare" element for "Sony Xperia," but it's not being located. I've tried using both cssSelector and xpath, but I can't seem to figure out what I'm doing wrong.

CSS Selector:

div.category-products > ul > li:nth-child(n):contains('Sony Xperia') > div > div.actions > ul > li:nth-child(2) > a

XPath:

//h2/a[@title='Sony Xperia']/ul/li/a[text()='Add to Compare']

NOTE: The cssSelector works in Chrome but doesn't provide any results in Firefox.

jquerycssseleniumtestingxpath

Answer №1

Lost in the second row is the section you need to find

//h2[a[@title='Samsung Galaxy']]
/following-sibling::div[@class='actions']
/ul/li/a[text()='Add to Cart']

Answer №2

This XPath code is designed to work universally across different platforms.

The custom xpath code: 

//h2/a[@title='Sony Xperia']/../following-sibling::div[3]/ul/li[2]/a

Follow the step-by-step guide below for a detailed explanation.

Step 1: Locate the fixed node of the element using: //h2/a[@title='Sony Xperia'] (if this step has been completed)

Step 2: Move up to its parent by adding /..

Step 3: Progress to the 'Actions' sibling /following-sibling::div[3] which is the third sibling from the current position

Step 4: Enter the actions node and access the 'ul' element /ul

Step 5: Identify the 'Add to compare' option within the second 'li' item, therefore include /li[2]

Step 6: Since 'Add to compare' is a link, it will be contained within an 'a' tag, hence add /a

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 is the method to display checkboxes using Selenium?

Is there a way to display the Visible Text of all checkboxes on a webpage using Selenium with Java? ...

javaseleniumselenium-webdriver

Issue with the formatting of the disabled button

I am facing an issue with styling a disabled button. Whenever I try to apply custom styling, it reverts back to the default styling. I have already cleared my cache but the problem persists. The button is disabled using JavaScript with document.getElementB ...

css

What is causing the extended duration of Application_ResolveRequestCache?

In my ASP.NET application, I have implemented a trace tool that logs events. The application uses AJAX to retrieve data from controls. Two trace entries are as follows: protected void Application_ResolveRequestCache(Object sender, EventArgs e) { ...

jqueryasp.netajaxperformancecaching

Having difficulty retrieving the values from the 'App.config' file within the Unit testing project using Nunit

In my 'nunit' project created in Visual Studio, I have a simple test but no default 'App.config' file. Therefore, I manually created an 'App.config' file and marked it 'Copy always' from the properties option. When ...

c#seleniumframeworksdependenciesnunit

Adjust the height of the card body to match the horizontal bootstrap 5 card image

Is there a way to use Bootstrap 5.1.3 to make the image fill the height of the card's body and footer, while also ensuring the card-footer is placed at the bottom of the card? The desired outcome: <link rel="stylesheet" href="https://cdn.jsdeli ...

htmlcssbootstrap-5

How to make a webpage open in a new window using Selenium with Python

Is there a way to open a link in a new window using Selenium Webdriver in Python, switch to it, extract data, and then close it? This is the code I am currently using: for tag in self.driver.find_elements_by_xpath('//body//a[@href]'): ...

pythonpython-2.7seleniumselenium-webdriverselenium-firefoxdriver

No input values were received using the $_GET method in

I've been searching for a solution to my problem, but haven't had any luck. Main JavaScript Code: $.ajax ({ method: "POST", url:"main_d.php", data: {type : 4} }) .done(function(msg_info) { $('#info_id').append(msg_info ...

phpjquery

Embed a Style-sheet into an Iframe (Facebook Like Box)

I'm facing the challenge of customizing a Facebook like box with predefined image sizes and borders that don't align with our design. I want to override some styles to make it more suitable for our website. The Likebox is currently embedded via ...

javascriptjquerycssfacebook-like

In Stripe.js, the background color and height of the credit card input cannot be customized

I'm struggling with customizing the appearance of a Stripe credit card input within my Vue.js application. I want to adjust the background color to #f1f1f1 and set the height to 60px, but despite trying both base styles and css, I can't seem to g ...

javascriptcssvue.jsstripe-payments

Python script that sets the default download directory for the Edge web driver

Struggling to update the download location for my Microsoft Edge web driver - seems like I'm missing something. I attempted to replicate settings from Chrome but it's not quite working out as planned. Here's what I have so far: from seleniu ...

pythonseleniumselenium-webdrivermicrosoft-edge

Could you explain the functionality of this compact C# code?

Recently, I joined a new team that specializes in automating processes using C# and Selenium. However, there is one line of code that I can't seem to understand: driver.FindElement(Elements.OkLink).click() While I grasp the purpose of driver and ...

c#seleniumautomationwebdriver

Which element is able to utilize the inline-block style?

Currently, I am delving into the intricacies of the inline-block attribute and have a basic understanding that it allows elements to sit on the same row rather than stack on top of each other as they would in a normal layout. However, my grasp on how exact ...

htmlcss

Deleting images based on their class through a loop

Currently, I am in the process of constructing a carousel using data retrieved from an endpoint. The challenge I face is determining the appropriate image size to request from the server. To address this, I perform some front-end processing to dynamically ...

javascriptjquerycssimagehttp

Using JQuery to Execute Matching Based on Text Within <A> Elements

After reviewing the resources on Jquery Extract URL from Text and jquery match() variable interpolation - complex regexes, I am still a bit confused. The issue at hand is that I have a webpage with a dropdown menu at the top. Inside the dropdown, there ...

javascriptjqueryhtml

When a React CSS class is deployed to a production server, it may be automatically

I've encountered a strange CSS issue while working on my React project. One specific section of the JSX <div> has a class with style properties defined in the main .css file. During local development, everything appears as expected. However, aft ...

javascripthtmlcssreactjsmaterial-ui

Trouble displaying portrait images in CSS slideshow

My portfolio includes an image slider called wow slider, which can be found at You can view my site with the image slider on this page: http://jackmurdock.site50.net/StudioWork.hmtl While most of the galleries display portrait and landscape images correc ...

jqueryhtmlcss

When implementing flex-grow 1 on a flex box, the remaining space is not being filled as expected

I am struggling to make the green div fill the remaining space of a flex box container. My goal is to have the top row (blue) adjust its height based on content, and then have the row below (green) take up the rest of the space. However, it seems like the ...

htmlcssflexbox

What steps can I take to correct this CSS code? I am looking to update the content using CSS

Here is the code I have for the specific page shown in the screenshot: https://i.sstatic.net/57o2Z.jpg I want to change 'Replay course' to 'Access course'. Can anyone help me figure out what I'm missing? a.course-card__resume { d ...

csscss-selectors

Prevent certain images from loading by blocking them

I am trying to create an extension that blocks two specific images from loading. Initially, I attempted to achieve this by using the following code in the content.js file: $("#rated-image").remove(); //id of one image $(".blur-mask").remove(); //class of ...

javascriptjquerygoogle-chromegoogle-chrome-extension

Displaying Text and Images on a Sliding Carousel with a Static Background Image

I am currently experimenting with the Materializecss Image Slider. My goal is to have a fixed full-screen background image while the texts and images slide over it. Initially, I tried setting the background-color of the slider class as transparent, but un ...

javascripthtmlcssslidermaterialize