Interacción con elementos

Operaciones básicas

Una vez que hemos localizado elementos en el DOM, el siguiente paso natural es interactuar con ellos de manera efectiva. Las operaciones básicas de Selenium WebDriver nos proporcionan las herramientas fundamentales para simular las acciones que un usuario real realizaría en una aplicación web.

Estas operaciones constituyen la base de cualquier automatización de pruebas y se dividen en dos categorías principales: acciones de modificación (click, sendKeys, clear) y acciones de consulta (getText, getAttribute). Dominar estas operaciones es esencial para construir pruebas robustas y mantenibles.

Operación click()

El método click() simula un clic del ratón sobre un elemento web. Esta operación es fundamental para interactuar con botones, enlaces, checkboxes y cualquier elemento clickeable.

@Test
void deberiaHacerClicEnBoton() {
    WebElement botonEnviar = driver.findElement(By.id("submit-button"));
    botonEnviar.click();
    
    // Verificar que la acción se ejecutó correctamente
    WebElement mensaje = driver.findElement(By.className("success-message"));
    assertThat(mensaje.isDisplayed()).isTrue();
}

La operación click() funciona automáticamente con la mayoría de elementos interactivos. Sin embargo, es importante considerar que algunos elementos pueden requerir scroll hasta ser visibles antes de poder hacer clic en ellos.

@Test
void deberiaHacerClicEnElementoQueRequiereScroll() {
    WebElement elemento = driver.findElement(By.id("bottom-button"));
    
    // Selenium automáticamente hace scroll si es necesario
    elemento.click();
    
    assertThat(driver.getCurrentUrl()).contains("success");
}

Operación sendKeys()

El método sendKeys() permite enviar texto y teclas especiales a elementos de entrada como campos de texto, áreas de texto y campos de contraseña.

@Test
void deberiaIntroducirTextoEnCampo() {
    WebElement campoNombre = driver.findElement(By.name("username"));
    campoNombre.sendKeys("usuario.prueba");
    
    // Verificar que el texto se introdujo correctamente
    assertThat(campoNombre.getAttribute("value")).isEqualTo("usuario.prueba");
}

Una funcionalidad avanzada de sendKeys() es el envío de teclas especiales mediante la clase Keys, útil para simular combinaciones de teclado y teclas de función.

@Test
void deberiaUsarTeclasEspeciales() {
    WebElement campoTexto = driver.findElement(By.id("search-field"));
    campoTexto.sendKeys("selenium webdriver");
    
    // Simular presionar Enter
    campoTexto.sendKeys(Keys.ENTER);
    
    // Simular Ctrl+A para seleccionar todo
    campoTexto.sendKeys(Keys.CONTROL + "a");
}

Operación clear()

El método clear() elimina todo el contenido de un elemento de entrada. Esta operación es especialmente útil cuando necesitamos limpiar campos antes de introducir nuevos valores.

@Test
void deberiaLimpiarYReemplazarTexto() {
    WebElement campoEmail = driver.findElement(By.id("email"));
    
    // Introducir texto inicial
    campoEmail.sendKeys("email.antiguo@ejemplo.com");
    
    // Limpiar el campo
    campoEmail.clear();
    
    // Introducir nuevo texto
    campoEmail.sendKeys("email.nuevo@ejemplo.com");
    
    assertThat(campoEmail.getAttribute("value")).isEqualTo("email.nuevo@ejemplo.com");
}

Es importante tener en cuenta que clear() solo funciona con elementos editables como input y textarea. Si intentamos usar clear() en elementos no editables, la operación será ignorada silenciosamente.

Operación getText()

El método getText() obtiene el texto visible de un elemento. Esta operación devuelve exactamente lo que un usuario vería en la pantalla, excluyendo elementos ocultos.

@Test
void deberiaObtenerTextoVisible() {
    WebElement titulo = driver.findElement(By.tagName("h1"));
    String textoTitulo = titulo.getText();
    
    assertThat(textoTitulo).isEqualTo("Bienvenido a la aplicación");
}

getText() es particularmente útil para validar mensajes y contenido dinámico en las pruebas.

