Select a specific element to apply a CSS selector for a button

Question

Select a specific element to apply a CSS selector for a button

One of the challenges I am facing involves a webpage with multiple submit buttons. My goal is to iterate through each button and click on them one by one.

While I am aware that this can be achieved using xpath like this (//button[@class='submit'])[i] (where i = loop number).

I'm curious if it's possible to do so via CSS selector as well?

I attempted button.submit, but it always interacts with the first button, whereas I aim to cycle through all of them. I also experimented with button.submit:first-child, but experienced similar results.

The HTML structure resembles the following:

<div>
    <button class="submit" type="button"></button>
</div>
<div>
    <button class="submit" type="button"></button>
</div>
<div>
    <button class="submit" type="button"></button>
</div>

java html css selenium css-selectors

Answer 1

Answer №1

A possible solution to achieve this is the following approach:

For Java versions lower than 8, you can use the following code snippet:

List<WebElement> elements = driver.findElements(By.cssSelector("button.submit"));

WebElement confirm = driver.findElement(By.cssSelector("selector_for_confirm"));

for(WebElement element: elements){
     element.click();
     confirm.click();
}

If you are using Java version 8 or higher, you may consider this alternative method:

List<WebElement> elements = driver.findElements(By.cssSelector("button.submit"));

WebElement confirm = driver.findElement(By.cssSelector("selector_for_confirm"));

  elements.forEach(e->{
        e.click();
        confirm.click();
    });

Answer 2

A possible solution to achieve this is the following approach:

For Java versions lower than 8, you can use the following code snippet:

List<WebElement> elements = driver.findElements(By.cssSelector("button.submit"));

WebElement confirm = driver.findElement(By.cssSelector("selector_for_confirm"));

for(WebElement element: elements){
     element.click();
     confirm.click();
}

If you are using Java version 8 or higher, you may consider this alternative method:

List<WebElement> elements = driver.findElements(By.cssSelector("button.submit"));

WebElement confirm = driver.findElement(By.cssSelector("selector_for_confirm"));

  elements.forEach(e->{
        e.click();
        confirm.click();
    });

Select a specific element to apply a CSS selector for a button

Answer №1

Similar questions

Setting up preferences for Chrome in Selenium using Python is a useful skill to have

Achieving a persistent footer at the bottom of the page within Material Angular's mat-sidenav-container while using the router-outlet

Is it possible to pass multiple IDs into document.getElementById?

What is the best way to display a book cover and position it in a specific location?

Chrome is the only browser that displays the correct number of columns, unlike IE and Firefox

Animate your menu on hover with jQuery!

Adjust text size based on device orientation changes

`I encountered difficulty in finding the radio button element using Selenium WebDriver`

Elevate the Appearance of Material UI Elements with custom CSS Sty

Align bootstrap button to the center on xs screens

Steps for selecting the Check Interactions button with Selenium

I attempted to apply vertical-align and color properties to the static_nav div, but they didn't have any effect. Could this be due to its placement within the header? What steps should I take to resolve this issue?

What is the best way to include an external JavaScript file in a Bootstrap project?

how to change the class of a div when clicking on a <p> element

Disabling hover effects in Chart.js: A step-by-step guide

Error in regular expression format

What is the best way to create a slideshow using an IFrame?

Having trouble getting the img src to work in Django 2.1 template?

Incorporating a header include on every page throughout my website

Choosing particular contenteditable divisions using jQuery