Pruebas de Interfaz de Usuario: Validación y Simulación de Eventos

Contenido del curso

Introducción al Testing en iOS

1
Testing en Swift más allá del 100% de cobertura
01:44 min

Unit Testing con XCTest

Integration testing

UI Testing con SwiftUI y XCTest

Reporte y Optimización de Calidad

Tomar examen

Cursos Empresas Blog Live Conf Eventos Precios

0:007:33

Pruebas de Interfaz de Usuario: Validación y Simulación de Eventos

Curso de Swift Unit Testing

Clase 12 de 15

Clase 12 / 15

Recursos

La automatización de pruebas de interfaz de usuario (UI) es fundamental para garantizar que nuestras aplicaciones funcionen correctamente desde la perspectiva del usuario final. Mediante los tests de UI podemos validar que los elementos visuales aparezcan correctamente, verificar su contenido y simular interacciones como si fueran usuarios reales. Esto nos permite detectar problemas antes de que lleguen a producción, mejorando significativamente la calidad de nuestro software.

¿Cómo implementar tests de UI básicos en Swift?

Los tests de UI en Swift nos permiten validar que nuestra aplicación se muestre correctamente y que los elementos interactúen como esperamos. Para comenzar con nuestros primeros tests, necesitamos verificar la existencia de elementos clave en nuestra interfaz y comprobar sus valores.

Validación de elementos estáticos

Para validar elementos estáticos como textos o etiquetas, podemos utilizar el siguiente enfoque:

func testHomeElements() {
    let app = XCUIApplication()
    app.launch()
    
    // Validar título de la aplicación
    let appTitle = app.staticTexts["appTitle"]
    XCTAssertTrue(appTitle.exists)
    XCTAssertEqual(appTitle.label, "Gastify")
    
    // Validar botón de agregar registro
    let addRecordButton = app.buttons["addRecordButton"]
    XCTAssertTrue(addRecordButton.exists)
    
    // Validar tarjetas de ingresos y gastos
    let incomeCard = app.otherElements["incomeCard"]
    XCTAssertTrue(incomeCard.exists)
    
    let outcomeCard = app.otherElements["outcomeCard"]
    XCTAssertTrue(outcomeCard.exists)
}

En este test estamos:

Creando una instancia de nuestra aplicación
Lanzándola en el simulador
Buscando elementos específicos mediante sus identificadores de accesibilidad
Verificando que estos elementos existan en la interfaz
Comprobando que algunos elementos tengan el texto esperado

Es crucial que los identificadores de accesibilidad (accessibility identifier) coincidan exactamente con los que hemos definido en nuestras vistas. Estos identificadores son la forma en que nuestros tests pueden localizar elementos específicos en la interfaz.

Pruebas de interacción con elementos

Además de verificar la existencia de elementos, podemos simular interacciones del usuario y validar cómo responde nuestra interfaz:

func testFilterSelection() {
    let app = XCUIApplication()
    app.launch()
    
    // Verificar que el filtro "hoy" esté seleccionado por defecto
    let todayFilterSelected = app.buttons["today-selected"]
    XCTAssertTrue(todayFilterSelected.exists)
    
    // Verificar que el filtro "esta semana" no esté seleccionado
    let weekFilterUnselected = app.buttons["week-unselected"]
    XCTAssertTrue(weekFilterUnselected.exists)
    
    // Simular tap en el filtro de "esta semana"
    weekFilterUnselected.tap()
    
    // Verificar que ahora "esta semana" esté seleccionado
    let weekFilterSelected = app.buttons["week-selected"]
    XCTAssertTrue(weekFilterSelected.exists)
    
    // Verificar que "hoy" ya no esté seleccionado
    let todayFilterUnselected = app.buttons["today-unselected"]
    XCTAssertTrue(todayFilterUnselected.exists)
}

En este test estamos:

Verificando el estado inicial de nuestros filtros
Simulando un tap en uno de los filtros no seleccionados
Comprobando que el estado de los filtros cambie correctamente después de la interacción

Esta capacidad de simular interacciones es extremadamente poderosa, ya que nos permite validar flujos completos de usuario de manera automatizada.

¿Cómo ejecutar los tests de UI?

Para ejecutar nuestros tests de UI, podemos hacerlo de dos maneras:

Ejecutar tests individuales

Podemos ejecutar un test específico haciendo clic en el botón "play" que aparece junto a la definición de la función de test, o utilizando la opción "Switch and Run" en Xcode.

Ejecutar un plan de pruebas completo

Para ejecutar todos nuestros tests de UI:

Seleccionamos nuestro plan de pruebas en Xcode
Nos aseguramos de que la paralelización esté desactivada (para evitar que se ejecuten múltiples simuladores)
Configuramos el esquema para ejecutar nuestro plan de UI por defecto
Ejecutamos con el atajo Command+U

// Configuración recomendada:
// 1. Seleccionar el plan de pruebas
// 2. En Options, verificar que Parallelization esté en "Disable"
// 3. En Edit Scheme > Test, seleccionar el plan de UI

Al ejecutar los tests, veremos cómo se abre el simulador, se lanza nuestra aplicación y se realizan las interacciones programadas. Al finalizar, Xcode nos mostrará un reporte con los resultados de las pruebas.

