El Projecte | Sobre nosaltres | Contribuir | Donacions | Llicència

HOME

En aquest tema, aprendrem com interactuar amb elements web comuns com els desplegables i les caixes de selecció utilitzant Selenium WebDriver. Aquests elements són fonamentals en moltes aplicacions web, i saber com gestionar-los és essencial per a l'automatització de proves.

Desplegables

Els desplegables són elements que permeten a l'usuari seleccionar una opció d'una llista. En HTML, aquests elements es representen amb l'etiqueta <select>. A continuació, veurem com podem interactuar amb ells utilitzant Selenium.

Exemple de Codi: Seleccionar una Opció d'un Desplegable

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;

public class DropdownExample {
    public static void main(String[] args) {
        // Configura el WebDriver
        System.setProperty("webdriver.chrome.driver", "ruta/al/driver/chromedriver");
        WebDriver driver = new ChromeDriver();

        // Navega a la pàgina amb el desplegable
        driver.get("http://exemple.com/pagina-amb-desplegable");

        // Localitza l'element desplegable
        WebElement dropdownElement = driver.findElement(By.id("id-del-desplegable"));

        // Crea un objecte Select
        Select dropdown = new Select(dropdownElement);

        // Selecciona una opció pel seu text visible
        dropdown.selectByVisibleText("Opció 1");

        // Tanca el navegador
        driver.quit();
    }
}

Explicació del Codi

WebDriver i ChromeDriver: Inicialitzem el WebDriver per controlar el navegador Chrome.
Localització de l'Element: Utilitzem findElement per localitzar el desplegable per l'atribut id.
Select Object: Creem un objecte Select passant-li l'element desplegable.
Selecció d'Opció: Utilitzem selectByVisibleText per seleccionar una opció pel seu text visible.

Caixes de Selecció

Les caixes de selecció permeten a l'usuari seleccionar múltiples opcions. En HTML, es representen amb l'etiqueta <input type="checkbox">.

Exemple de Codi: Seleccionar una Caixa de Selecció

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

public class CheckboxExample {
    public static void main(String[] args) {
        // Configura el WebDriver
        System.setProperty("webdriver.chrome.driver", "ruta/al/driver/chromedriver");
        WebDriver driver = new ChromeDriver();

        // Navega a la pàgina amb la caixa de selecció
        driver.get("http://exemple.com/pagina-amb-caixa-de-seleccio");

        // Localitza la caixa de selecció
        WebElement checkbox = driver.findElement(By.id("id-de-la-caixa"));

        // Marca la caixa de selecció si no està marcada
        if (!checkbox.isSelected()) {
            checkbox.click();
        }

        // Tanca el navegador
        driver.quit();
    }
}

Explicació del Codi

Localització de l'Element: Utilitzem findElement per localitzar la caixa de selecció per l'atribut id.
Comprovació de l'Estat: Utilitzem isSelected per comprovar si la caixa de selecció està marcada.
Interacció: Utilitzem click per marcar la caixa de selecció si no ho està.

Exercicis Pràctics

Exercici 1: Escriu un script que seleccioni una opció d'un desplegable utilitzant selectByIndex.
Exercici 2: Crea un script que marqui totes les caixes de selecció en una pàgina web.

Solucions

Exercici 1 Solució:

// Selecciona una opció pel seu índex
dropdown.selectByIndex(2); // Selecciona la tercera opció

Exercici 2 Solució:

// Localitza totes les caixes de selecció
List<WebElement> checkboxes = driver.findElements(By.cssSelector("input[type='checkbox']"));

// Marca totes les caixes de selecció
for (WebElement checkbox : checkboxes) {
    if (!checkbox.isSelected()) {
        checkbox.click();
    }
}

Conclusió

En aquesta secció, hem après com gestionar desplegables i caixes de selecció amb Selenium WebDriver. Aquests conceptes són fonamentals per a l'automatització de proves en aplicacions web que utilitzen aquests elements. Practicar amb aquests exemples i exercicis t'ajudarà a consolidar els teus coneixements i a preparar-te per a escenaris més complexos.

Gestió de Desplegables i Caixes de Selecció

Desplegables

Exemple de Codi: Seleccionar una Opció d'un Desplegable

Explicació del Codi

Caixes de Selecció

Exemple de Codi: Seleccionar una Caixa de Selecció

Explicació del Codi

Exercicis Pràctics

Solucions

Conclusió

Automatització de Proves amb Selenium

Mòdul 1: Introducció a l'Automatització de Proves

Mòdul 2: Començant amb Selenium

Mòdul 3: Localització d'Elements Web

Mòdul 4: Interacció amb Elements Web

Mòdul 5: Sincronització en Selenium

Mòdul 6: Marc de Proves i Selenium

Mòdul 7: Conceptes Avançats de Selenium

Mòdul 8: Selenium Grid i Proves en Paral·lel

Mòdul 9: Integració Contínua i Selenium

Mòdul 10: Millors Pràctiques i Resolució de Problemes