Extraer información de inputs en Cypress te permite validar valores y compartir datos entre pruebas usando alias, una técnica clave para automatizar testing web sin repetir selectores ni perder contexto entre casos de prueba.

Qué son los alias en Cypress y cómo se crean

Un alias es un nombre corto que asignas a un elemento o valor para reutilizarlo dentro de tus pruebas sin tener que invocar el selector completo cada vez. Esto resulta útil cuando trabajas con identificadores largos o cuando necesitas mantener el código limpio.

La creación se hace con el comando .as() justo después de obtener el elemento [01:00]. Por ejemplo, si capturas un input con cy.get() y le encadenas .as('getName'), podrás luego invocarlo con cy.get('@getName') en cualquier punto del mismo test.

¿Para qué sirve un alias en Cypress? Sirve para guardar referencias a elementos o valores y reutilizarlos dentro de la misma prueba sin repetir selectores largos.

Un detalle importante: el nombre que asignas en .as() debe coincidir exactamente con el que usas al recuperarlo. Si registras name y luego buscas nombre, Cypress te lanzará un error indicando que no encuentra el alias [01:30].

Cómo extraer el valor de un input con then y val

Una vez que tienes el alias, puedes acceder al valor escrito en el input usando .then() combinado con la función val() de jQuery. Cypress devuelve los elementos como objetos jQuery, motivo por el cual históricamente se les antepone el signo de pesos al nombrar la variable.

El flujo queda así dentro de tu prueba:

• Obtienes el elemento con cy.get('@nombre').
• Encadenas .then(function(nombre) { ... }) para recibir el elemento.
• Llamas nombre.val() para extraer el valor escrito.
• Aplicas la aserción con expect(nombre.val()).to.equal('Javier').

Así confirmas que el texto presente en el campo coincide con lo que esperabas. Esta es la base para validar formularios sin asumir que la escritura fue exitosa.

Cómo compartir información entre pruebas en Cypress

Aquí viene lo interesante: existen dos formas de pasar valores entre bloques it, pero solo una es la recomendada oficialmente.

Por qué no usar variables globales para compartir datos

La primera opción es declarar una variable global tipo let texto; fuera de los it y asignarle el valor capturado dentro del then. Funciona, sí, pero Cypress desaconseja esta práctica porque rompe el modelo asíncrono de comandos y puede generar resultados inconsistentes cuando la página se refresca o el orden de ejecución cambia [05:30].

El ejemplo del transcript muestra cómo se asigna texto = nombre.val() y luego se usa esa variable en un segundo it para llenar el campo last name. Visualmente parece correcto, pero la recomendación clara es: úsala con precaución.

Cómo usar invoke y this con alias globales

La forma recomendada combina tres elementos: el comando .invoke(), los alias y la palabra reservada function en lugar de arrow functions.

¿Por qué usar function y no arrow function en Cypress? Porque las arrow functions carecen de contexto propio, y sin contexto no puedes acceder a this para recuperar los alias compartidos entre pruebas.

El patrón funciona así:

1. Capturas el input con cy.get('@nombre').
2. Invocas el método del elemento con .invoke('val') para extraer el valor.
3. Le asignas un alias global con .as('nombreGlobal').
4. En la aserción del mismo bloque puedes encadenar .should('equal', 'Javier') directamente.
5. En el siguiente it, declarado con function(), accedes al valor mediante this.nombreGlobal [09:00].

Con esta estructura, Cypress reconoce el alias incluso cuando la página se refresca entre pruebas, y los pasos quedan documentados en el panel lateral de la herramienta indicando cada vez que se encuentra y reutiliza un alias.

Diferencia entre then con val e invoke val

Ambos enfoques extraen el valor del input, pero su estructura cambia el flujo del código.

• .then(function(elemento) { elemento.val() }) te da control completo dentro de un callback, ideal cuando necesitas hacer varias operaciones con el elemento.
• .invoke('val') es más directo: invoca la función del elemento jQuery y devuelve el valor listo para encadenar aserciones con .should() o asignar un alias con .as().

La segunda forma es más limpia y se integra mejor con el modelo de comandos encadenados de Cypress, sobre todo cuando vas a compartir el resultado entre pruebas.

Buenas prácticas al trabajar con inputs y aserciones

Algunos puntos que conviene tener presentes mientras automatizas formularios:

• Asigna alias a selectores largos para mantener el código legible.
• Usa function() en los it cuando vayas a compartir información mediante this.
• Prefiere .invoke('val').as('aliasGlobal') antes que variables globales sueltas.
• Verifica siempre que el nombre del alias coincida en su declaración y su uso.
• Encadena las aserciones con .should() cuando sea posible para aprovechar el reintento automático de Cypress.

Estas técnicas te preparan para escribir pruebas más robustas y mantenibles, y son la base para lo que viene después: trabajar con listas y dropdowns. ¿Has tenido conflictos compartiendo datos entre tus pruebas? Cuéntame en los comentarios cómo resolviste esa situación.