@Test
void deberiaValidarMensajeError() {
    WebElement campoEmail = driver.findElement(By.id("email"));
    WebElement botonEnviar = driver.findElement(By.id("submit"));
    
    // Intentar enviar formulario sin email
    botonEnviar.click();
    
    WebElement mensajeError = driver.findElement(By.className("error-message"));
    String textoError = mensajeError.getText();
    
    assertThat(textoError).contains("El campo email es obligatorio");
}

Operación getAttribute()

El método getAttribute() obtiene el valor de un atributo HTML específico de un elemento. Esta operación es fundamental para acceder a propiedades que no son visibles directamente en la interfaz.

@Test
void deberiaObtenerAtributosDeElemento() {
    WebElement enlace = driver.findElement(By.tagName("a"));
    
    String href = enlace.getAttribute("href");
    String target = enlace.getAttribute("target");
    String clases = enlace.getAttribute("class");
    
    assertThat(href).isEqualTo("https://ejemplo.com");
    assertThat(target).isEqualTo("_blank");
    assertThat(clases).contains("enlace-externo");
}

getAttribute() también puede obtener propiedades de estado de elementos formulario, como el estado checked de checkboxes o el valor actual de campos de entrada.

@Test
void deberiaVerificarEstadoCheckbox() {
    WebElement checkbox = driver.findElement(By.id("terms-checkbox"));
    
    // Verificar estado inicial
    String checkedInicial = checkbox.getAttribute("checked");
    assertThat(checkedInicial).isNull(); // No está marcado
    
    // Hacer clic para marcar
    checkbox.click();
    
    // Verificar nuevo estado
    String checkedFinal = checkbox.getAttribute("checked");
    assertThat(checkedFinal).isEqualTo("true");
}

Combinando operaciones básicas

En escenarios reales, estas operaciones se combinan para crear flujos de interacción completos que simulan el comportamiento real del usuario.

@Test
void deberiaCompletarFormularioLogin() {
    // Localizar elementos
    WebElement campoUsuario = driver.findElement(By.id("username"));
    WebElement campoPassword = driver.findElement(By.id("password"));
    WebElement botonLogin = driver.findElement(By.id("login-button"));
    
    // Limpiar campos por seguridad
    campoUsuario.clear();
    campoPassword.clear();
    
    // Introducir credenciales
    campoUsuario.sendKeys("admin");
    campoPassword.sendKeys("password123");
    
    // Enviar formulario
    botonLogin.click();
    
    // Validar resultado
    WebElement mensajeBienvenida = driver.findElement(By.className("welcome-message"));
    assertThat(mensajeBienvenida.getText()).contains("Bienvenido, admin");
}

Validaciones modernas

Las validaciones en Selenium WebDriver van más allá de simplemente verificar que un elemento existe en el DOM. Los métodos de validación modernos nos permiten comprobar el estado real y la disponibilidad de los elementos antes de interactuar con ellos, evitando errores comunes y mejorando la robustez de nuestras pruebas automatizadas.

Estas validaciones son especialmente importantes en aplicaciones web dinámicas donde los elementos pueden cambiar de estado según las interacciones del usuario, llamadas AJAX, o actualizaciones en tiempo real. Implementar validaciones apropiadas es una práctica fundamental para crear pruebas estables y confiables.

Validación de visibilidad con isDisplayed()

El método isDisplayed() verifica si un elemento es visible para el usuario en la página. Un elemento puede estar presente en el DOM pero no ser visible debido a estilos CSS como display: none o visibility: hidden.

@Test
void deberiaValidarVisibilidadDeElemento() {
    WebElement modalDialog = driver.findElement(By.id("confirmation-modal"));
    
    // Verificar que el modal no es visible inicialmente
    assertThat(modalDialog.isDisplayed()).isFalse();
    
    // Activar modal
    WebElement botonAbrir = driver.findElement(By.id("open-modal"));
    botonAbrir.click();
    
    // Verificar que ahora es visible
    assertThat(modalDialog.isDisplayed()).isTrue();
}

Esta validación es especialmente útil para elementos condicionales que aparecen y desaparecen según el contexto de la aplicación.