Los tests de UI son una herramienta fundamental para garantizar la calidad de nuestras aplicaciones desde la perspectiva del usuario. Implementarlos desde las primeras etapas del desarrollo nos ayuda a detectar problemas temprano y a mantener la consistencia de nuestra interfaz a medida que la aplicación evoluciona. ¿Qué otros elementos o interacciones consideras importantes probar en tu aplicación? Comparte tus experiencias y dudas en los comentarios.

Resumen

¿Cómo implementar tests de UI básicos en Swift?

Validación de elementos estáticos

Para validar elementos estáticos como textos o etiquetas, podemos utilizar el siguiente enfoque:

func testHomeElements() {
    let app = XCUIApplication()
    app.launch()
    
    // Validar título de la aplicación
    let appTitle = app.staticTexts["appTitle"]
    XCTAssertTrue(appTitle.exists)
    XCTAssertEqual(appTitle.label, "Gastify")
    
    // Validar botón de agregar registro
    let addRecordButton = app.buttons["addRecordButton"]
    XCTAssertTrue(addRecordButton.exists)
    
    // Validar tarjetas de ingresos y gastos
    let incomeCard = app.otherElements["incomeCard"]
    XCTAssertTrue(incomeCard.exists)
    
    let outcomeCard = app.otherElements["outcomeCard"]
    XCTAssertTrue(outcomeCard.exists)
}

En este test estamos:

Creando una instancia de nuestra aplicación
Lanzándola en el simulador
Buscando elementos específicos mediante sus identificadores de accesibilidad
Verificando que estos elementos existan en la interfaz
Comprobando que algunos elementos tengan el texto esperado

Pruebas de interacción con elementos

Además de verificar la existencia de elementos, podemos simular interacciones del usuario y validar cómo responde nuestra interfaz:

func testFilterSelection() {
    let app = XCUIApplication()
    app.launch()
    
    // Verificar que el filtro "hoy" esté seleccionado por defecto
    let todayFilterSelected = app.buttons["today-selected"]
    XCTAssertTrue(todayFilterSelected.exists)
    
    // Verificar que el filtro "esta semana" no esté seleccionado
    let weekFilterUnselected = app.buttons["week-unselected"]
    XCTAssertTrue(weekFilterUnselected.exists)
    
    // Simular tap en el filtro de "esta semana"
    weekFilterUnselected.tap()
    
    // Verificar que ahora "esta semana" esté seleccionado
    let weekFilterSelected = app.buttons["week-selected"]
    XCTAssertTrue(weekFilterSelected.exists)
    
    // Verificar que "hoy" ya no esté seleccionado
    let todayFilterUnselected = app.buttons["today-unselected"]
    XCTAssertTrue(todayFilterUnselected.exists)
}

En este test estamos:

Verificando el estado inicial de nuestros filtros
Simulando un tap en uno de los filtros no seleccionados
Comprobando que el estado de los filtros cambie correctamente después de la interacción

Esta capacidad de simular interacciones es extremadamente poderosa, ya que nos permite validar flujos completos de usuario de manera automatizada.

¿Cómo ejecutar los tests de UI?

Para ejecutar nuestros tests de UI, podemos hacerlo de dos maneras:

Ejecutar tests individuales

Podemos ejecutar un test específico haciendo clic en el botón "play" que aparece junto a la definición de la función de test, o utilizando la opción "Switch and Run" en Xcode.

Ejecutar un plan de pruebas completo

Para ejecutar todos nuestros tests de UI:

Seleccionamos nuestro plan de pruebas en Xcode
Nos aseguramos de que la paralelización esté desactivada (para evitar que se ejecuten múltiples simuladores)
Configuramos el esquema para ejecutar nuestro plan de UI por defecto
Ejecutamos con el atajo Command+U

// Configuración recomendada:
// 1. Seleccionar el plan de pruebas
// 2. En Options, verificar que Parallelization esté en "Disable"
// 3. En Edit Scheme > Test, seleccionar el plan de UI

Introducción al Testing en iOS

Testing en Swift más allá del 100% de cobertura

Unit Testing con XCTest

Pruebas Unitarias con XC Test en Desarrollo de Apps SWIFT

Tests asíncronos con XCTest en Swift

Pruebas Unitarias para View Models en Swift

Testing de Software: Estrategias y Configuración en Xcode

Mocks y stubs para unit tests en Swift

Pruebas Unitarias en Home View Model: Implementación y Validación

Integration testing

Pruebas de integración con SwiftData y ViewModel

Pruebas unitarias del SDDatabaseService en Swift Data

UI Testing con SwiftUI y XCTest

Qué es UI Testing en iOS con XCTest

Preparación de Proyectos para UI Testing en iOS

Pruebas de Interfaz de Usuario: Validación y Simulación de Eventos

Pruebas de navegación entre pantallas con XCUITest

Reporte y Optimización de Calidad

Code coverage en Xcode paso a paso

Estrategias Avanzadas de Testing en Desarrollo de Software

Pruebas de Interfaz de Usuario: Validación y Simulación de Eventos

Progreso del curso

Introducción al Testing en iOS

Unit Testing con XCTest

Integration testing

UI Testing con SwiftUI y XCTest

Reporte y Optimización de Calidad

Recursos

Recursos