@Test
void deberiaValidarMensajeErrorCondicional() {
    WebElement campoEmail = driver.findElement(By.id("email"));
    WebElement mensajeError = driver.findElement(By.className("email-error"));
    
    // Verificar que el mensaje de error no es visible inicialmente
    assertThat(mensajeError.isDisplayed()).isFalse();
    
    // Introducir email inválido
    campoEmail.sendKeys("email-invalido");
    campoEmail.sendKeys(Keys.TAB); // Trigger validation
    
    // El mensaje de error debe ser visible ahora
    assertThat(mensajeError.isDisplayed()).isTrue();
    assertThat(mensajeError.getText()).contains("Formato de email inválido");
}

Validación de disponibilidad con isEnabled()

El método isEnabled() determina si un elemento está habilitado para interacción. Un elemento puede estar visible pero deshabilitado, lo que impediría que el usuario interactúe con él normalmente.

@Test
void deberiaValidarEstadoHabilitadoDeBoton() {
    WebElement botonEnviar = driver.findElement(By.id("submit-button"));
    WebElement checkboxTerminos = driver.findElement(By.id("terms-checkbox"));
    
    // Verificar que el botón está deshabilitado inicialmente
    assertThat(botonEnviar.isEnabled()).isFalse();
    
    // Aceptar términos y condiciones
    checkboxTerminos.click();
    
    // El botón debe habilitarse ahora
    assertThat(botonEnviar.isEnabled()).isTrue();
}

Esta validación es crucial en formularios dinámicos donde ciertos campos o botones se habilitan basándose en la entrada del usuario.

@Test
void deberiaValidarHabilitacionCondicionalDeCampos() {
    WebElement tipoUsuario = driver.findElement(By.id("user-type"));
    WebElement campoEmpresa = driver.findElement(By.id("company-field"));
    
    // Verificar estado inicial
    assertThat(campoEmpresa.isEnabled()).isFalse();
    
    // Seleccionar tipo de usuario empresarial
    Select select = new Select(tipoUsuario);
    select.selectByValue("business");
    
    // El campo empresa debe habilitarse
    assertThat(campoEmpresa.isEnabled()).isTrue();
}

Validación de selección con isSelected()

El método isSelected() verifica si un elemento está seleccionado. Este método es aplicable principalmente a checkboxes, radio buttons y opciones de elementos select.

@Test
void deberiaValidarSeleccionDeCheckbox() {
    WebElement newsletterCheckbox = driver.findElement(By.id("newsletter-subscription"));
    
    // Verificar estado inicial
    assertThat(newsletterCheckbox.isSelected()).isFalse();
    
    // Seleccionar checkbox
    newsletterCheckbox.click();
    
    // Verificar que está seleccionado
    assertThat(newsletterCheckbox.isSelected()).isTrue();
    
    // Deseleccionar
    newsletterCheckbox.click();
    assertThat(newsletterCheckbox.isSelected()).isFalse();
}

Para radio buttons, isSelected() es especialmente útil para verificar que solo una opción está seleccionada en un grupo.

@Test
void deberiaValidarSeleccionExclusivaDeRadioButtons() {
    List<WebElement> opcionesPago = driver.findElements(By.name("payment-method"));
    
    // Verificar que ninguna opción está seleccionada inicialmente
    opcionesPago.forEach(opcion -> 
        assertThat(opcion.isSelected()).isFalse()
    );
    
    // Seleccionar tarjeta de crédito
    WebElement tarjetaCredito = driver.findElement(By.id("credit-card"));
    tarjetaCredito.click();
    
    // Verificar selección exclusiva
    assertThat(tarjetaCredito.isSelected()).isTrue();
    
    // Verificar que otras opciones permanecen no seleccionadas
    opcionesPago.stream()
        .filter(opcion -> !opcion.equals(tarjetaCredito))
        .forEach(opcion -> assertThat(opcion.isSelected()).isFalse());
}

Validaciones combinadas y flujos robustos

En escenarios reales, combinamos múltiples validaciones para crear flujos de verificación completos que aseguran la integridad del estado de la aplicación.

@Test
void deberiaValidarEstadoCompletoDeFormulario() {
    WebElement campoNombre = driver.findElement(By.id("name"));
    WebElement campoEmail = driver.findElement(By.id("email"));
    WebElement checkboxPrivacidad = driver.findElement(By.id("privacy-policy"));
    WebElement botonRegistrar = driver.findElement(By.id("register-button"));
    
    // Validar estado inicial del formulario
    assertThat(campoNombre.isDisplayed()).isTrue();
    assertThat(campoNombre.isEnabled()).isTrue();
    assertThat(checkboxPrivacidad.isSelected()).isFalse();
    assertThat(botonRegistrar.isEnabled()).isFalse();
    
    // Completar formulario paso a paso
    campoNombre.sendKeys("Juan Pérez");
    campoEmail.sendKeys("juan@ejemplo.com");
    
    // El botón aún debe estar deshabilitado
    assertThat(botonRegistrar.isEnabled()).isFalse();
    
    // Aceptar política de privacidad
    checkboxPrivacidad.click();
    
    // Validar estado final
    assertThat(checkboxPrivacidad.isSelected()).isTrue();
    assertThat(botonRegistrar.isEnabled()).isTrue();
}

Validación previa a interacciones críticas

Una buena práctica fundamental es validar el estado de los elementos antes de realizar interacciones críticas, especialmente en aplicaciones con comportamiento asíncrono.

@Test
void deberiaValidarAntesDeInteractuar() {
    WebElement botonDescargar = driver.findElement(By.id("download-button"));
    
    // Validar que el elemento está listo para interacción
    if (botonDescargar.isDisplayed() && botonDescargar.isEnabled()) {
        botonDescargar.click();
        
        // Validar resultado de la interacción
        WebElement mensajeDescarga = driver.findElement(By.className("download-started"));
        assertThat(mensajeDescarga.isDisplayed()).isTrue();
    } else {
        fail("El botón de descarga no está disponible para interacción");
    }
}

Manejo de elementos con estados dinámicos

En aplicaciones modernas con actualizaciones dinámicas, los elementos pueden cambiar de estado frecuentemente. Las validaciones nos ayudan a sincronizar nuestras pruebas con estos cambios.

@Test
void deberiaValidarCambiosDeEstadoDinamicos() {
    WebElement botonProcesar = driver.findElement(By.id("process-button"));
    WebElement indicadorCarga = driver.findElement(By.className("loading-spinner"));
    
    // Estado inicial: botón habilitado, indicador oculto
    assertThat(botonProcesar.isEnabled()).isTrue();
    assertThat(indicadorCarga.isDisplayed()).isFalse();
    
    // Iniciar procesamiento
    botonProcesar.click();
    
    // Durante procesamiento: botón deshabilitado, indicador visible
    assertThat(botonProcesar.isEnabled()).isFalse();
    assertThat(indicadorCarga.isDisplayed()).isTrue();
    
    // Esperar finalización del procesamiento
    WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
    wait.until(driver -> !indicadorCarga.isDisplayed());
    
    // Estado final: botón habilitado, indicador oculto
    assertThat(botonProcesar.isEnabled()).isTrue();
    assertThat(indicadorCarga.isDisplayed()).isFalse();
}

Validaciones con programación funcional moderna

Aprovechando las características de Java moderno, podemos crear validaciones más expresivas y reutilizables utilizando programación funcional.

@Test
void deberiaUsarValidacionesFuncionales() {
    List<WebElement> camposObligatorios = driver.findElements(By.className("required-field"));
    
    // Validar que todos los campos obligatorios están visibles y habilitados
    boolean todosCamposListos = camposObligatorios.stream()
        .allMatch(campo -> campo.isDisplayed() && campo.isEnabled());
    
    assertThat(todosCamposListos).isTrue();
    
    // Contar campos seleccionados
    List<WebElement> checkboxes = driver.findElements(By.cssSelector("input[type='checkbox']"));
    long checkboxesSeleccionados = checkboxes.stream()
        .mapToLong(checkbox -> checkbox.isSelected() ? 1 : 0)
        .sum();
    
    assertThat(checkboxesSeleccionados).isGreaterThan(0);
}

Estas validaciones modernas proporcionan una base sólida para construir pruebas automatizadas que reflejan fielmente el comportamiento real de los usuarios y se adaptan a las características dinámicas de las aplicaciones web contemporáneas.