Dramaturgo para la automatización de pruebas: la guía definitiva + marco | Vasile Vasluian | Skillshare
Buscar

Velocidad de reproducción


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Dramaturgo para la automatización de pruebas: la guía definitiva + marco

teacher avatar Vasile Vasluian

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      Descripción del curso

      2:14

    • 2.

      Introducción y configuración

      5:13

    • 3.

      Cómo hacer pruebas de dramaturgo

      10:05

    • 4.

      Depuración de pruebas de dramaturgo y uso de Trace Viewer

      8:37

    • 5.

      Cómo escribir y estructurar tus primeras pruebas de dramaturgo

      12:28

    • 6.

      Comprender y escribir selectores de CSS

      9:10

    • 7.

      Encontrar elementos web con el método locator()

      9:39

    • 8.

      Cómo usar localizadores orientados al usuario en Playwright

      10:05

    • 9.

      Técnicas complejas de filtrado y localizadores en Playwright

      11:19

    • 10.

      Extraer valores y texto de los elementos web

      18:01

    • 11.

      Escritura de afirmaciones en dramaturgo

      18:11

    • 12.

      Gestión y espera automática de los tiempos de espera

      18:35

    • 13.

      Interacción con campos de entrada

      6:24

    • 14.

      Interacción con casillas de verificación y botones de radio

      5:58

    • 15.

      Selección de opciones: desplegables y listas

      10:14

    • 16.

      Manejo de alertas y ventanas emergentes del navegador

      7:48

    • 17.

      Implementar acciones de arrastrar y soltarImplementar acciones de arrastrar y soltar

      3:21

    • 18.

      Practica 1

      13:38

    • 19.

      Práctica 2

      5:58

    • 20.

      Refactorización y mejoras

      4:29

    • 21.

      Configuración del marco y construcción del objeto de la página de inicio de sesión

      13:19

    • 22.

      Construir el modelo de objetos de la página de productos

      9:45

    • 23.

      Agregar el accesorio para la autenticación

      7:03

    • 24.

      Repaso del marco

      2:25

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

7

Estudiantes

--

Proyectos

Acerca de esta clase

Te damos la bienvenida a Playwright para la automatización de pruebas: la guía definitiva Este curso está diseñado para principiantes y probadores experimentados que quieran dominar Playwright, una de las herramientas más poderosas para la automatización de pruebas modernas. Para empezar, configurarás tu entorno de automatización de pruebas y te sumergirás rápidamente en las funciones de Playwright, incluidas la escritura, ejecución y depuración de pruebas en diferentes navegadores.

A lo largo del curso, obtendrás experiencia práctica con los conceptos esenciales de automatización de pruebas, como el modelo de objeto de página (POM, por sus siglas en inglés), localizadores, afirmaciones y manejo de elementos web dinámicos. Aprenderás a estructurar tus pruebas, realizar interacciones del navegador, manejar alertas, menús desplegables, campos de entrada y mucho más. Ya sea que estés probando sitios web estáticos o aplicaciones web modernas, Playwright te ofrece todo lo necesario con su compatibilidad con varios navegadores, lo que lo convierte en la opción preferida para automatizar las interacciones web.

Además de los conceptos básicos, el curso te presentará las características avanzadas de Playwright, como la autoespera, los tiempos de espera y el trabajo con visores de trazas para depurar y mejorar tus scripts de automatización de pruebas. También aprenderás a crear frameworks escalables y mantenibles con Playwright, y a aprovechar los accesorios y las mejores prácticas para que tus pruebas sean eficientes y fiables.

Al final de este curso, tendrás la confianza para crear tu propio marco de automatización de pruebas en Playwright, automatizar aplicaciones web complejas y ejecutar pruebas con facilidad en varios navegadores.

Ya sea que quieras mejorar tus habilidades en automatización de pruebas web o comenzar tu viaje a Playwright, este curso te proporciona todas las herramientas y conocimientos que necesitas para tener éxito. ¡Únete ahora y empieza a automatizar con Playwright!

Conoce a tu profesor(a)

Teacher Profile Image

Vasile Vasluian

Profesor(a)
Level: All Levels

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. Descripción del curso: Hola, y bienvenidos a Dramaturgo para automatización de pruebas, la guía definitiva Soy Vasil y estoy emocionado de compartir con ustedes cómo construir marcos de automatización de pruebas robustos usando dramaturgo En este curso, aprendes de todo , desde configurar tu entorno de dramaturgo hasta construir marcos de prueba escalables utilizando técnicas modernas como el Modelo de objetos de página y accesorios También cubriremos cómo escribir, ejecutar y la prueba de errores de manera efectiva con muchos proyectos prácticos para reforzar tu aprendizaje. Nuestro curso está organizado en secciones claras. Comenzaremos con la configuración del entorno y la estructura del proyecto. Luego pasaremos a la prueba de escritura y al uso de herramientas de depuración de dramaturgos También aprenderá a interactuar con elementos web, escribir aserciones y, finalmente, construir su propio marco de automatización escalable usando el modelo de objetos de página Este curso está diseñado para ingenieros de control de calidad, probadores de software, desarrolladores e incluso probadores manuales que buscan la transición a la automatización Si estás ansioso por dominar la automatización de pruebas web y aprender las mejores prácticas para construir marcos antaal, estás en el lugar correcto Al final de este curso, podrás configurar y configurar dramaturgo, escribir pruebas limpias y eficientes, escribir pruebas limpias y eficientes, construir marcos de automatización escalables usando el modelo Baje Object y debutar eficazmente tu Estas habilidades le permitirán crear suites de prueba confiables y mantenibles Uno de los mejores aspectos de este curso es su enfoque práctico. A lo largo de las lecciones, tendrás desafíos prácticos donde puedes pausar el video, implementar tu solución y luego compararlo con mi workroop Este método te ayuda a generar confianza y a dominar verdaderamente el material. Ahora que ya sabes qué esperar es momento de empezar. Estoy encantado de que te unas a mí en este viaje a Master dramaturgo para automatización de pruebas Profundicemos y comencemos a construir marcos sólidos de automatización de pruebas juntos. Nos vemos en la primera lección. 2. Introducción y configuración: Hola a todos y bienvenidos a este curso de dramaturgo. Estoy muy emocionado de guiarte a través de esta increíble herramienta y ayudarte a entender cómo usarla para pruebas web. Y esta lección comenzará con una simple introducción al dramaturgo, configurará nuestro entorno y realizará nuestra primera prueba Entonces comencemos por responder a la pregunta más obvia. ¿Qué es el dramaturgo? Dramaturgo es una biblioteca de pruebas de código abierto de Microsoft Nos permite automatizar navegadores como Chrome, Firefox y age, por lo que es perfecto para probar aplicaciones web. Con el dramaturgo, puedes simular interacciones reales del usuario, como hacer clic en botones, escribir en formularios y navegar entre páginas Una de las mejores partes del dramaturgo es que funciona en múltiples plataformas y navegadores Entonces, ya sea que estés probando Windows, macOS o Linux, el dramaturgo te tiene cubierto Ahora que sabemos qué es el dramaturgo, hablemos de por qué quieres usarlo. Los principales beneficios incluyen soporte de navegación cruzada, lo que permite probar en diferentes navegadores con el mismo script, ejecución rápida, lo que significa que dramaturgo está diseñado para ser eficiente, ahorrándole mucho tiempo También capacidades de prueba de N a N, y una cosa importante es la espera automática. Ahora, pongamos nuestro entorno listo para usar dramaturgo. Lo primero, necesitamos instalar nod Jz. Entonces para eso, abre tu navegador y escribe nodo Nod Jess, click en el primer enlace Y aquí tienes el botón de descarga. Descarga siempre la versión LTC. Después de que lo descargues, solo instálalo. El siguiente paso para configurar nuestro entorno es descargar nuestro editor de código, que será el código de Visual Studio. Así que escribe código de Visual Studio y abre el primer enlace desde code.visualstudio.com Y aquí tendrás un botón de descarga. Si estás en Windows, tendrás descarga para Windows, yo estoy en Maquest y tengo Descarga para Maquest Después de descargarlo, sólo tiene que instalar la aplicación. Vamos a abrir nuestro código de Visual Studio que acabamos de instalar, y aquí deberías ver fueron un mensaje de bienvenida o una ventana vacía. Veo una ventana vacía porque ya la abrí antes. Así que vamos a hacer clic en esta carpeta Explorer, y vamos a crear una carpeta. Donde mantendremos bien nuestra jugada. Entonces iré a escritorio, crearé una nueva carpeta. Pongámoslo bien. Donde pruebo y creo, y vamos a abrir. Ahora, pruebo con los autores. Entonces ahora mismo, estoy en mi carpeta. Vamos a abrir la terminal desde el menú de la terminal. Hagamos clic en Nueva terminal. Y aquí en la terminal, deberíamos escribir NPM. Necesitas dramaturgo. Y lo último, que es la versión. Haga clic en Enter y esto instalará al dramaturgo. Bien para proceder, vamos bien. Y para el lenguaje, usemos mecanografiado, pero realmente no nos importa Podemos elegir mecanografiado o Javascript. Será lo mismo para nuestro curso. Entonces aquí la prueba. Probemos AddThubFlls por ahora, navegadores de dramaturgos. Vamos a ser verdad y ahora solo tenemos que esperar a que todo termine. Entonces aquí podemos observar eso. Estamos descargando e instalando muchas bibliotecas. Esperemos a que termine el proceso. La instalación ha concluido. Ahora vamos a comprobar si todo está configurado correctamente. Para eso, intentemos ejecutar un script MP play right test. Entonces, si lo instalamos correctamente, aquí deberíamos haber ejecutado algunas pruebas, lo que significa que instalamos todo correctamente. Entonces tenemos seis pruebas, lo que significa que nuestra instalación fue exitosa. Enhorabuena por completar tu primera lección. Presentamos al dramaturgo, configuramos nuestro entorno y verificamos que todo estaba configurado correctamente Estos son los pasos fundamentales para todo lo que vamos a hacer en el futuro Entonces nos vemos en las próximas lecciones. 3. Ejecución de pruebas de dramaturgo: Hola. En esta lección, aprenderemos a ejecutar una prueba en dramaturgo Después de instalar al dramaturgo, se creó una estructura de carpetas dentro de nuestra carpeta de prueba de dramaturgo Así que aquí dentro de la carpeta de prueba mantendremos nuestras suites de pruebas en las lecciones futuras. Entonces si queremos ejecutar todo lo que está dentro de esta carpeta de prueba, debemos escribir el comando en el terminal, podemos abrir el terminal desde el menú de terminal y nuevo terminal. Prueba NpX NPxPlayWrt. Por lo que el dramaturgo buscará todas las pruebas que estén dentro de esta carpeta de pruebas Y ahora aquí podemos observar que tenemos seis mejores pruebas. Pero si vamos a echar un vistazo dentro de este archivo SPEC, solo tenemos dos pruebas. ¿Por qué tenemos aquí seis? Eso es porque en el archivo de configuración que se creó automáticamente, aquí tenemos tres proyectos Chromium Firefox y Safari. Y por defecto, dramaturgo está ejecutando nuestra prueba en todos estos proyectos en todos estos navegadores se está ejecutando en Roma en Firefox y en Safari Si quieres ejecutar específicamente para Home o para Firefox, podemos especificar esto. Para eso, podemos escribir MP dramaturgo. Pruebas y proyecto igual y digamos vamos a correr romeo. Entonces ahora veremos sólo dos pruebas y dos pruebas superadas. Pero por defecto, Cypress lo está ejecutando todo sin cabeza. No estamos viendo nada. Entonces, si queremos ejecutar nuestras pruebas con rumbo a ver el navegador real, deberíamos escribir los dramaturgos de los diputados y el guión Este es el comando que le dirá al dramaturgo que muestre los navegadores Entonces, hagamos clic en Entrar. Entonces tenemos un error porque debemos agregar también prueba antes de encabezarse. Prueba. Sí. Entonces ahora deberíamos ver el navegador real. Entonces se abrió en otra ventana. Sí, así que déjame intentar correr una vez más. Vamos a tratar de Así que aquí, podemos observar muy rápido. Se abre. También, podemos combinar esto encabezado con el proyecto. Entonces intentemos encabezado y también el nombre del proyecto. Proyecto, debemos agregar d dash antes de eso. Dash Project igual romo este momento solo tenemos dos pruebas. Permítanme minimizar eso al trabajar para ver los resultados. Sí, así que tenemos que romano, fue muy, muy rápido. Además, podemos ejecutar una prueba específica por prueba NA. Entonces aquí tenemos una prueba tiene título. Para eso, si quieres ejecutar sólo esta prueba por nombre de prueba, podemos escribir NB dramaturgo G y el nombre de nuestra prueba tiene título Vamos a hacer clic en Entrar. A se olvidó agregar aquí prueba Sí. Entonces ahora mismo, estamos ejecutando tres pruebas porque tenemos aquí tres proyectos. Otra forma de ejecutar la prueba de dramaturgo es usar la pantalla de la interfaz Entonces para eso para abrir la pantalla de la interfaz de usuario, debemos escribir NP dramaturgo test y UI Esto abrirá una ventana de interfaz de usuario. Entonces déjame minimizarlo y traerlo aquí. Así que aquí veremos todos los conjuntos de pruebas, dichos archivos de prueba de nuestra carpeta de pruebas. Entonces aquí tenemos nuestra especificación de archivo, especificación ejemplo, y estas dos pruebas. Entonces, si quieres ejecutar una prueba, podemos dar click sobre este botón. Y también aquí en esta parte de acción, tenemos cada prueba. Entonces aquí podemos observar lo que sucedió para cada prueba. También, podemos ejecutar el segundo y también observar qué se hizo, qué acción sobre qué ítem se realizó. Así que aquí hicimos clic en esto Empezar a empezar abajo Hablaremos de este tipo de prueba de dramaturgo corriendo en las lecciones futuras Y el último método para ejecutar la prueba de dramaturgo, el que usaremos en nuestro curso es usar la extensión dramaturgo Entonces para eso, deberíamos ir a esta pestaña de dramaturgo a esta pestaña de extensión y buscar play Try Entonces el resultado debería ser una extensión dramaturgo de miicrosoft.com Está instalado en mi sitio, pero hagamos clic en Instalar y después de eso, aquí deberíamos tener esta pestaña de prueba y te irás a tu archivo con test. En el lado izquierdo, deberías tener esta prueba de carrera. Ahora, también aquí en este top de pruebas, tienes todos los proyectos. Puedes elegir Chrome, Firefox, todos los proyectos de tu archivo de configuración, y también puedes elegir aquí si quieres ejecutar tu prueba con cabeza o sin cabeza Entonces, seleccionemos Mostrar navegador. Y ahora vamos a dar click en ese botón. Así que permítanme minimizar en worder para ver los navegadores. Vamos a hacer clic en el segundo. Por lo que se abre un navegador y la prueba se ejecutó con éxito. Ahora, déjame mostrarte cómo se verá un reporte de dramaturgo con prueba fallida, prueba de omisión y prueba de bajo Entonces aquí tenemos una prueba donde estamos esperando un rubro para ser instalación. Entonces el texto de instalación, permítame cambiar el texto a algo que falló. Y ahora este paso debería fallar porque estamos esperando que una página tenga un encabezado con el nombre de instalación. Entonces déjame ejecutar parlamentarios, prueba de dramaturgo, y usemos proyecto Romeo. Entonces, hagamos esta prueba. Entonces ahora estamos ejecutando dos pruebas. Esperemos los resultados. Bien, entonces aquí tenemos nuestro reporte. Aquí podemos ordenar por todas las pruebas fallidas, escamosas y omitidas. Entonces si haces clic en este tiene título el cual pasó, observamos lo que ejecutamos para cada parte de la prueba y el resultado que se pasa. Para el fallido, podemos dar click en eso y podemos ver el año en el que ocurrió. Entonces esperábamos a que este texto fuera visible, pero después de los 5 segundos, la prueba no era visible, por lo que se congeló y er Ahora echemos un vistazo a una prueba omitida. Entonces déjame saltarme. Así es como podemos saltarnos una prueba. Llegaremos a eso más tarde. Entonces intentemos ejecutar el mismo script para una prueba omitida. Sí, así que ahora tenemos uno saltado y uno pasado y MPC juega un reportaje de programa, deberíamos ejecutarlo si queremos ver el Voy a copiar y pegar. Y aquí podemos observar que aquí en la parte omitida, tenemos una prueba y un post Hagamos un breve resumen de lo que aprendimos en esta lección. Discutimos cómo podemos ejecutar nuestra prueba de Cypress desde la línea común por archivo de especificaciones, por nombre, y usando diferentes proyectos encabezados y sin cabeza Además, discutimos cómo usar esta prueba de UY y con la ayuda de la extensión de prueba de dramaturgo para el código VS Nos vemos en las próximas lecciones. 4. Depuración de pruebas de dramaturgo y uso de Trace Viewer: Hola, en esta lección, aprenderemos a depurar y usar el visor de trazas para nuestra prueba. Entonces el primer método es ejecutar la prueba de Coline y usar el parámetro de deuda Entonces intentemos ejecutar nuestra prueba. Déjame despejar el terminal, y usemos la prueba NBXPlayPlay Y usemos el proyecto de cromo y nuestro parámetro, que es el bug. Y antes de hacer clic en Entrar, déjame minimizar la ventana. Y cuando haga clic en Entrar, abrirán otras dos ventanas. Entonces déjame agregarlos aquí. El primero será el inspector dramaturgo y el segundo sería el propio navegador Aquí solo estará nuestra ejecución de texto. Pero en este inspector dramaturgo, tienes el código de tu prueba y tienes dos botones que pueden ayudarte a manipular la prueba El primero es el botón de zona. Si vas a hacer clic en eso, la prueba se ejecutará normalmente. Pero si vas a dar click en éste, paso por encima, la prueba se ejecutará fila por fila. Entonces probemos ahora nuestra prueba se detuvo en la primera fila. Vamos a dar click sobre este paso. Y aquí se pueden observar todos estos registros. Aquí tienes todo lo que pasó bajo el capó para el dramaturgo Ahora ejecutamos la primera fila, y ahora paramos en la segunda. Y si haces clic en otro momento en este paso por encima, se ejecutará la siguiente fila. Así que vamos a hacer clic. Ahora se ejecutó la primera prueba. Lo mismo será con el segundo. Entonces déjame agregarlos aquí. Entonces estamos en la primera fila. Daremos click sobre este paso y ejecutamos el primero. Y para algunos comandos como acciones, verá resaltado el elemento que se utiliza en este comando. Entonces aquí, estamos dando click en un enlace con el nombre get started, y aquí puedes observar este botón resaltado. Además, aquí tenemos un montón de looks útiles lo que está sucediendo bajo el capó cuando estás ejecutando la prueba. Entonces ahora tengo una fila más, pero no voy a dar click en este paso Over, voy a dar click en el rezoom y todo se ejecutará sin parar en esta fila Entonces si hago clic en eso, así tenemos dos pruebas superadas. Así es como podemos usar el parámetro bug cuando se ejecuta desde la línea de comandos. El segundo método es mediante el uso de imágenes de dramaturgo a la extensión y la adición de puntos de interrupción a la fila, se quiere detener Entonces déjame mostrarte cómo puedes hacer eso. Digamos que quieres que tu prueba se detenga en esta fila, tienes algo que realmente no entiendes y quieres parar la prueba aquí. Entonces para eso, en este del lado izquierdo, tienes el click para agregar un punto de interrupción El punto de interrupción significa que su ejecución se detendrá en esta fila Entonces permítanme agregar aquí un punto de interrupción y también al final un punto de interrupción Desde el estudio visual, desde la extensión de prueba de dramaturgos, da clic aquí Y desde esta pestaña, puedes seleccionar el bug. Tienes aquí el botón Bug. Hagamos clic en la prueba de errores para nuestro enlace Comenzar. Entonces haré clic en el error y me dejaré minimizar el show al navegador en ese momento. Entonces ahora tenemos nuestro navegador, y aquí puedes observar que tenemos muchas opciones. Podemos hacer el rezone, el continue, stepover, y así sucesivamente, y también podemos detenernos y Entonces aquí, nuestra prueba se detuvo donde agregamos el primer punto de interrupción Y también aquí podemos observar que el elemento se destaca para la acción. Y hagamos clic en Rezome y nuestra prueba debería detenerse en el siguiente punto de interrupción Entonces si voy a dar click aquí, así podremos observar que nuestra prueba se detuvo en el siguiente punto de interrupción y también se destaca nuestra instalación de calefacción por nombre Entonces si voy a hacer clic en siguiente. Así que nuestra prueba fue ejecutada con éxito. Así es como podemos depurar nuestra prueba a partir de esta extensión de dramaturgo Para que puedas iniciar tu prueba desde este botón aquí, harás clic derecho, tienes Ejecutar prueba, la prueba de errores, y puedes comenzar tu prueba en la prueba de ejecución simple. Y el de aquí, trabaja desde aquí. Otra herramienta útil para la banca, nuestra prueba es utilizar el visor de trazas en. Entonces déjame mostrarte cómo puedes usar el visor de trazas de la extensión dramaturgo Entonces, si vas a volver a esta extensión de prueba de dramaturgo, aquí debajo de los proyectos, tienes ajustes Y aquí tienes dos escenarios muy interesantes. El primero es show browser. Esto, si lo habilitas, verás el navegador al ejecutar la prueba. Y el segundo, el visor de Show Trace hará algún tipo de reporte de todas tus acciones y todos tus looks para la prueba. Entonces déjame seleccionar este visor de Showtrace y hagamos la segunda prueba Así que permítanme primero minimizar eso. Cierra esta terminal, y hagamos esta prueba. Entonces estoy haciendo la prueba. Y aquí se puede observar que no estaba abierto un simple navegador, sino que estaba abierto algo así como cuando intentamos ejecutar la prueba desde el visor de UI. Entonces después de ejecutar test, aquí tienes todas estas acciones que fueron ejecutadas. Y también para esta sección, puedes dar click en una acción y observar lo que pasó. Cuando tienes una prueba más complicada, es muy útil. También para cada acción, así, aquí tenemos un localizador y ejecutamos acción click. Tienes la acción y antes y después de lo que pasó antes y después de tu acción es muy útil. Y también, aquí tienes una historia aquí y puedes observar lo que pasó por el tiempo. Es muy útil cuando el bugging prueba muy grande y complicada El último tema que quiero discutir es cómo podemos habilitar esta traza cuando se ejecuta desde la línea común. Así que permítanme deseleccionar aquí y ejecutemos nuestra prueba desde la línea de comandos Entonces aquí tengo la prueba de pirita B, y digamos que otro parámetro traza en Entonces déjame ejecutarlo. Nuestra prueba se está ejecutando, y permítame copiar y abrir el informe. Entonces aquí tenemos nuestro reporte de UO para probar aprobado, pero si abrimos una prueba, aquí tendrás tus huellas, algo nuevo Y si vas a hacer clic en eso, se abrirá un visor de trazas, y aquí tienes toda la información sobre la prueba. Tienes muchas llamadas, muchos registros, y todo se muestra. Es realmente útil cuando estás depurando pruebas complicadas Hagamos un breve resumen sobre lo que aprendimos en la lección de hoy. En primer lugar, discutimos cómo depurar desde la línea común, cómo depurar desde esta extensión dramaturgo Después de eso, discutimos cómo usar visor Trace desde la estación de dramaturgo y el visor Trace desde la línea común Entonces eso fue para la lección de hoy. Nos vemos en la siguiente. 5. Escribe y estructura tus primeras pruebas de dramaturgo: Hola, y bienvenidos de nuevo. En esta lección, aprenderemos a crear una prueba básica simple en dramaturgo y a comprender la estructura básica de la prueba de dramaturgo Entonces, para esta lección, usaremos el sitio web de Source debo. Aquí hay un sitio web sencillo donde tienes muchos artículos, puedes agregarlos o eliminarlos de tu tarjeta y además puedes realizar aquí otras opciones, aunque el checkout o continuar comprando. Empecemos por crear nuestro primer archivo de prueba. De la lección anterior, sabemos que almacenaremos nuestros archivos dentro de la carpeta de prueba. Vamos a crear un nuevo archivo. Llamémoslo primera prueba. Primero, pruebe punto spec dot Ts. Estas son las extensiones de nuestro archivo. Entonces al principio, debemos importar nuestro método de prueba para el dramaturgo Cómo podemos hacer eso en un archivo vacío al inicio del archivo, deberíamos escribir Importar y dentro de paréntesis Carl, deberíamos llamar a prueba y desde y aquí, el código de Visual Studio nos proporcionará una lista de opciones. Necesitamos este método de prueba de la prueba de dramaturgo. Así que vamos a hacer clic. Y ahora hemos importado el método de prueba de la aplicación dramaturgo Ahora, vamos a crear nuestra primera prueba. La estructura de prueba es muy sencilla para el inicio. Entonces, en primer lugar, deberíamos llamar al método de prueba. Dentro de este método, deberíamos poner el nombre mi nombre de prueba. Este será el nombre de nuestra prueba. Después de eso, nuestra prueba está recibiendo parámetros, y al final, tenemos el cuerpo de nuestra prueba. Aquí pondremos todas estas acciones. Y aquí podemos observar que ya tenemos este botón de la extensión dramaturgo Y para iniciar la prueba, como en la vida real, si quieres navegar a una página, deberías tener un espacio en blanco y una página vacía del navegador abierta. Entonces dramaturgo con el dramaturgo, la historia es la misma Necesitamos tener una página en blanco del navegador abierta. Por lo que nuestra prueba recibirá un accesorio de página. Fixture es uno de los accesorios de dramaturgo. Tenemos navegador de páginas y algunos otros. Así que piensa en el accesorio de página como una página en blanco del navegador. Al principio, tenemos una página de navegador en blanco, y desde esta página, podemos navegar. Entonces es algo así. Tienes una página vacía, y desde esta página, puedes navegar a Google o a otras páginas. Y después de eso, con esta página, podrás realizar clics u otros métodos. Entonces nuestra nuestra prueba está recibiendo el accesorio de página, y después de eso, podemos comenzar usar la página para realizar ciertas acciones. La primera acción que queremos realizar en una página en blanco es navegar por nuestra página. Entonces para eso, deberíamos llamar a nuestra página punto, y tenemos un método especial que es ir a. Y aquí debemos pasar la URL. Entonces déjame copiar. Déjame hacer el cierre de sesión. Y déjame copiar la URL. Entonces aquí estoy pasando la URL, y aquí tenemos la primera acción. Y una cosa importante que Dramaturgo está usando promesas Entonces, si vas a navegar, colocarás un método, y observas que el tipo de retorno de ese método es una promesa, entonces debes poner un peso un peso antes de este método, lo que significa que por cada método que está devolviendo una promesa, debes poner un peso Y como estamos usando un peso, eso significa que nuestra prueba debe funcionar con método asincrónico Entonces aquí debemos agregar una sincronización. Sí. Entonces ahora todo está claro. Entonces esa es la estructura básica de una prueba. Vamos a repasarlo. Tenemos el método de prueba. Dentro de eso, tenemos el nombre. Después de eso, estamos usando un fregadero porque aquí dentro de la prueba, estamos usando muchos parámetros awight expect para nuestros métodos con promesas Además, como parámetro, estamos recibiendo una página vacía en blanco de fixture. Y después de aquí dentro del cuerpo de prueba, podemos usar esta página en blanco para realizar mucha acción. Entonces intentemos ejecutar esta prueba. Deberíamos simplemente abrir una página en blanco y navegar a nuestra prueba. Así que déjame hacer clic en Ejecutar y sí, déjame minimizar porque tengo dos monitores. Entonces déjame correr una vez más. Se está ejecutando. Y aquí podemos observar que abrimos la página, y la navegamos hasta la demo de salsa. Entonces déjame cerrar esta parada. También agreguemos una afirmación, una verificación para estar seguros de que terminamos en esta página de demostración de origen Entonces aquí solo podemos comprobarlo. Tenemos este texto swag love. Entonces déjame solo observar y tenemos una clase, pero vamos a agarrarlo por mensaje de texto. Entonces solo usaré un método, pero lo discutiremos en la siguiente lección. Entonces, para verificar algo en una página, deberíamos usar el método expect. Entonces aquí tenemos esperar y desde esta página, estamos agarrando el elemento por texto Tenemos un método especial get by text, y quiero encontrar un elemento por texto swag SWAG Y solo quiero estar seguro de que esto es visible. Entonces, si vamos a pasar el cursor sobre este método para que sea visible, primero, necesitamos importar esta expectativa del dramaturgo Entonces solo pon aquí una coma y claro espero que importamos esta espera del dramaturgo Y ahora si vamos a cubrir esto para que sea visible, observamos que está devolviendo una promesa, lo que significa que debemos usar un peso antes que una promesa. Así que déjame minimizar, y hagamos nuestra prueba. Por lo que podemos observar que nuestra prueba pasó. En un solo archivo, podemos crear tantos casos de prueba como queramos. Podemos copiarlo y basarlo como muchos lazos. Podemos cambiar el nombre nombre uno y dos. Y así, podemos tener muchas pruebas. Pero también podemos tener múltiples tipos de pruebas en un solo archivo. Podemos agruparlos por ciertas funcionalidades. Entonces digamos que queremos probar la funcionalidad de inicio de sesión. Entonces para eso, eliminemos estos dos. Así que solo podemos usar test y usar describe método. Y aquí podemos agruparlos, digamos, un grupo de prueba de página de inicio. Y dentro de esta descripción, podemos agregar solo los casos de prueba que están relacionados con la página de inicio. Entonces aquí podemos agregar tres pruebas, y todas ellas están relacionadas con la página principal. Además, en un archivo, podemos tener múltiples describe, así podemos agregar otra describe simplemente cambiando el nombre y algo así. Podemos agruparlos. Podemos tener pruebas separadas fueron agrupadas. Déjame borrar este y déjame hablar de los ganchos. Los ganchos se utilizan cuando no se quiere repetir la misma lógica o las mismas acciones para cada prueba. Entonces digamos en este grupo, que R acción común acción estará navegando a una página. Tenemos este código en las tres pruebas. Entonces, si no quieres repetir este código, puedes ponerlo en un gancho antes de cada uno, y este comando se ejecutará antes de cada prueba. Entonces déjenme mostrar cómo se verá. Entonces usas prueba antes de cada uno y además, está en un fregadero. Entonces pongamos un fregadero aquí. Y dentro de eso, estamos usando también el accesorio de página porque necesitamos una página vacía y nuestro cuerpo. Sí. Entonces, antes de cada prueba, queremos navegar por la demo de origen. Déjame copiar eso, y voy a eliminar esta navegación ir a de todos estos pasos. Ahora bien, si ejecuto esta prueba, navegue el go to se ejecutará desde este gancho. Entonces déjame hacer esta prueba. Ahora déjame minimizar por mis dos monitores, no ves lo que está pasando y claro eso. Entonces déjame correr el segundo. Y aquí estoy navegando a esta página. Y también, si ejecutas toda la suite descrita, entonces déjame correr. Observarás que la navegación se realizó para cada prueba. Entonces para estos ganchos puedes usar también antes de cada uno, también, tienes después de todo, después de cada uno, y antes de todo. Hay muchos ganchos que se pueden realizar antes de su prueba o después de la prueba. Además, puedes poner tu antes de cada uno antes de cada uno todos los trajes, vamos si tienes dos describe en un archivo y algo, puedes combinarlos. Son muy versátiles y muy serviciales. Es hora de terminar lo que cubrimos en la lección de hoy. Entonces comenzamos discutiendo la estructura básica de una prueba de dramaturgo Y tenemos el método de prueba, el accesorio de página, que es un navegador de página en blanco, la estructura, que se compone de la función de prueba, el nombre, una sincronización o accesorio de página, y el cuerpo de prueba. Además, discutimos cómo podemos agrupar nuestra prueba usando el método describe, y podemos almacenar múltiples pruebas dentro de la descripción agrupándolas, como en nuestro ejemplo, por página de inicio. Y también, al final, aprendimos sobre los ganchos antes de cada uno, después de cada uno, cómo podemos usarlos para no duplicar nuestro código y algo así. Así que espero que lo hayan disfrutado. Nos vemos en la siguiente lección. 6. Comprende y escribe selectores CSS: Hola. En esta lección, nos sumergimos en el selector CSS, una herramienta clave que usarás para identificar e interactuar con los elementos de la página, y al final de la lección, los usarás con confianza. Primero, hablemos de qué son los selectores CSS. Los selectores CSS son alfareros utilizados para seleccionar y dar estilo a elementos en una página web En el contexto de Chipre, utilizamos estos selectores para apuntar elementos para nuestras pruebas Por ejemplo, si quieres hacer clic en un botón, ingresas texto en un campo de entrada o verificas el contenido de un hit necesitarás usar selector CSS para apuntar a ese elemento específico. Ahora, discutamos sobre los selectores CSS más populares y sobre la fórmula general, cómo encontrar un selector CSS fórmula general para el selector CSS se compone de etiqueta, que puede ser entrada, botón T, seleccionar, y así sucesivamente, el atributo, que puede ser una clase, un texto, un nombre, ID, y el nombre del atributo, que puede ser todo. Discutamos sobre cómo encontrar selectores CSS por clase. Aquí tenemos un ejemplo de un DIV que tiene una clase con el nombre de la clase name. Si queremos encontrar este elemento, este DIV, podemos usar punto y clase N. La cosa con punto funcionará solo para clase o selector CSS por clase. O podemos usar la fórmula general, que es nombre de etiqueta en nuestro caso, es div aquí, el atributo en nuestro caso, el atributo es clase y el nombre del atributo en nuestro caso es más nombre. El siguiente son los selectores CSS por ID. Aquí tenemos un botón con el ID, MID, y un texto enviar. Para encontrar un selector CSS BID, podemos usar esa fórmula. Podemos usar has y el nombre del DNI. Y en nuestro caso es has y MAD. La cosa con has solo se puede usar para el selector de ID. En cuanto a los selectores CSS, para el selector CSS de clase, podemos usar eso Pero para el selector de ID, podemos usar has, y también podemos usar la fórmula general para encontrar un selector CSS. Aquí podemos usar el nombre de la etiqueta que es botón. A continuación, usamos atributo, que es ID en nuestro caso, ID de botón y el nombre de atributo, que es mi ID. Y así es como estamos luchando contra un selector CSS. El siguiente es luchar contra los selectores CSS por atributo. En ese ejemplo, tenemos una entrada con tipo text y name user name. Estamos usando fórmula general, nombre de etiqueta. I etiqueta entrada, atributo es nombre y nombre de atributo es nombre de usuario. Aquí está la etiqueta, aquí está el atributo y el nombre del atributo. Y el último que puedo decir el menos popular es CSS selector por etiquetas donde podemos encontrar como por párrafo, en nuestro caso, tenemos un párrafo, y podemos encontrar apenas todos los párrafos en la página donde. Podemos encontrar todas las botellas y todos los insumos. Una cosa más para agregar aquí. Cuando usamos esta fórmula general, podemos usar eso sin la etiqueta, pero es más seguro usarlo con etiqueta. Practicemos un poco sobre cómo encontrar el elemento web. Entonces para ese ejercicio, vamos a usar la documentación de Cypress Yo ejemplo, Cypress Tao. Y si quieres ver la estructura interna de esta página, debes hacer clic derecho e inspeccionar. Ahora, deberías ir a la pestaña del elemento. Si desea encontrar la ubicación exacta de un elemento web, puede hacer clic en este botón de selección, y después de eso, puede hacer clic en el elemento en la página. Y tu ubicación será resaltada. Así que vamos a tratar de encontrar un selector CSS por clase. Si quieres comenzar a buscar los elementos en la página, debes hacer clic en Control más C. Control más F. Ahora aparecerá aquí una barra de búsqueda. Así que intentemos encontrar el selector CSS por clase para esa entrada de correo electrónico. Primero, vamos a dar click en ese botón Seleccionar después de ese clic en nuestro elemento, y aquí podemos observar que tenemos una clase dos clases. Entonces vamos a copiarlos. Y vamos a pegar aquí. En nuestro caso, tenemos dos clases. Tratemos de encontrar el primero usando el método dot. Cuando ponemos el método dot, podemos observar que tenemos diez elementos con la misma clase. Entonces eso significa que deberíamos usar también el segundo. Vamos a copiar y cuando tengas dos clases, puedes concatenerlas usando punto Entonces ahora mismo, tenemos nuestros elementos uno o uno, lo que significa que el elemento es único y ese selector CSS es bueno para usar para nuestras pruebas. Tratemos de encontrar también el mismo elemento usando el segundo método o encontrando unos selectores CSS, la fórmula general Entonces en nuestro caso, la fórmula general será el atributo, la etiqueta, que es entrada E, corchetes, y aquí debemos escribir el tipo de atributo, que es clase igual y el atributo en nuestro caso, son eso. Entonces uno de forma, lo que significa que el elemento es único y podemos usarlo en nuestras pruebas. Continuemos encontrando un selector CSS por ID. Quiero encontrar la ubicación para esa entrada de contraseña. Entonces vamos a encontrar esa ubicación ese atributo. Aquí podemos observar que tenemos una entrada con el ID contraseña uno. Entonces en la barra de búsqueda, podemos poner hash y en el nombre de identificación, que es contraseña uno. Podemos observarlo. Es uno de uno, lo que significa que es un atributo único y se puede utilizar en nuestra prueba. Además, intentemos encontrar el segundo método usando fórmula general, es la entrada, ID, palabra de paso igual uno, uno de uno, selector CSS único. Y también, intentemos eliminar el nombre de la etiqueta, que es la entrada, y como podemos observar el elemento también es único y se puede usar sin el nombre de la etiqueta. A continuación, intentemos encontrar por diferentes atributos, que no es un ID o una clase. Busquemos el selector para ese botón de envío. Voy a dar click en el botón de buscar en ese elemento. Podemos observar que es un botón con tipos enviar y una clase. Busquemos por tipo. Entonces control, tenemos nuestra barra de búsqueda y la fórmula general sin tipo igual, y el nombre fue enviar. A partir de aquí, escriba y el nombre, envíe. Y tenemos uno de uno, lo que significa selector único único, que se puede utilizar en nuestras pruebas. Eso es para la lección de hoy donde aprendemos a usar, cómo escribir como configuro selector y cómo encontrar el elemento VD en la página. Estas habilidades son esenciales para escribir pruebas efectivas de Cypress Vamos a usar estas habilidades en la siguiente lección. Nos vemos ahí. 7. Encuentra elementos web con el método locator(): Hola a todos. En esta lección, nos sumergimos en una de las partes más esenciales de escribir pruebas de dramaturgo, encontrar e interactuar con elementos en una página Esto se puede hacer usando el método localizador. Entonces usaremos esta página web de Swag lab, y con la ayuda de esta página de inicio de sesión, intentaremos encontrar diferentes tipos de localizadores Entonces, para poder abrir la parte de fatalidad de esta página web, debes hacer clic derecho e ir a Is Inspect Y aquí para estas ventanas, debes elegir elementos. Ahora, vamos al código de Visual Studio, y vamos a crear un nuevo archivo de prueba para los localizadores, localizadores punto spec punto Y solo voy a copiar este caso de prueba de aquí con el Import, vamos a dar un nombre buscando localizadores y solo esta parte con Navigate quedará El primer tipo de CSA seleccionó que vamos a usarlo ID, la D de un elemento web. Entonces, para encontrar la ubicación en la fatalidad de un determinado elemento, podemos dar click en este localizador de recolección, seleccionar elemento, hacer clic en eso y después de eso, debemos dar click en nuestro elemento que queremos encontrar Entonces voy a dar click en este nombre de usuario, resaltará una parte de la fatalidad Y aquí podemos observar todo lo que tiene este elemento. Entonces podemos observar que es una entrada que tiene una clase, un marcador de posición, y también aquí tenemos un ID Ahora intentemos encontrar si este ID es único. Para ello, debemos dar clic en Control más P. Control más F, y aquí aparecerá una entrada de búsqueda. Entonces tenemos dos métodos para escribir la D. El primero es simplemente usar has y el nombre de nuestro ID. Entonces aquí tenemos nombre de usuario. Entonces vamos a tratar de hacer eso. Después de agregar has y nombre de usuario, tenemos uno de uno, lo que significa que este elemento es único. Ahora, intentemos encontrar este elemento por ID. Entonces para localizar este elemento, usaré el localizador del método Specht Entonces localizador de puntos de página, y dentro de este método, voy a pasar este ID. Ahora, intentemos abrir ejecutando la página en ejecución desde la interfaz de usuario. Entonces MPX juega a la derecha prueba UI. Por lo que esto abrirá una nueva página con toda nuestra prueba. Y a partir de aquí, podemos ejecutar la prueba. Así que tengo mi primera prueba de lección anterior y el nuevo localizador de archivos de especificaciones. Entonces intentemos ejecutar esto. Yo hice clic en este botón y observé que solo se ejecutó el G dos, solo esta primera fila Por eso porque aquí en nuestro localizador, no ejecutamos ninguna acción. Entonces solo usaré un click para hacer algo. Simplemente hago clic en este elemento. Así que vamos a ir a A aquí, activé desde el archivo AutoSave, que automáticamente guarda todos mis cambios Así que volvamos y tratemos de correr una vez más. Entonces ahora mismo, podemos observar aquí que tenemos el ir a y también esta acción de clic. Déjame hacerlo más grande. Entonces para esta sección, tenemos nuestra acción y antes y después. Entonces después de que acabamos de hacer clic en esta entrada de nombre de usuario. Intentemos encontrar esta entrada usando el segundo método de escribir XPath Entonces para eso, ese selector CSS de escritura. Usaremos el mismo nombre de usuario de ID, pero lo escribiremos de otra manera. Pondremos el nombre del atributo, el nombre de la etiqueta, que es ID y el nombre de nuestro AD, tenemos el mismo elemento, pero diferente estilo. Entonces déjame poner el segundo IT y ejecutemos esta prueba. Así que aquí podemos observar que el elemento fue encontrado y la acción se ejecutó el click. Ahora, vamos a tratar de encontrar los elementos por clase de selector CSS, el nombre de la clase. Entonces intentemos encontrar el nombre de la clase para este botón de inicio de sesión. Lo borraré y cerraré. Entonces haré clic en este selector después de eso haciendo clic en el botón de inicio de sesión. Y aquí podemos observar que se trata de una entrada con una clase la cual se compone de dos clases, botón de envío y acción de botón. Ahora, si voy a hacer clic en Control F, aparecerá esta búsqueda. Ahora intentemos encontrar la versión más corta de pelear por clase. Entonces agregando el punto y después de eso, el nombre de nuestro plus en caso de que tengamos dos clases, podemos concatenerlas usando Así que ahora mismo, tenemos un elemento encontrado, que es encontrado por CSS selector class name. Así que vayamos a nuestra prueba e intentemos realizar un localizador de puntos de página de clic en esperar, y nuestro localizador, que es por clase el nombre completo de la clase dos cláusulas. Y vamos a realizar un click. Vamos a hacer la prueba. Y aquí observamos que encontramos el elemento y después de hacer clic en el inicio de sesión, se muestra un mensaje de error porque se la contraseña y el nombre de usuario requiere la contraseña y el nombre de usuario, pero están vacíos. Otra forma de luchar contra los elementos web es luchando por su atributo. Así que vamos a tratar de encontrar esta entrada de contraseña pero sus atributos. Aquí tenemos atributos nombre. Tenemos prueba de datos y marcador de posición. Tratemos de encontrar por nombre. Para ello, haremos clic en Control F y el nombre es contraseña. Y tratemos de poner nuestro nombre y contraseña de llaves. Entonces tenemos uno de uno, lo que significa que nuestro elemento es único. Ahora intentemos usarlo en nuestras pruebas. Así que localizador de puntos de página web nuestro elemento web por atributo, y vamos a realizar la acción de clic. Así que déjame ahorrar y vayamos a nuestro corredor. Ejecutemos la prueba, y observemos la nueva acción. Entonces aquí, podemos observar que hemos encontrado entrada de contraseña usando el atributo name y password, y realizamos la acción click. El siguiente método muy común utilizado para encontrar elementos es por su texto. Así que vamos a tratar de encontrar este elemento y simplemente realizar un click sobre este elemento. Entonces, si vas a encontrar este elemento en la fatalidad, déjame hacerlo una vez más Entonces es una edad de cuatro años y contraseña para todos los usuarios. Intentemos encontrarlo solo por texto. Si vamos a ir, déjame contar estos. Y si vas ahí te esperan localizador de dígitos y dentro en texto igual y nuestro texto. Y después de eso, solo realizo un click. Así que déjame guardarlo es autoguardado y vamos a ejecutar la prueba. Y así podemos observar que encontramos nuestro elemento por texto y realizar un click. En dramaturgo, también puedes encontrar elementos web por XPath, pero no es recomendado por el propio dramaturgo, y no vamos a discutir sobre eso, pero tampoco recomiendo usarlo en dramaturgo es muy poderoso cuando hablamos encontrar elementos por selectores En esta lección, discutimos solo sobre cómo encontrar elementos web usando métodos localizadores, pero discutiremos sobre el resto del método en las siguientes lecciones. Nos vemos ahí. 8. Uso de localizadores orientados al usuario en Playwright: Hola a todos. Y en esta lección exploraremos localizadores integrados recomendados por dramaturgos para encontrar elementos usando atributos orientados al usuario Estos localizadores hacen que las pruebas sean más confiables y alinean con la forma en que los usuarios interactúan con la aplicación dramaturgo Dramaturgo ofrece una gran cantidad de métodos, métodos intuitivos que le ayudarán a encontrar mejor y más fácil sus selectores de elementos web Este método get by roll ayuda a localizar los elementos usando sus roles como botones, enlaces, encabezados, etc. El dramaturgo documentación, tenemos una lista muy larga de todos estos roles Puedes echarle un vistazo si quieres. Discutiremos sobre algunos tipos de roles. Así que vamos a llegar al código de Visual Studio. Entonces aquí creé una nueva prueba. Acabo de copiar éste, y aquí sólo tenemos el método de ir a. Ahora, para usar el método G by roll, primero debemos usar nuestro accesorio de página. Entonces un punto de página de peso, y aquí tenemos G B G by Rog Y debemos aportar nuestro papel. Ahora, vayamos a nuestra página de inicio de sesión de swag, e intentemos encontrar algo por rollo Aquí tenemos este botón, y el papel de este botón es un botón. Ahora, intentemos encontrar este botón por rol y por lo que vemos lo que se muestra. Vemos el nombre iniciar sesión. Así que vamos a nuestra bodega de Visual Studio, y pongamos el nombre. Entonces, si cuando estás empezando a escribir, aquí tienes todos estos roles. Es una lista muy larga. Pero vamos a escribir roll button y el nombre de este botón, lo que vemos mostrado. Es el nombre, y el nombre es Login. Y tratemos de hacer un click. Entonces déjame ahorrar y abramos la UY. Así que déjame minimizar. Y desde la terminal, los diputados juegan bien, prueban hay UI. Entonces deberíamos abrir este corredor de UI y aquí tengo el localizador de UserPS. Vamos a correr. Entonces aquí podemos observar eso por botón de rollo, y por nombre. Tenemos aquí nuestro nombre de usuario. Encontramos este elemento e hicimos clic en este. Después de eso, esto fue exhibido. Ahora, intentemos encontrar algo por otra fila. Aquí, echemos un vistazo. Echemos un vistazo a este texto. Así que vamos a tratar de encontrarlo. Entonces es un ahour lo que significa que el rol es un encabezado y el texto es para todos los usuarios Ahora intentemos copiar esa fila y vamos a tratar de encontrar por fila. Aquí también voy a página de distancia que rollo G B y los rollos una calefacción con también una siesta. El nombre que copio el nombre es contraseña para todos los usuarios. Entonces intentemos realizar un click. Entonces, hagamos la prueba y observemos los resultados. Bien, entonces aquí observamos que encontramos este atting por el nombre que se muestra, y realizamos la acción click Ahora intentemos encontrar los elementos por su texto, pero no como lo hicimos en la lección anterior con la ayuda del método build in dramaturgo Por lo que voy a comentar éste y también esperar página. Tenemos el método especial get by text. Y aquí dentro, deberías proporcionar tu texto. Entonces intentemos encontrar algún texto en nuestra página. Entonces aquí tenemos mucha calefacción. Así que vamos a tratar de encontrar por este usuario estándar. Así que Obtener por texto usuario estándar, vamos a tratar de realizar un clic. Voy a ahorrar, y hagamos nuestra prueba. Entonces aquí podemos observar que hizo clic en toda la parte porque este texto está dentro de este bloque de elementos Ahora vamos a tratar de encontrar otro texto, que sólo quedará claro este texto. Entonces aquí solo tenemos laboratorios de swag. Es sólo esta prueba, texto. Entonces déjame cambiar el laboratorio de swag. Vamos a ejecutarlo. Bien, entonces aquí observamos que se hizo clic sólo en este texto El siguiente método es G por marcadores de posición. Y mucha web en formularios, tienes así, así que déjame borrar. Tienes este titular del lugar, nombre de usuario y contraseña para la orientación del usuario. Entonces puedes encontrar estas entradas por este marcador de posición. Así que vamos a tratar de dejarme comentar eso, vamos a tratar de encontrar una manera, página que consigue por marcador de posición y poner un marcador Entonces era nombre de usuario. Vamos a hacer clic y vamos a tratar también de encontrar por que era la segunda contraseña. Contraseña. También, haga clic. Entonces, hagamos esta prueba. Así que aquí descubrimos el primero y el segundo usando el método place holder. Y el último método que vamos a discutir hoy es obtener por identificación de prueba. Se usa muy a menudo en la aplicación de palabras reales. Cuando el equipo de QA junto con el equipo de desarrollo está configurando un atributo de ID de prueba de datos que se usa en todos los elementos de la página. Entonces aquí tenemos eso basado en el ID de prueba de datos, pero se pueden configurar otros atributos. Así que vamos al código de Visual Studio. Entonces permítanme encomiarlo. Y tienes algo así como A wight page y obtienes por identificación de prueba. Entonces pasarás el cursor sobre este método. Entonces aquí tenemos que por defecto se espera algo así como ID de prueba de datos. Pero en nuestra aplicación web, tenemos algo así como prueba de datos, no ID de prueba de datos. Pero cómo observamos aquí que se pueden configurar otros atributos. Y si quieres configurar este atributo, debes ir en tu archivo de configuración y cambiar los datos del atributo test. Así podrás copiar este código y vas a la ubicación configurada de tu dramaturgo Y dentro del uso, debes agregar tus datos de atributo de prueba. Entonces no era nada antes de eso, pero voy a agregar mi atributo test, que es data test. Prueba de datos como en mi aplicación aquí mismo, tenemos mucha prueba de datos por nombre de usuario y prueba de datos prueba de datos por contraseña. Entonces ahora mismo, déjame poner una coma aquí porque tenemos un error Voy a tratar de usar este get by data test ID. Aquí información proporcionamos solo el valor de ese atributo. Entonces intentemos encontrar lo que tenemos para datos para prueba de datos. Entonces tenemos siete elementos. Ahora, intentemos ver que tenemos prueba de datos y el botón Iniciar sesión es el valor. Ahora pondremos solo este valor del botón Login dentro de la prueba de datos de Awight 80, solo el valor, y usaremos el click Entonces intentemos ejecutar esto. Sí, así que nos enteramos de esto por prueba de datos y realizamos la acción de clic. Este get by data test ID es muy útil en la aplicación de palabras reales. Cuando usted, junto con su equipo de desarrollo, nosotros también el equipo de QA podemos agregar este ID de prueba de datos personalizados, que no se cambiará a lo largo del tiempo y su prueba se volverá más estable y confiable. Así que vamos a resumirlo. En la lección de hoy, aprendemos los dramaturgos construidos en métodos que ayudan a escribir pruebas limpias, mantenibles y confiables Este tipo de métodos están integrados y se centran en atributos que tienen menos probabilidades de cambiar durante las actualizaciones de la interfaz de usuario. Y cada uno de estos localizadores se alinea estrechamente con la forma en que los usuarios perciben e interactúan con la aplicación, lo que garantiza que sus pruebas sean eficaces y significativas Espero que lo hayan disfrutado. Nos vemos en la siguiente lección. 9. Localizadores complejos y técnicas de filtrado en dramaturgos: Bienvenido de nuevo. Y en esta lección exploraremos técnicas avanzadas de localización en dramaturgo Aprenderás a navegar por elementos complejos y precisamente a seleccionar elementos usando potentes métodos localizadores como first, last y el elemento por índice. Además, cubriremos cómo encontrar elementos hijos. Así que comencemos. Para nuestra prueba, utilizaremos página principal del producto de nuestro sitio web de SWAG Lab Entonces para eso, vamos a crear una nueva prueba. Yo sólo voy a copiar esta. Sí, entonces déjame cambiar el eliminar este. Y para poder llegar a esta página del producto, debemos hacer el login. Así que déjame hacer el login. Rápido. Entonces aquí tenemos nuestra prueba de datos. Nombre de usuario para este, tenemos prueba de datos Botón de inicio de sesión. Y por lo que recordamos que establecemos nuestro ID de prueba de datos para que sea prueba de datos en la lección anterior. Entonces intentemos hacer el login. Awgpage dot digamos get by data test ID, y el primero es nombre de usuario y para rellenar para escribir, usamos el método Discutiremos sobre este método en la siguiente lección. Pero ahora mismo solo por hacer el login. Ahora déjeme copiar. Y la segunda prueba de datos de 1 segundo prueba de datos ID de prueba es contraseña. Entonces usemos contraseña, y nuestra contraseña es salsa secreta. Bien, fuente secreta. Y copiemos también para el último para nuestro botón. Entonces hice clic por error, salgamos. Y aquí la prueba de datos, es botón de inicio de sesión. Déjame copiarlo y pegarlo aquí y haremos click en este botón de inicio de sesión. Entonces vamos a probar. Vamos a minimizar, y probemos si está funcionando correctamente, nuestro inicio de sesión. Entonces déjame correr esto y observar el resultado aquí. Contraseña. Sí, entonces es un error. Entonces déjame copiarlo desde aquí. Contraseña. Sí, es un error tipográfico Entonces sí, debería ser contraseña. Bien, entonces cancelemos la carrera y volvamos a ejecutarla. Bien, entonces después de eso, terminamos en nuestra página de productos. Aquí realizaremos nuestro filtrado. Entonces comencemos con el primer tipo de filtrado. Filtrado por primer elemento, último y el elemento por índice. Entonces aquí en esta página del producto, tenemos muchos botones con la tarjeta Auto. Entonces intentemos encontrar el selector CSS por rol para este botón. Entonces aquí tenemos botón y texto de tarjeta automática, el nombre. Entonces intentemos encontrar por el rollo una página de peso, obtener por rol y el rol es botón. Sí. Y el nombre de este botón es agregar por lo que debe ser como una cadena, agregar a la tarjeta. Ahora intentemos realizar un click así hago clic en este elemento. Entonces voy a ahorrar. Así que vamos a correr eso. Ahora, aquí tenemos un error. Así que déjame maximizar eso. Y aquí en la parte superior del error, podemos observar ese nombre agregar a la tarjeta resolver a seis elementos. Por lo que aquí podemos observar destacados seis elementos. Por lo que puede suceder en aplicación del mundo real que para el mismo localizador, tengas más de un elemento. Entonces en estos casos, si no podemos encontrar un mejor Path, lector celular único, podemos usar el método especial curt Y este método realizará la acción sobre el primer elemento. Entonces déjame correr y observar lo que pasó. Entonces se está ejecutando en la fuente, y aquí podemos observar que hicimos clic en el primer botón a to card A to card Entonces hicimos clic en el primero y se quitó el botón Ahora, la misma situación, podemos aplicar la última. Y aquí el dramaturgo dará click en el último elemento. Entonces intentemos correr y observar lo que pasó. Entonces sí, aquí podemos observar que hicimos clic en el último botón Agregar al carrito Bien, pero en situaciones en las que queremos hacer clic, digamos, en la tercera, en qué podemos lograr algo así. Entonces, en lugar de usar primero y último, podemos dar click sobre los elementos por su índice. Por lo que el dramaturgo tiene un método especial, que puede hacer clic por su índice, y el índice se basa en cero, lo que significa que el primer elemento tendrá índice cero, el segundo elemento, el uno y el tercero dos Entonces aquí proporciono dos, lo que significa que vamos a hacer clic en el tercer elemento. Entonces déjame correr eso y observar lo que va a pasar. Entonces podemos observar que hicimos clic en el tercer elemento, y ahora se quitó el fondo Intentemos filtrar nuestros elementos por su texto. Entonces aquí, podemos observar que cada elemento tiene su clase y su prueba de datos, artículo de inventario. Ahora, vamos a tratar de encontrar esta prueba de datos. Déjame comentar solo esta fila y esperar página G por prueba de datos. Y esta prueba de datos será artículo de inventario, intentemos realizar click. Entonces esto no debería funcionar porque deberíamos tener un año o 46 elementos. Y también aquí, el dramaturgo nos está mostrando cómo podemos filtrar eso por el texto Entonces hagamos algo así. Entonces aquí, cada bloque de elementos web tiene su propio nombre. Entonces intentemos filtrar y dar clic en los laboratorios de salsa AO Z. Así que déjame copiar este texto ¿Éste? Bien. Déjame copiarlo. Y después de eso, podemos podemos encadenar el método de filtro. Y dentro de este método de filtro, podemos proporcionar el texto o el elemento web que queremos filtrar. Entonces intentemos empecemos filtrando por texto. El texto no tiene texto y no tiene. Tenemos cuatro tipos diferentes de filtrado. Así que vamos a filtrar por un texto. Y aquí estamos esperando para este texto, y vamos a realizar el click. Ahora el dramaturgo debería encontrar todos estos elementos web por ítem de inventario, y después de eso, debemos filtrarlos por este texto y realizar el click Así que vamos a ejecutar esto y observar cómo se filtra para. Entonces aquí esperamos que filtremos y pulsemos solo en éste por su texto. Ahora echemos un vistazo a cómo podemos realizar este filtro no por texto, sino por otro localizador dentro de este bloque de elementos. Entonces echemos un vistazo. Digamos que queremos dar click en éste, pero no por texto, sino por otro localizador. Entonces aquí hay un bloque es un div con artículo de inventario. Y aquí tenemos este texto, que es un enlace. Si vas a hacer clic en eso, abriremos esta página. Entonces a partir de aquí, podemos extraer otro localizador por rollo, que es el rol de link y el nombre de este nombre. Entonces déjame copiar. Y aquí podemos usar filtro. Y dentro del filtro, usemos el filtrado por otro localizador. Entonces en cuanto a localizador y no tiene es también para localizador, sino etapa de negación, obtener por rol, y observamos que nuestro rol es un enlace y que este enlace tiene el nombre Entonces déjame poner el nombre que copiamos y vamos a realizar nuestro click. Entonces déjame guardar y vamos a observar los resultados. Sí. Entonces aquí podemos observar que solo hicimos clic en éste porque filtramos por otro elemento web La documentación de dramaturgo tiene una lista muy larga de ejemplos, ejemplos útiles sobre cómo puedes usar estas opciones de filtrado Entonces eso fue para la lección de hoy. Aprendimos cómo podemos usar sed al final y encontrar los elementos por su índice. Y también, descubrimos cómo podemos filtrar por texto o por otro elemento web. Nos vemos en la siguiente lección. 10. Extrae valores y texto de elementos web: Bienvenido de nuevo. Y en esta lección exploraremos cómo extraer valores de localizadores como contenido de texto o atributos y trabajar con múltiples elementos de manera eficiente Además de eso, discutiremos cómo almacenar localizadores en constantes para un mejor uso del código y cómo almacenar localizadores en constantes para un mejor uso del código y mantenibilidad. Empecemos. El primer método que queremos discutir es el contenido de texto, cómo podemos extraer el texto de un elemento web. Entonces digamos que terminamos en esta página de SwaglaGpduct, y después de hacer clic en el botón de anuncio a tarjeta, queremos afirmar, queremos verificar que el texto se elimine después de hacer y después de hacer clic en el botón de anuncio a tarjeta, queremos afirmar, queremos verificar que el texto se elimine después de hacer clic. Entonces, ¿cómo podemos hacer eso, vayamos a un código de Visual Studio. Voy a copiar nuestra prueba. Cambiemos el nombre a algo así como extraer valores. Y aquí voy a mantener sólo este registro en parte porque necesitamos estar en esta página del producto. Entonces ahora mismo, hagamos el click sobre esto primero en este primer elemento web. Entonces intentemos encontrar este elemento. Es una tarjeta ato. Bien, entonces espero una página que Hagamos por todos consigue por Roth y el rollo es botón Y el nombre es Agregar al carrito. Nombre. Agregar a la tarjeta. Entonces conocemos ese botón A a la tarjeta, tenemos como seis, y vamos a hacer clic sólo en el primer elemento. Bien, así que abramos el corredor de UI. Para eso, vamos a escribir Bx play write test, hay y UI, y déjame minimizar Vamos a hacer clic en Entrar. Sí, así que ahora tenemos aquí fuera extraer valores. Así que déjame ejecutarlo. Estamos realizando login, y después de que al final, estamos dando click en este botón, y este botón se convirtióSRMove Bien, entonces ahora es el momento de verificar si este botón se convirtió en botón de eliminar texto. Así que vamos a tratar de encontrar un selector remove para este botón de eliminar. Entonces aquí, podemos observar que tenemos una prueba de datos, y también tenemos una identificación. Tomémoslo por prueba de datos. Entonces copio esta prueba de datos, y vamos a ir a nuestro código a nuestro estudio visual. Así que aquí espero página punto G por ID de prueba, y aquí voy a proporcionar mi ID de prueba y nuestro método de contenido de texto. Entonces este método devolverá una promesa con una cadena. Extraeremos el texto de nuestro elemento web. Nos lo va a dar. Así que vamos a almacenar este contenido de texto en una variable. Entonces voy a obtener una const y nombrarlo botón de texto, algo así Bien. Entonces después de eso, haré un registro de consola para ver el valor de este botón en la consola. Así que déjame ejecutarlo. Y aquí tenemos consola. Entonces aquí tenemos nuestro texto eliminado. Y después de eso, también podemos agregar una aserción para verificar para verificar nuestros resultados Así que espera que el botón, el texto y nuestro sensor sean y eliminen. Bien, vamos a ejecutarlo y así fuera el pase y se quita el texto. Entonces, con la ayuda del texto con ese método, podemos extraer el texto de un elemento web. A veces queremos verificar el valor de un atributo específico. Entonces en nuestro caso, aquí tenemos un marcador de posición para el nombre de usuario y para la contraseña para una mejor orientación al usuario Pero digamos que quiero comprobar si estos atributos son correctos. Entonces déjame hacer la inspección a los elementos, y busquemos para esta contraseña. Así que aquí tengo tipo contraseña y contraseña de marcador de posición. Quiero comprobar que tenemos nuestro marcador de posición correcto. Entonces déjame encontrar este elemento de ID. Bien. Vamos a obtenerlo por identificación. Bien, entonces aquí tenemos nuestro texto. Yo solo vendré en esta parte de inicio de sesión y borraremos esta. Voy a esperar página punto Localizador, y voy a agarrar esto con hash y nuestro ID. Y nuestro método especial, obtener atributo. Y aquí debemos pasar el atributo que queremos recibir el valor de este atributo. Entonces nuestro atributo es placeholder, pero queremos verificar el valor Así que déjame agregar aquí porta lugar. Y también vamos a guardar esto en un valor en valor de marcador Bien, entonces ahora aquí en nuestros contras, deberíamos guardar el valor de nuestro marcador de posición del localizador de contraseñas Entonces hagamos un Csalog para observar este valor. Y también, agreguemos una aserción, esperar y para que nuestro valor de marcador de posición de esperar sea, y estamos esperando algunas contraseñas Sí, estamos esperando. Así que aquí Pase. Palabra. Bien, hagamos la prueba. Y en la consulta, deberíamos tener contraseña y observamos que nuestra prueba pasó. Así que aquí con la ayuda de get attribute, extraemos el valor del atributo placeholder Así, se puede extraer el valor para todos los atributos. Digamos que si quieres extraer el valor de prueba de datos, aquí en lugar de marcador de posición solo agrega datos sí y aquí tendrás el valor de prueba de datos El siguiente método que queremos discutir es el valor de entrada, que extraerá el valor de un área de texto o de una entrada. Y en los casos en los que escribes algo, y después de eso, quieres verificar si tu texto se muestra correctamente, puedes extraer este texto y verificarlo. Así que vayamos al código de Visual Studio e intentemos realizar algo así. Entonces estamos en esta demostración fuente, bien, y después de eso, quiero escribir algo en este campo de nombre de usuario. Entonces déjame borrar estos campos, también, este, y vamos a encontrar el selector CSS para nuestro nombre de usuario. Entonces aquí, podemos tomarlo por ID, y vamos a escribir el ID sin hash, pero algo ID igual y el valor ID. Entonces aquí tenemos uno de f. ahora, vamos a nuestro código de Visual Studio, y aquí voy a tratar de usar el selector CSS. Por lo que voy a crear un costo con el nombre de usuario campo de entrada. Y en este costo, voy a almacenar página punto Localizar localizador y nuestro localizador. Ahora en este campo de entrada de nombre de usuario usuario, tenemos nuestro elemento. Ahora, después de que vayamos a esta demostración de origen, quiero escribir algo en este campo de nombre de usuario. Entonces para hacerlo, hagamos un campo de entrada de nombre de usuario de peso, y con la ayuda del relleno metálico, pongamos un texto. Entonces también permítanme crear aquí otro texto const. Para el nombre de usuario. Bien, almacenaremos el texto aquí y vamos al texto del nombre de usuario, prueba. Bien. Entonces aquí tengo mi texto, y quiero escribir esto en nuestro nombre de usuario. Bien. Entonces después de escribir, vamos a guardar y veamos los resultados. Bien, entonces sí. Entonces aquí, nuestra entrada de nombre de usuario tiene nombre de usuario texto, texto, texto, texto dos veces el texto debe ser texto. Bien. Ahora bien, si quiero afirmar que nuestra entrada contiene el valor correcto, puedo extraer el valor Entonces, ¿cómo puedo hacer eso con la ayuda del método input value. Entonces es un peso También al volver a usar este costo, no estoy escribiendo dos veces el mismo elemento. Sólo estoy reutilizando el costo. Entonces nombre de usuario campo de entrada, punto, y valor de entrada. Y aquí, este método está devolviendo la cadena de nuestra entrada. Déjame guardar esto a otra const. Así const y veamos el texto entrada del nombre de usuario nombre Bien, entonces ahora que tenemos en esta const, guardamos el texto de la entrada del nombre de usuario Y además, hagamos un registro de consola. Quiero ver este texto en la consola y agregar una aserción. Espere nuestro texto de la entrada del nombre de usuario. Para ser igual que nuestro texto de aquí, Nombre de usuario. Entonces pongámoslo así. Vamos a ahorrar, y vamos a correr. Aquí tenemos la consola. Deberíamos ver. Sí, así que el texto del nombre de usuario , la prueba y nuestra prueba pasaron. Entonces, si quieres extraer el texto de una entrada o de un área de texto, debemos usar el valor de entrada. Vamos a discutir sobre cómo podemos manejar múltiples elementos web. Y el primer método que quiero discutir es el método que se utiliza a menudo para contar cuántos elementos tenemos en una página. Así que vamos a crear otra prueba. Voy a copiar este, pegarlo aquí mismo, extrayendo y digamos múltiples valores. Voy a eliminar esto y solo me quedaré con la parte con el login. Entonces lo que quiero hacer en esta prueba después del inicio de sesión, quiero contar cuántos elementos tengo en esta página. Así que vamos a tratar de encontrar el selector CSS para un elemento. Entonces aquí podemos observar que cada elemento tiene esta clase, eventy nombre de elemento Bien. Déjame copiarlo. Y veamos si, sí, tenemos seis de ellos. Ahora vamos a nuestro código de visual studio. Y vamos a hacer un localizador de puntos de etapa de peso, y al encontrar por clase, estamos usando notación de puntos y en worder para extraer todos estos elementos, debemos usar el método de Este método está devolviendo una promesa con matriz de localizadores Vamos a guardar esta matriz a una constante. Entonces voy a crear una const de productos y ahora intentemos hacer una consola para ver todos estos elementos en nuestra consola Así que todos los productos. Así que déjame ahorrar, y vamos a tratar de correr. Aquí en consola. Entonces aquí tenemos todos estos localizadores como una matriz. Tenemos nuestros corchetes, corchetes. Ahora intentemos hacer una aseveración para verificar el número total Entonces esperemos también todos los productos. Y como nuestro método es devolver una matriz, tenemos este parámetro de longitud que está devolviendo la longitud, el número total de nuestra matriz y nuestra longitud para estar aquí es exportación, esperamos que Rylenth sea, y estamos esperando tener seis Ahora, vamos a ahorrar. Vamos a correr. Y aquí observamos que nuestra prueba pasó con éxito. Otra característica importante que quiero mostrarles es cómo con la ayuda, el dramaturgo, se pueden buscar los localizadores Entonces aquí tienes un botón que es el localizador de recolección, si vas a hacer clic en este botón, y después de eso, harás clic en algo en una página que quieras buscar para el localizador. Digamos que quieres para el botón de inicio de sesión. Vamos a hacer clic en el botón Iniciar sesión. Aquí, dramaturgo te dará el localizador, que es casi cada vez que es correcto Siempre se puede verificar eso. Pero con la ayuda de esta funcionalidad, puedes encontrar los localizadores para muchos de los selectores CSS o los localizadores para muchos de u muchos elementos web también está proporcionando por rol o por ID de elementos web también está prueba de datos El siguiente y último método que quiero discutir hoy es un método que también extrae el texto de un elemento web, pero puede manejar múltiples elementos. Digamos que estamos en esta página y queremos extraer el nombre de todos estos productos. Entonces para eso, deberíamos agarrar vamos a darle por clase el nombre del artículo de inventario. Entonces aquí ya lo tenemos del ejercicio anterior. Entonces digamos que tenemos todos los productos, pero en cambio, todos usemos todo el contenido de texto. Bien, entonces este método está devolviendo también una matriz de cadenas, pero es una matriz de cadenas. Y permítanme comentar esta aseveración fracasará. Pero déjame hacer un conslo para todos los productos, y vamos a cambiarle el nombre todos los productos de texto porque estamos extrayendo sólo el texto Bien, así que vamos a ejecutarlo. Y aquí en la consola, tenemos RA, tenemos los corchetes con todos estos nombres. Y digamos que queremos afirmar que al menos uno de estos artículos es nuestro artículo con luz de mordida de losa Entonces para hacerlo, usemos una aserción, esperemos que todos los productos contengan, aquí tenemos que contener, lo que comprobaremos si al menos uno de estos elementos o nuestro elemento volverá a través Entonces copiemos este nombre tan ligero. Bien. Vamos a ahorrar, y vamos a correr. Entonces aquí tenemos nuestra prueba de prueba porque las losas S por luz es la segunda de nuestra prueba. Eso es todo por la lección de hoy. Aprenderemos cómo podemos extraer valores de texto de elementos individuales y de múltiples elementos. Nos vemos en la siguiente lección. 11. Escritura de aserciones en dramaturgo: Bienvenido a esta lección sobre aseveraciones. Son críticos para verificar que tus pruebas se comporten como se esperaba. Aseguran que su aplicación funcione correctamente al comparar los resultados reales con los valores esperados. Hoy cubriremos cómo usar la aserción en dramaturgo y exploraremos diferentes métodos de aserción Ate proporciona una afirmación incorporada a través de la función expect Esta afirmación se utiliza para validar diversos aspectos de la página como elemento, visibilidad, contenido de texto o atributos Entonces, globalmente, tenemos dos tipos de aserciones auto reintentando aserciones y no reintentando aserciones y no Entonces comencemos por usar esta simple aserción como esta para ser Vamos al código de Visual Studio. Y aquí déjame copiar. Entonces aquí vamos a crear una nueva prueba con aserciones. Bien, entonces estas simples aseveraciones, digamos que tenemos una edad const, y el valor es 22 Bien. Entonces ahora digamos que queremos afirmar que este valor es 22 Entonces para eso podemos usar la función o método especial, esperar y envejecer y ser 22. Entonces aquí podemos observar que este método, el tipo de retorno de este método es nulo. No es devolver una promesa. Y por eso no estamos usando una espera aquí mismo porque un peso solo se usa cuando la función está devolviendo una promesa. Bien. Entonces ahora intentemos ejecutar esta prueba. Vamos a P jugar bien probamos, ahí está el GY, y vamos a tener así que déjame llevar esto a esta página. Bien. Entonces aquí tenemos aseveraciones. Vamos a correr. Bien, entonces aquí pasó nuestra prueba porque solo verificamos que nuestra edad es de 22. Bien. Entonces también aquí tenemos un montón de diferentes tipos de aseveraciones en la documentación del dramaturgo, como estar cerca, que está comprobando que este número es aproximadamente igual a algo o ser mayor que ser nulo para ser verdadero y contener, tener texto, algo así El siguiente tipo de aserciones son las aserciones de reintento automático. Entonces intentemos usando el primero, que es verificar el elemento text. Entonces, para esta lección, vamos a usar esta interfaz de usuario probando playground.com con Auto Await Entonces déjame copiar este y vamos a llamar a Visual Studio. Entonces aquí, comencemos navegando a esta página. Espere página, vaya a, y agreguemos nuestra URL. Bien. Queremos probar que esta mantequilla tiene el dex, aplicar 5 segundos, hacer clic con el botón derecho Inspeccionar y vamos a verificar nuestros registros CSS. Vamos a agarrarlo por AD. 5 segundos, y vamos a tratar de ver si es único. Entonces déjame copiar. Aplicar botón cinco. Bien, entonces tenemos uno de uno. Además, agreguemos has. Bien, uno de uno. Déjame agarrar este elemento así que volvamos al código de Visual Studio, y vamos a crear un costo donde guardaremos este elemento. Entonces const, vamos a dar 5 segundos. Localizador de puntos de botón y página, y aquí, pasemos nuestro localizador. Ahora queremos hacer valer el texto dentro de este botón. Entonces para eso, tenemos un método especial que es tener texto. Así que usemos función especial esperar y botón de 5 segundos y nuestro método para tener texto. Y aquí nuestros textos aplican 5 segundos. Entonces, si vamos a pasar esto para tener texto, observamos que el tipo de retorno, aquí es una promesa, lo que significa que debemos usar aquí wait porque tenemos el tipo return de wait promise, deberíamos usar wait Así que vayamos a nuestro corredor e intentemos correr. Bien, entonces nuestra prueba pasó, navegamos a esta página y verificamos el texto de este botón Ya usamos este tipo de aseveración en la lección anterior En la siguiente aseveración comprobaremos la visibilidad. Digamos que estás en una página y quieres afirmar que un botón es visible, donde después de completar algo y hacer clic en el botón enviar, quieres afirmar que apareció un cierto mensaje de éxito Entonces en este caso, podemos usar el método es ser visibles. Entonces aquí tenemos un montón de opciones, visibles habilitadas editables, y aquí tenemos botón Podemos aplicar a este botón, estas condiciones. Entonces digamos, vamos a hacer clic en este aplicar por 3 segundos, y el elemento objetivo desaparecerá por 3 segundos. Ahora, ya tenemos aquí nuestro botón de 5 segundos, y hagamos clic en este botón. Así que espera 5 segundos punto, haga clic. Bien. Y permítanme comentar éste. Así que vamos a correr, y vamos a observar lo que va a pasar. Bien, entonces déjame correr de aquí voy a ser mejor visibilidad. Bien, estaba abierto en otra ventana. Así que permítanme minimizar y correr en más tiempo. Entonces aquí después de hacer clic en éste, este botón desaparecerá por 5 segundos. Bien, voy a correr así. Entonces ahora mismo, queremos afirmar que nuestro botón es visible Así que vamos a agarrar el selector CSS para este botón. Bien, entonces aquí tenemos identificación y objetivo. Bien. Control V uno de uno. Bien, nuestra identificación es el objetivo. Entonces déjame maximizar. Y vamos a crear nuestro botón de objetivo de botón. Así const botón objetivo y es localizador de puntos de página y Por AD. Bien. Ahora bien, si quieres marcar este botón, es visible, debemos usar el método assertion special para que sea visible Bien. Entonces hagamos un botón esperar esperar objetivo y ser visibles. Bien. Entonces veamos qué va a pasar aquí. Entonces navegaremos por esta página. Después de eso, haremos clic en este botón de 5 segundos, y este botón desaparecerá por 5 segundos, pero esperamos ver este botón. Así que vayamos a nuestro UI Runner e intentemos correr. Entonces aquí estamos esperando que el botón sea visible, pero está oculto. Y al parecer se exhibió después de 5 segundos, pero nuestra aseveración falló. Pero se puede observar que cuando estamos corriendo, estas aseveraciones esperan una cierta cantidad de tiempo Sí, entonces aquí tenemos 5 segundos. Así es como funcionan las afirmaciones de reintento automático. Están revisando una y otra vez por cierto tiempo la condición a adjuntar para que sea visible o para ser deshabilitada. Entonces en nuestro caso, esto para ser visible, también es puede recibir un tiempo de espera y por defecto, este tiempo de espera es de 5 segundos Entonces, cuando hagamos clic en este botón, digamos 3 segundos. Déjame referirme para que este botón desaparezca por 3 segundos. Nuestro método esperará 3 segundos y después de eso, haremos valer el botón Pero también podemos dar el tiempo de espera personalizado. Así podemos agregar llaves Carly y tiempo de espera, y pongamos el tiempo de espera 6 segundos. Aquí está el tiempo de espera milisegundos. Y ahora, si vamos a ejecutar esto. Entonces déjame correr. Observaremos que nuestra adhesión está a la espera, esperando 5 segundos. Después de eso, el botón después de 5 segundos, el botón se vuelve visible. Y al final, la aseveración es cierta. Entonces aquí observamos que se mostraba el botón y nuestra prueba pasó. El siguiente tipo de aseveración que queremos discutir hoy es verificar si un elemento está habilitado o deshabilitado Entonces aquí tenemos una opción de este botón para ser habilitado. Y si vas a hacer clic en este botón aplicado, este botón se desactivará durante 5 segundos. Así que déjame hacer clic una vez más. Y aquí observamos que es calificación, algo así. Entonces, ¿cómo podemos probar eso, vamos a nuestro código de Visual Studio. Entonces aquí tenemos nuestro objetivo, nuestro botón de 5 segundos, y también necesitamos agregar un localizador más. Para nuestro desmarcado para nuestra casilla de verificación habilitada. Entonces vamos a tratar de encontrar este. Entonces aquí tenemos una lista con una entrada. Es una entrada. Es una casilla de verificación con nombre habilitado. Así que ahora intentemos desmarcar esta casilla de verificación. Entonces para eso esta es una página de peso, y vamos a ponernos por rollo. Y el papel de ello es una casilla de verificación. Entonces tenemos aquí una casilla de verificación con el nombre el nombre está habilitado. Entonces veamos de donde consigo todo esto. Entonces aquí tenemos es un talonario de cheques, una casilla de verificación que podemos observar, y los nombres habilitados desde aquí. Bien, entonces nombre habilitado. Y hagamos Hm. Podemos hacer click si queremos verificar verificamos. Pero también dramaturgo proporciona métodos costa, método incorporado, que está desmarcado y este método desmarcará bien desmarque nuestra casilla Entonces déjame ahorrar, aquí necesito agregar algo. Sí. Ahora es correcto. Entonces ahora voy a desmarcar desmarcaré esta habilitada. Después de eso, haré clic en este botón de 5 segundos. Entonces al principio, permítanme verificar si este botón está habilitado. Así que espera y aquí tengo el botón Target para ser habilitado. Bien, entonces ahora solo voy a comentar todo aquí. Así que vayamos a nuestro corredor. Vamos a correr. El SRT se pasa porque nuestro botón está habilitado. Ahora, vamos a comprobar esto habilitado, y vamos a hacer clic en estos 5 segundos. Y después de eso, quiero verificar que nuestro botón de objetivo quedó deshabilitado. Entonces tenemos que estar discapacitados. Es una negación del primero. Entonces déjame borrarlo y vamos a ir a nuestro corredor. Entonces estamos navegando después de eso, estamos comprobando que este botón esté habilitado. Estamos deshabilitando y marcando esta opción habilitada. Después de eso, estamos dando click en estos 5 segundos, y al final, nuestro botón se vuelve habilitado y nuestra prueba pasó También aquí, solíamos estar habilitados y deshabilitados. Estos están construidos en el método dramaturgo, pero también se puede negar casi cada Entonces puedes usar algo así, dardo, no para ser habilitado o dardo no para ser deshabilitado, lo cual no es muy popular, y realmente no recomendaría usar eso porque a veces puede empeorar. Es mejor usar algo así como estar deshabilitado si tienes esta posibilidad. Y el último tipo de aseveración para hoy son las afirmaciones suaves Por lo general, cuando nos encontramos con una aserción fallida, nuestra prueba se termina, y la ejecución también se termina. Está terminado. Pero con la ayuda de la afirmación suave, no están terminando la ejecución de la prueba, y puedes continuar tus acciones después de que esta aserción fallara, pero la prueba se marcará Entonces intentemos usar la afirmación suave. Entonces tenemos aquí, vamos a mantener sólo este botón de objetivo. Y hagamos una afirmación del valor del texto. Entonces podemos esperar que el botón objetivo y nuestra sesión dos tengan texto. Sí. Y el texto, es botón. Bien, así que vayamos a nuestro corredor de pruebas. Vamos a correr. Sí, entonces nuestra prueba pasó porque esta aseveración fue aprobada porque el texto es mantequilla Entonces después de eso después de que nuestro objetivo esperado haya pasado, también podemos realizar una acción. Entonces usemos algo como también aquí deberíamos poner aguarda porque está devolviendo una promesa. Bien. Y ahora usemos wait, target, button y click. Así que vamos a correr. Sí, entonces nuestra aseveración pasó y hicimos clic en este Pero digamos que agregamos aquí algo así como esperas que el botón Target tenga botón de texto nuevo. Ahora nuestra prueba debería fallar ante esta afirmación. Entonces aquí, está esperando 5 segundos porque han leído intentado durante 5 segundos. Y falló. Y el último paso no se ejecutó porque esta afirmación aquí falló Pero por si quieres ejecutar este paso, no importa si nuestra aserción falló o no, podemos usar aserciones suaves Así que después de esperar solo agrega suave. Y si esta aseveración fracasará, nuestras próximas acciones serán ejecutadas Entonces probémoslo. Entonces aquí estamos a la espera de 5 segundos para tener botón nuevo texto y va a fallar. Pero después de eso, estamos realizando las siguientes acciones. En nuestro caso, estamos realizando un clic porque usamos aserciones suaves Entonces vamos a resumir lo que discutimos en esta lección. Entonces cubrimos esta afirmación no reintentable que dramaturgo tiene mucho Puedes echar un vistazo a esta documentación de dramaturgo. Además, discutimos sobre la afirmación de reintentos y cómo funcionan y qué tipo de tiempo de espera puede proporcionar. Discutiremos sobre el tiempo de espera en la siguiente lección. Y al final, discutimos cómo puedes usar la aserción suave cuando no quieres terminar ejecución de tu prueba cuando una aserción ha fallado Así que vea en la siguiente lección. 12. Espera y manejo automáticos de tiempos de espera: Hola. En esta lección, vamos a discutir sobre la espera automática de acciones, aserciones, y también vamos a discutir sobre tiempos de espera Entendamos lo que significa un auto esperando en dramaturgo Así que el dramaturgo espera automáticamente a que su elemento Vb se adhiera a la fatalidad para que sea visible, habilitado Entonces aquí tenemos una mesa con todas las acciones del dramaturgo y lo que están esperando Entonces en caso del click, estamos esperando que el elemento sea visible, estable, reciba eventos, habilitado, y solo no estamos esperando que el elemento sea editable Además, tenemos aquí toda la lista. Para la prensa, no tenemos ninguna disponibilidad automática. Y aseveraciones, también están a la espera de algo como esto Entonces comencemos entendiendo cómo elemento espera a ser visible Entonces aquí tenemos un sitio web, y aquí podemos establecer la media y el tiempo máximo para que se complete una acción. Entonces pongamos cinco y cinco. Y cuando hagamos clic en este disparador, tardarán 5 segundos hasta que se muestre la acción . Entonces haremos clic en gatillo. Voy a esperar 5 segundos, y después de 5 segundos, un botón de acción A, debería aparecer un botón de acción A, haga clic en mí. Entonces ahora intentemos automatizar esto. Queremos establecer los primeros 5 segundos. Después de eso, queremos hacer clic y nuestra acción esperar a que este botón sea visible. Así que vamos al código de Visual Studio. Ya creé una prueba fuera de casa así que déjame copiar esta URL. Entonces esta es nuestra URL. Ahora, vamos a crear algunos selectores CSS, inspeccionar. Entonces comencemos con esta media y aquí está una entrada. Podemos obtenerlo por marcador de posición. Tenemos un marcador de posición significó peso. Entonces copiemos y vamos a crear. Así const media entrada, página igual obtener por marcador Tenemos el método especial incorporado, y aquí está el marcador de posición. Bien. Ahora queremos sed. Queremos borrar el valor, que por defecto es dos. Queremos despejarla y teclear cinco. Entonces vamos a realizar esta sección. Entonces digamos que el peso significa entrada que claro. Este es un método especial que vamos a aclarar. Y también esperemos entrada media para llenar, y vamos a llenarlo de cinco. Así es como estamos usando nuestro selector web CSS. Creamos y comenzamos en una constante, y después de eso, estamos usando eso. Ahora intentemos activar este botón, haga clic en este botón. Así que vamos a encontrar el selector CSS. Y aquí tenemos un botón W el nombre disparador. Vamos a tratar de conseguirlo por rollo. Entonces un peso, página, obtener por rollo, y la fila, no es vulnerable. Botón. Y el nombre nombre era disparador. Entonces gatillo. Y usemos click. Entonces déjame correr esto desde el dramaturgo NP, T Y. Así que aquí tenemos a nuestro corredor fuera de espera, corramos y observemos lo que va a pasar Entonces veamos qué aquí. Entonces desencadenar resultado a seis elementos. Tenemos mucho botón de disparo, pero aquí tenemos que hacer clic en el primero. Entonces para eso, podemos usar el método especial. Usemos por índice. Y el índice es cero, basado en cero. Entonces cero será el primero. Tenemos que dar click en el primer elemento. Bien. Entonces intentemos correr. Entonces aquí nuestro pase de prueba porque hicimos clic en este elemento disparador Después de hacer clic, debemos esperar este botón arriba aquí. Así que vamos a agarrar el selector CSS para este botón. Bien, así podemos agarrarlo también. Es un botón por nombre, haz clic en mí. Bien. Entonces vamos al código de Visual Studio. Y veamos esperar página. Obtener por rollo. El rol es botón y el nombre por lo que debería ser así. El nombre es Click Me. Entonces usemos un clic. Ahora, hagamos nuestra prueba y observemos lo que va a pasar. Por lo que ahora observamos que el click M está esperando. Esperé casi 5 segundos en zancuda para hacer clic en este botón Por lo que se hizo clic en este botón después de 5 segundos y ya pasó la prueba Pero en los casos, digamos que podemos tener algo como aquí, podemos tener diez y también, digamos máximo, diez cuando vamos a hacer clic, deberíamos esperar más de 5 segundos, pero el tiempo de espera predeterminado para nuestra acción es de 5 segundos Por lo que nuestra prueba fallará si vamos a esperar más de 5 segundos. Pero el dramaturgo nos proporciona un tiempo de espera para cada acción Entonces aquí podemos establecer el tiempo de espera como parámetro para nuestra acción Así que déjame intentar establecer el tiempo de espera para 3 segundos. Aquí está en milisegundos. Y ahora intentemos correr y observar lo que va a pasar. Entonces estamos corriendo y aquí lo servimos. Está esperando, está esperando, y después de 3 segundos, fallará porque nuestro botón para nuestro botón, tarda hasta 5 segundos en mostrarse. Así podemos configurar muchos valores como diez 10 segundos. Así que vamos a correr, y nuestra prueba debería pasar porque nuestro botón está tardando 5 segundos, pero click me espera 10 segundos. Ahora vamos a observar cómo se habilitan las obras. Aquí tenemos un botón deshabilitado. No podemos hacer clic realmente en él. Entonces veamos. Entonces aquí, nuestro botón está deshabilitado. Pero después de hacer clic en este botón disparador, esperará 3 segundos y después de eso, nuestro buttle estará habilitado Entonces digamos que queremos dar click sobre este botón. Ahora, ya tenemos este botón de disparo. Es una vez que liberas al tercero, lo que significa que será por índice por intex dos porque está basado en cero, Entonces vamos a dar click sobre esto. Ahora, vamos a agarrar el selector CSS para esto habilitado. Es botón deshabilitado. Bien. Entonces veamos. Botón deshabilitado. También es un botón. Por rollo. Bien, así que intentemos hacer click sobre esto. Entonces tenemos una página de peso, G B Roll. Además, pongamos que es un botón con el nombre. Así que solo un botón, y vamos a realizar la acción de clic. Entonces, hagamos la prueba y observemos. Entonces aquí estamos observando que estamos esperando, y después de 5 segundos, nuestro botón se habilitó y realizamos el click. Entonces ahora intentemos establecer el tiempo de espera aquí para 2 segundos y observar el error. Entonces, vamos a ahorrar. Y vamos a correr. Y ahora tenemos que estar aquí en el error. Sí, así que ahora aquí tenemos el tiempo de espera para la segunda gran semilla. Y aquí tenemos el error porque estábamos esperando que el elemento fuera visible, habilitado, y estable, pero el elemento no está habilitado. Por lo que el dramaturgo proporciona unos registros de errores muy potentes a partir de los cuales se puede entender dónde está el problema y se puede resolver más fácilmente Dramaturgo proporciona un potente sistema de espera para nuestra solicitud de red Entonces veamos cómo sucede. Entonces aquí, si abres la pestaña Red, cuando estamos realizando acciones, nuestra solicitud puede llevar mucho tiempo. Entonces aquí tenemos una solicitud en estado de gasto, y puede tardar hasta 15 segundos. Entonces aquí lo estamos observando gastando, y esperemos a que se complete la solicitud. Después de 15 segundos, nuestra solicitud está completada, y se mostraron estos datos cargados con Jacques get request. Entonces digamos que queremos activar para hacer clic en este botón y validar este texto. Pero a veces esta solicitud puede tardar 15 segundos, 25 segundos o 5 segundos, y cómo podemos esperar a que esta solicitud esté completa para todas estas solicitudes. Dramaturgo proporciona un método especial de peso para el estado de carga Y con la ayuda de este método, podemos realizar tal espera. Así que vamos al código de Visual Studio, y vamos a crear una nueva prueba. Entonces déjame crear un autoawt de red. Eliminemos aquí todo, y copiemos la URL, a la que queremos navegar. Así que vamos a pegar aquí la URL. Y ahora vamos a agarrar el selector de elementos web para este botón. Entonces aquí tenemos un botón. Vamos a agarrarlo paga. Botón, el rol y el nombre. Así que espera página punto obtener por fila. Y la fila, tenemos un botón con el nombre, y este es el nombre. Y ahora queremos dar click en ese botón. Y después de hacer clic, queremos validar que nuestro elemento por texto se mostró. Así que tomemos también el selector CSS para este texto. Entonces aquí está un párrafo con texto, vamos a agarrarlo por texto. Y vamos a crearlo. Vamos a almacenarlo en una constante. Const, página d, texto y vamos página Dod G B tenemos método especial obtener por texto, donde debemos proporcionar el Entonces tenemos nuestro texto, y aquí estamos realizando la acción. Ahora intentemos realizar una espera. Una aserción, no una aserción, donde validaremos que se muestre este elemento por texto Así podemos usar texto de carga de página. Y el método especial para ser visible. Bien. Y por defecto, para ser visible es tomar algo así como 5 segundos. Ahora, tratemos de correr y observar lo que va a pasar. Entonces estamos navegando, estamos pinchando y después de hacer clic, estamos esperando que el elemento sea visible. Y aquí tenemos un error ese tiempo fuera de 500 milisegundos, esperando que el localizador de esperar sea visible Así que solo podemos aumentar el tiempo de espera para ser visibles. Podemos poner algo así como 25 25 segundos. Pero la forma más fácil de hacerlo es esperar a que se complete nuestra solicitud de nuestra red. Entonces para eso, podemos usar un método especial incorporado en dramaturgo Es una página de espera y es esperar al estado de carga. Aquí debemos proporcionar tenemos dom condensado cargado, carga y red kiddo Y aquí tenemos explicación para todo lo que significa. Entonces para red kiddle queremos que todas estas solicitudes se completen durante al menos la mitad del segundo, 500 milisegundos Elijamos Red kiddo. Ahorremos y veamos cómo va a funcionar. Entonces estamos navegando, hicimos clic, y ahora esperar a que L Estado esté esperando está a la espera de que nuestra solicitud esté completa Entonces no lo estamos viendo, pero está esperando la red. Después de 15 segundos, se completaron todas las solicitudes y realizamos la acción que este texto sea visible. Ahora veamos cómo podemos establecer el tiempo de espera para nuestra prueba. Entonces, por defecto, un tiempo de espera de prueba tiene 30 segundos. Pero puedes trabajar con ello. Se puede incrementar a nivel global o en una determinada prueba a nivel local. Entonces veamos cómo podemos cambiar el tiempo de espera para nuestra prueba. Entonces, primero observemos que nuestra prueba está tomando algo así como más de 50 segundos. Pero podemos trabajar con nuestro tiempo fuera. Entonces podemos usar test y el método especial establecer timeout. Y fijemos el tiempo de espera para 5 segundos. Entonces eso significa que nuestra prueba debe pasar o fallar en 5 segundos. Si no, se marcará como fallido. Entonces veamos cómo va a funcionar. Hagamos nuestra prueba. Y aquí tenemos la línea de tiempo y después de 5 segundos, tenemos o test timeout de 5 segundos excedemos Entonces así, podemos aumentar o disminuir el tiempo de espera. Por defecto, son 30 segundos. Además, si desea establecer el tiempo de espera para todas las pruebas, puede cambiar el tiempo de espera desde el archivo de configuración Entonces aquí tenemos la configuración del dramaturgo, y dentro de la configuración definida, puedes agregar un nuevo parámetro como time out. Y digamos que fijemos aquí el tiempo de espera 3 segundos. Bien, y vamos a borrar todo. Vamos a comentarlo. Entonces ahora toda nuestra prueba tendrá el tiempo de espera que configuramos en el archivo de conflicto Deberían ser 3 segundos. Sí, así que el tiempo de espera supera los tres segundos. Aquí desde este archivo de configuración, puede cambiar el tiempo de espera para la prueba enrollable Por defecto, 30, auditemos como 62nd, pero por ahora 30 está bien. Además, si quieres cambiar el tiempo de espera para nuestras acciones, puedes cambiar digamos que para nuestro clic aquí cambiamos el tiempo de espera de 5 segundos o algo así Puedes cambiar el tiempo de espera de todas las acciones. También dentro del archivo de conflicto dentro de este bloque de uso. Entonces para eso, puedes usar espera de acción y puedes establecer tu tiempo de espera, algo así como digamos diez, quieres 10 segundos Puedes configurarlo aquí dentro de este bloque de uso. Y lo último es el peso explícito. Realmente no es recomendable, pero puede ayudarte con los molestos Entonces, eliminemos todos estos tiempos de espera que establecemos. Y veamos cómo funciona esta explícita espera. También eliminemos eso. Y después de navegar, fijemos un tiempo de espera de 5 segundos. Podemos esperar página, esperar, esperar el tiempo de espera. Bien, así que fijemos el tiempo de espera como 3 segundos. Ahorremos y veamos cómo va a funcionar. Entonces ahora aquí solo estamos esperando 3 segundos. Realmente no se recomienda usar en marcos de prueba de palabras reales, pero realmente puede ayudar con los errores. Entonces eso fue para la lección de hoy. Discutimos sobre cómo funciona Auto Avting para nuestros métodos, y también discutimos cómo podemos establecer el tiempo de espera a nivel de prueba y para nuestras acciones Nos vemos en las próximas lecciones. 13. Interacción con campos de entrada: Hola. En esta lección, aprenderemos a interactuar con los campos de entrada. Entonces comencemos con alguna acción que se pueda realizar con entrada. Entonces el primero y el más importante es mecanografiar. Podemos realizar mecanografía. Después de eso, deberíamos poder realizar el clearing para borrar el campo de entrada, y también discutiremos sobre algunas aserciones, cómo podemos afirmar qué valor hay en este campo de entrada Así que vamos al código de Visual Studio. Aquí, voy a crear otra especificación para nuestro archivo. Vamos a llamarlo elementos de interfaz de usuario puntos spec dots. Déjame copiar solo una prueba de aquí. Voy a obtener sólo las entradas. Así que mantengamos solo una prueba y demos el campo de entrada de nombre. Bien. Entonces, para esta lección, usaremos la automatización de pruebas y practiceblospot.com Es gratis, y aquí tenemos muchos elementos web donde puedes practicar escribiendo tu prueba. Entonces vamos a copiar. Vamos a copiar el enlace. Navegaremos hasta eso. Y después de eso, encontremos el selector CSS para este elemento. Así que déjame hacer clic derecho en Inspec y vamos a encontrar. Entonces aquí tenemos, es una entrada con ID y también marcador Vamos a agarrarlo por marcador de posición. Así que déjame guardarlo en entrar N entrada. Es punto de página obtener por marcador de posición y nuestro marcador de posición. Intentemos escribir algo en este campo de entrada. Entonces para eso, vamos a utilizar el campo de método especial. Ya lo usamos en las lecciones anteriores. Entonces comencemos con un nombre de elemento de peso. Entrada de nombre de elemento, y nuestro método especial será agreguemos aquí dramaturgo Así que déjame ahorrar. Abramos nuestro corredor de UI. Para eso, escribamos P prueba de dramaturgo, UI. Entonces tengo dos monitores. Tengo que traerlo aquí. Bien, maximicemos y ejecutemos nuestro campo de entrada de prueba. Bien, entonces aquí observamos que nuestra prueba pasó porque hemos navegado y para esta acción después tenemos aquí el dramaturgo de texto Ahora intentemos extraer el valor de este campo de entrada y hacer una aserción. Entonces para eso, podemos usar el método especial que está extrayendo nos ayudará a extraer el valor de un campo, que es el valor de entrada. Intentemos extraer el valor del nombre del costo, lo almacenaremos en costo y para eso en la entrada de nombre y nuestro método input to value. Sí, este método así que este método está devolviendo una promesa, lo que significa que deberíamos tener aquí un peso. Sí. Entonces ahora extraemos el valor de nuestra entrada de nombre ender y lo guardamos en este valor de nombre. Ahora podemos afirmar que nuestro esperado es igual a nuestro valor de nombre real ser y nuestro texto es dramaturgo Ahora, vamos a ahorrar. Pegar guardar y corramos a ver los resultados. Bien, entonces nuestra prueba pasó, extraemos el valor y afirmamos que el valor del nombre es igual al dramaturgo Hay otro método método donde podemos afirmar directamente Entonces veamos cómo puede verse esto. Entonces para eso, también vamos a usar expect, así que esperamos entrada de nombre ingresado y nuestra aserción para tener valor Y aquí, vamos a pasar nuestro valor mundial. Entonces estamos esperando tener playrate. Entonces, vamos a ahorrar. Vamos a correr. Entonces nuestra aseveración pasó, y también se pasa nuestra prueba El siguiente método es un método claro. Después de pasar algo, también podemos borrar esa entrada. Entonces para eso, tenemos claro el método especial. Entonces usemos esperar, ingrese la entrada de nombre y el método especial claro. Entonces después de despejar, aseveremos que nuestro insumo está vacío Entonces para eso, solo podemos proporcionar para tener valor una cadena vacía, lo que significa que está vacía. Estaba claro. Ahora, ejecutemos y observemos los resultados. Entonces después después de despejar, antes de que fuera dramaturgo, después está vacío y nuestra aseveración pasó. Entonces hagamos un breve resumen de lo que discutiremos hoy. Se discutió el método que se puede realizar con una entrada. El primero está lleno de la ayuda, podemos escribir algo en una entrada. Después de eso, discutimos sobre el valor de entrada, lo que nos ayuda a extraer el valor de una entrada. El siguiente fue la afirmación directa de tener valor. Y el último método fue claro, lo que nos ayuda a despejar un campo de entrada. Entonces nos vemos en la siguiente lección. 14. Interacción con casillas de verificación y botones de radio: Hola. En esta lección, aprenderemos a interactuar con botones de opción y casillas de verificación. Entonces usaremos la misma automatización de pruebas pretest blogspol.com, y vamos a interactuar con este macho o hembra, y también interactuaremos con los días días de la semana Así que ahora vamos a nuestro código de Visual Studio, y vamos a crear otras patadas de prueba Entonces déjame copiar otra prueba. Entonces aquí, vamos a nombrarlo. Botones de radio y casilla de verificación. Bien, entonces aquí nos quedaremos solo esta primera parte con la navegación. Ahora intentemos encontrar el selector CSS para el pod de radio de correo. Así que déjame dar click aquí, y aquí podemos obtenerlo por ID. Tenemos correo de identificación, así que vamos a agarrarlo por AD. Voy a almacenar este elevador en un costo, y llamémoslo opción de correo Vamos a crear localizador de páginas de registro e ID. Así hash e ID mayo. Bien. Ahora para seleccionar esta opción, tenemos el método especial, check. Así que vamos a usarlo. Opción Await Mo verificación de puntos. Bien, ahora vamos a decirlo y vamos a abrir el corredor de UI para ver que también hay. Voy a abrir el corredor UI. Entonces botones de radio y chat box, vamos a correr, y vamos a observar. Entonces estamos navegando y estamos pinchando. Entonces pongamos después. Y observamos que este botón de radio de correo está marcado. Ahora, veamos cómo podemos afirmar cómo podemos comprobar que esta opción estaba seleccionada Entonces para eso, tenemos una aseveración especial. Entonces es simple. Es esperar que nuestra opción de correo, elemento web y la aserción sean verificados Así que vamos a ahorrar y veamos cómo construimos Rock. Entonces esta publicación, comprobamos que comprobamos el correo seleccionado y después de eso, validamos que nuestra opción fue seleccionada. A continuación, intentemos trabajar con estas casillas de verificación. Entonces aquí tenemos muchas casillas de verificación, e intentemos seleccionar de aquí la opción lunes Entonces primero, déjame ir al código de Visual Studio y eliminar todo lo que no necesitamos. Nos quedaremos solo con la G dos. Y ahora busquemos un selector para esta opción de lunes. Entonces aquí tenemos una etiqueta y el lunes. Intentemos agarrarlo por etiqueta. Para eso, tenemos un método especial, y digamos que costó la casilla de verificación del lunes. Y esto es BageG por etiqueta. Es una opción integrada de dramaturgo. Y nuestra etiqueta era el lunes. Bien, entonces ahora tenemos este elemento web. Ahora en redora para comprobarlo, es similar a los botones de radio Un método de espera un lunes y cheque. Ahora bien, la aseveración también es bastante similar. Estamos usando así que una espera, esperar la casilla de verificación del lunes y la aserción que se marquen Bien, así que vamos a ahorrar. Ahora vamos a ejecutarlo. Entonces aquí estamos navegando, estamos comprobando. Podemos observar que tenemos aquí el cheque del lunes, y después de eso, nuestra aseveración, que pasó porque el lunes se comprobó Además, similar a check, tenemos otro método que podemos marcar nuestra casilla de verificación Entonces es solo cheque. Y esta desmarcada, en primer lugar, comprobaremos si esta casilla de verificación está marcada, y después de eso, simplemente realizaremos la verificación hacia abajo. Entonces aquí tenemos una descripción. Y si no se marca nuestra casilla de verificación, no ejecutaría nada Ahora, estamos desmarcados, y vamos a correr primero, y después de eso, vamos a afirmar que la opción estaba Entonces aquí tenemos antes de que se revisara y después se desmarca Entonces, si quieres comprobar que la opción estaba desseleccionada, podemos negar esta Podemos usar para no ser revisados. Así que corramos y observemos si nuestra prueba va a pasar. Entonces como podemos observar después de desmarcar, nuestro esperado no ser verificado, pasó con éxito Entonces hagamos un breve resumen. Aprendimos cómo podemos seleccionar opción desde los botones de opción y desde las casillas de verificación. Además, discutimos cómo podemos afirmar que una determinada opción está activada o deseleccionada Entonces nos vemos en la siguiente lección. 15. Selección de opciones: desplegables y listas: Hola, soy bienvenido de nuevo. En esta lección, vamos a discutir sobre cómo podemos interactuar con determinados tipos de menús desplegables y con simples desplegables Para esta lección, vamos a utilizar esta tierra is.com, selenio playground y llevar demostración de búsqueda desplegable. En primer lugar, queremos seleccionar de este selecto país, digamos que queremos seleccionar Japón. Déjame hacer una actualización y vamos a abrir la inspección. Y aquí podemos observar que nuestro desplegable tiene un atributo select, lo que significa que para los atributos select, podemos usar el método especial incorporado en la opción de selección de dramaturgo Ahora, vamos al código de Visual Studio y déjame copiar crear una prueba, y vamos a nombrarlo. Seleccionar y desplegables. Entonces agreguemos la navegación que navegamos a esta prueba de Lamba. Bien. Y ahora vamos a encontrar el selector para este desplegable o seleccionar desplegable Entonces tenemos un selecto y tenemos país de identificación. Entonces vamos a agarrarlo por AD. Vamos a ahorrar costo seleccionar país. Y vamos a localizador de puntos de página y es el país hash. Bien. Ahora aquí en este selecto, tenemos muchas opciones, y nuestro webpon tiene un valor y el texto en sí, Australia, Bangladesh, Dinamarca, Hong Kong, y así sucesivamente Entonces digamos que queremos seleccionar Japón, éste. Entonces para eso, tenemos un método especial. Entonces usémoslo Esperar, seleccionar país, punto y seleccionar opción. Por lo que este método que podemos recibir de esta documentación puede recibir la opción por etiqueta o por su nombre. Entonces en nuestro caso, aquí, el valor y la etiqueta son idénticos. Entonces intentemos usar la opción select y vamos a darle a Ja Path. Vamos a ahorrar. Déjame dirigir NB, dramaturgo SDY. Déjame minimizarlo porque tengo dos monitores, y quiero tener aquí el corredor. Entonces aquí tenemos al corredor y así algo anda mal, intentemos iniciarlo una vez más. Sí, ahora, todo está bien, así que intentemos correr. Entonces estamos navegando y estamos realizando la acción. Veamos después después de que tengamos aquí, Japón. Entonces seleccionamos la opción en Japón. Y la aseveración es bastante similar a la aseveración que ya usamos es intentemos usar una aserción para Espere país, seleccione país. aserción es tener que tener valor y nuestro valor es Japón Así que corramos una vez más y observemos si nuestra prueba sí pasa. Entonces nuestra prueba pasó porque seleccionamos el Japón. Además, esta opción de selección puede recibir múltiples opciones. En caso de que tengamos una especie de desplegable donde podamos seleccionar dos o más opciones, podemos proporcionar una variedad de opciones. Y dentro de esta matriz, podemos proporcionar Japón o digamos Estados Unidos y así sucesivamente. Podemos ofrecer múltiples opciones. Muchas veces en aplicaciones reales, cuando tenemos un desplegable, no tenemos un atributo select Entonces en caso de que cuando tengamos un atributo select, como teníamos como aquí, es más fácil porque podemos usar el método especial, seleccionar opciones. Pero intentemos seleccionar nuestra opción sin usar las opciones selectas. Así que mantendremos esto navegado y eso es todo lo que queremos evitar de la vieja prueba. La primera acción que queremos realizar es hacer clic en esta para poder abrir todas estas opciones. Así que déjame refrescar y busquemos el selector solo para esta entrada desplegable. Entonces aquí tenemos un lapso con una clase, ¿y qué más? Entonces dentro hay así que vamos a tratar de agarrarlo por esta clase. Bien. Entonces déjame copiar el control F, y agreguemos un punto porque es una clase y tenemos varias clases. Entonces vamos a concatenerlos así que ahora mismo tenemos span, dos Ellos son diferentes. Entonces podemos usar el primer método. ¿Bien? Entonces tenemos dos y nuestro drawdm es el primero Bien, vayamos a un estudio visual llamado y guardemos nuestro selector inter rápido como selección de país y página dotaor vamos a proporcionar nuestro selector de clase, y usemos primero Así que aquí guardaremos nuestro desplegable. Lo siguiente que queremos hacer es encontrar el selector para todos nuestros elementos. Así que vamos a tratar de encontrar. Entonces en nuestro caso, tenemos una lista y nuestra lista tiene una identificación, y es una lista con mucha opción. Entonces intentemos encontrar esto por ID. Entonces aquí tenemos la identificación. Tenemos sólo una lista, y ahora necesitamos aliados todas estas opciones. Entonces podemos usar algo como escribir un aliado y tenemos 11 elementos, que es lo que necesitamos. Necesitamos el selector para todos estos. Ahora, vamos a guardar también este selector en nuestro código estéreo visual. Tener país seleccionado, digamos, opciones de lista porque tenemos aquí todas las opciones y localizador de puntos de página, y agreguemos nuestro localizador. Podemos escribir nuestro localizador así donde la segunda opción. Déjame mostrarte la segunda opción, cómo podemos hacerlo. Podemos usar algo así como un localizador de páginas, y después de eso, podemos concatenar otro localizador y usaremos IA El resultado será el mismo solo que prefiero este porque es un poco más corto. Así que vamos a seguir con la primera opción. Ahora vamos a realizar el click sobre este elemento porque queremos abrir el desplegable. Así que espera país seleccionar punto clip. Bien. Así que después vamos a hacer clic en esto, tener display, hemos mostrado todas estas opciones. Y desde nuestro selector con toda esta opción, queremos filtrar solo las opciones que queramos, y podemos filtrar por texto. Entonces vamos al código de Visual Studio y podemos hacer algo así. Opciones de lista de espera, y podemos usar el filtro de método especial. Y dentro de eso, podemos tiene texto. Entonces de todas estas opciones, queremos filtrar solo la opción Japón. Y para esa opción, queremos realizar un click. Entonces intentemos correr y observar lo que va a pasar. Entonces el problema está aquí es Japna, pero deberíamos tener a Japón Entonces tenemos un tiempo fuera del año porque sí, vamos a tratar de encontrar Japón, no Japna Japón. Ahorremos, y probemos una vez más. Sí, entonces estamos navegando. Sí, pasó una prueba de una hora. A ver. Aquí tenemos a Japón. Seleccionamos la opción correcta, y la aseveración será la misma Así que vamos a realizar un breve resumen. Tenemos dos tipos de selectores. El primero es un selector o un desplegable con atributo select, que se puede seleccionar con la ayuda del método especial, un dramaturgo incorporado, opción select, y el segundo, que puedes encontrarlo mucho en los proyectos reales donde no tienes un tipo de select, pero necesitas de alguna manera encontrar el selector para todas estas opciones Y después de eso, solo realiza un filtro, barra su nombre y realiza un clic. Entonces eso fue para la lección de hoy. Nos vemos en la siguiente. 16. Manejo de alertas y ventanas emergentes del navegador: Hola. En esta lección, discutiremos sobre cómo manejar las alertas del navegador en dramaturgo Por lo que nuestro navegador suele tres tipos de alerta una alerta simple donde puedes simplemente hacer clic en Ok, alerta de confirmación, donde has cancelado o y solicita alerta, donde puedes escribir algo y hacer clic en Cancelar u Bien Entonces, por defecto, el dramaturgo está haciendo clic en Cancelar en todo este tipo de alertas Entonces aquí tenemos la documentación del dramaturgo. Pero puedes crear un oyente para manejar los pop ups de manera diferente Entonces veamos cómo va a funcionar y por qué el dramaturgo solo está haciendo clic en cancelar en todas estas pop ups Cuando haces clic en algo y se muestra un pop up, todo la página se congela y no puedes realizar ninguna acción. Entonces es por eso que el dramaturgo cuando está observando un pop up, está haciendo clic en Bien, palabra desactivada por defecto Ahora, intentemos automatizar cómo podemos trabajar con este tipo de pop ups. Entonces aquí creé un caso de prueba donde estoy navegando a esta práctica de automatización de pruebas de navegador, doblospot.com Entonces intentemos agarrar este sencillo selector web de alertas. Entonces observemos tenemos un botón y podemos agarrarlo por nombre simple alerta. Entonces déjame copiar, y const simple. Entonces usemos solo alerta y es página DGG por rol. El rol es botón, usemos nombre, alerta tan simple. Bien. Por lo que ahora con esta alerta, podemos realizar un click. Entonces déjame poner un peso aquí. Ahorremos y permítanme minimizar en palabra para observar cómo trabajará el dramaturgo con este tipo de alertas Entonces déjame correr una vez. Entonces aquí va a ser muy rápido. Entonces lo observamos muy rápido y dramaturgo hizo clic Bien, por defecto Entonces déjame correr una vez más. Por lo que generalmente con este tipo de alertas, se puede hacer nada porque el dramaturgo dará click por defecto Bien. Pero cuando hayas cancelado o bien, puedes trabajar con ambos de eso. Entonces intentemos automatizar esta confirmación para la alerta de confirmación. Entonces déjame cerrar, y vamos a agarrar el selector para esta alerta de confirmación. Es un botón y podemos agarrarlo por nombre, alerta de confirmación. Así que vamos a cambiar los nombres, y vamos a hacer clic en esta alerta de confirmación. Pero en mi caso, quiero hacer clic en Bien. Entonces para esta alerta de confirmación cuando estoy dando clic en Bien, aquí tengo un texto presionas Bien. Entonces para hacer eso, debemos crear un oyente que escuchará toda la sección que está apareciendo en nuestro navegador Por lo que este tipo de eventos ocurrirá en nuestro navegador, el dramaturgo sabrá manejarlo. Entonces intentemos crear este tipo de oyente. Entonces para esa página puntear y aquí debemos proporcionar sobre qué tipo de evento. Entonces tenemos este evento, que es un diálogo. Y está en una sincronía. Y para este diálogo, digamos lo que queremos hacer. Entonces, para nuestro diálogo, usemos diálogo, punto, y quiero aceptarlo. Entonces ahora después de algo muy importante, deberías agregar este oyente antes de la acción en sí, ya que si pones este oyente después del clic, querrá que funcione Así que vamos a comprobar. Afirmemos este texto. Entonces aquí tenemos una demostración de identificación. Bien, intentemos Vamos a crear este tipo de selector Cs text, y vamos a usar Bige dot Locator, y aquí usaremos has e ID Bien. Entonces después de hacer clic, quiero usar esperar que nuestro texto y aquí deba tener texto. Entonces estamos esperando aquí que nuestro texto sea presionado Bien. Así que vamos a agregarlo aquí mismo. Y como el texto have está devolviendo una promesa, deberíamos agregar un peso. Así que déjame solo guardar estamos haciendo clic y minimizamos, y vamos a ejecutar nuestro texto. Entonces aquí muy rápido aparecerá. Y después de eso, aquí hemos presionado Bien. Y vamos a cerrarlo, así pasó nuestra prueba. Por si acaso, usemos esta señorita. Así que aquí haremos clic en Cancelar. Nuestra prueba debería fallar porque tendremos otro redactor de texto. Así que vamos a correr. Y aquí tenemos prensa Cancelar. Entonces la prueba falló porque te estaba esperando presiona Bien, pero presionaste cancelar. Entonces intentemos trabajar con el último tipo de aseveración. Tenemos una alerta rápida. Entonces en esta alerta rápida, puede hacer clic en una alerta y después de eso, puede agregar una entrada. Entonces digamos que quieres dramaturgo después de hacer clic Bien, aquí tienes Hola, dramaturgo ¿Cómo estás hoy? Así que intentemos encontrar el selector para esta alerta rápida. Entonces también es un botón por nombre prompt alert. Así que aquí, vamos a cambiar el nombre, cambiar el nombre a alerta rápida. Después de eso, tengo el texto, y quiero aceptarlo pero para dar mi nombre. Entonces aquí voy a usar dramaturgo. Bien. Entonces, al usar dramaturgo, veamos qué pasará Voy a poner aquí dramaturgo. Bien. Entonces el mensaje será Hola, dramaturgo Entonces veamos eso. Entonces el mensaje aparece donde tenemos la demo de ID, solo voy a copiar el mensaje. Vamos a pegarlo aquí. Entonces ahora intentemos aceptar que el texto será Hola dramaturgo ¿Cómo estás hoy? Entonces déjame minimizar, ejecutemos el código, y veamos qué va a pasar. Entonces aquí tenemos el texto Hola dramaturgo. Cómo estás hoy y nuestra prueba pasó. Hagamos un breve resumen sobre lo que aprendimos en esta lección. Entonces discutimos sobre el tipo de diálogos, alertas de navegador y cómo manejarlo Entonces, básicamente, tenemos tres tipos, una alerta simple, una alerta de confirmación y una alerta rápida. Y cada uno de estos se puede manejar mediante el uso de un oyente, y después de eso, podemos proporcionar acciones que queramos realizar con esta alerta de navegador Podemos aceptarlos donde podamos hacer clic en Cancelar sobre ellos. Entonces eso fue para la lección de hoy. Nos vemos en la siguiente. 17. Implementa acciones de arrastrar y soltarImplementa acciones de arrastrar y soltar: Bienvenido de nuevo. Y en esta lección, discutiremos cómo realizar y arrastrar y arrastrar la opción. Entonces para eso, el dramaturgo tiene un método especial incorporado. Así que vamos al código de Visual Studio, y vamos a crear una nueva prueba. Entonces déjame nombrarlo. Un arrastrar y dibujar. También utilizaremos este sitio web. Y para eso, necesitaremos el selector para el elemento que queremos arrastrar y el elemento donde queremos dibujar. Entonces déjame usar inspeccionar y veamos qué tenemos aquí. Entonces aquí tenemos un elemento y con ID arrastrable. Entonces vamos a crear este elemento. Vamos a guardarlo en elemento de arrastre const cost. Y localizador de puntos de página, y vamos a utilizar tiene por AD. Y además dejaremos el elemento donde queremos dejar caer nuestro elemento. Entonces aquí tenemos una gota aquí y también tenemos un ocho droppable Bien, vamos a crear también el costo del selector CSS aquí. Así elemento gota. Se llama el localizador de páginas, también tiene y nuestro cator Ahora para poder soltar sobre elemento, podemos hacer un peso nuestro elemento que queremos arrastrar y tenemos un método, arrastre especial dos. Y aquí debemos proporcionar donde queremos dejar caer nuestro elemento. Entonces queremos caer aquí. Ahora, permítanme minimizar y tratemos de correr y observar lo que va a pasar. Por lo que voy a abrir el corredor MVPLaRites UI UI. Y aquí tenemos el drag and drop. Vamos a correr déjame maximizar así que nuestra prueba pasó y después podemos ver que el texto aquí fue cambiado. Entonces intentemos realizar una aseveración para eso. Entonces después de arrastrar o aquí se dejará caer el texto. Entonces copiemos este texto. Vamos al código de Visual Studio. Entonces déjame cerrar esto. Y aquí agreguemos una sesión. Una espera, esperar que nuestro elemento drop y aserción tengan texto, y el texto se caiga Bien. Déjame minimizar. Abrimos una vez más. El corredor de UI. Y vamos a correr a ver qué va a pasar. Así de sencillo es arrastrar y soltar un elemento en dramaturgo usando el comando drag para construir en Entonces nos vemos en la siguiente lección. 18. Practica 1: Hola, y bienvenidos de nuevo. En esta lección vamos a poner en práctica lo que aprendimos. Te paso a paso por el escenario que necesita ser automatizado paso a paso, y después de eso, pausas el video e intentarás implementarlo tú mismo usando dramaturgo Y una vez que hayas terminado, retoma la lección para ver cómo la implementé y compara tus resultados con los míos. Empecemos. Para la práctica, usaremos esta aplicación de demostración de origen y comenzaremos con el inicio de sesión. Así que tendremos que hacer el login usando el usuario estándar. Esta será la primera acción, el login. El segundo, queremos comprobar que el primer elemento tiene el nombre fuente mochila de laboratorio. Entonces el primer producto. A continuación, quiero almacenar en una constante el texto de nuestro último elemento. Entonces, en nuestro caso, deberíamos almacenar este texto en una constante. Después de eso, quiero filtrar para cambiar el filtrado de Z a A. Y después de eso, quiero verificar que el primer elemento, el último elemento es ahora el primero. Entonces quiero convertir el texto que extraemos en el paso anterior para comprobar que ahora estos primeros elementos contienen el texto del último elemento que estaba antes. Después de eso, quiero agregar este primer elemento, como el primer elemento a la tarjeta. Y después de agregar a la tarjeta, quiero comprobar que aquí en el guión tallado he mostrado el número de elementos en nuestro caso, debería ser uno. Entonces este es el primer paso. Ahora, déjame ir al código de Visual Studio. Entonces aquí he agregado todas estas pruebas. Entonces hagámoslo tenemos que iniciar sesión primero el texto para el primer elemento, extraer el texto de este elemento, filtrar Z a A. Comprobar que el último elemento es ahora el primero, agregar el primer elemento a la tarjeta y afirmar shopping carry page Entonces ahora es el momento en el que puedes poner la lección en pausa e intentar implementarla tú mismo. Ahora, déjenme mostrarles cómo lo implementaría. Entonces al principio, necesito importar la prueba de la prueba de dramaturgo Entonces usemos la prueba de importación de, y aquí tenemos prueba de dramaturgo Y después de eso, vamos a crear nuestra primera prueba. Entonces prueba, vamos a darle práctica uno. Es una sincronización y aquí como parámetro, tenemos el accesorio de página. Y dentro, vamos a tener nuestra prueba. Entonces al principio, voy a hacer la página, ir, ir a ir a. Entonces visitaremos. Déjame hacer la demo de origen de logout. Entonces navegando después de eso, necesito los localizadores Entonces déjame correr, abrir el TX, jugar bien, Testuy Entonces te mostraré cómo elegir localizador más rápido. Entonces lo minimizo porque tengo dos monitores. Así que déjame maximizar. Entonces aquí tengo la práctica de uno. Entonces déjame correr, y aquí solo tenemos la navegación, pero quiero mostrarte cómo elegir localizador. Entonces puedes dar click aquí en este localizador de pick, y después de eso, hagamos clic en este nombre de usuario. Y aquí, tendremos t por identificación de prueba. Entonces déjame mostrarte una vez más por qué tenemos. Entonces aquí en este elemento, tenemos y prueba de datos de prueba de datos. Y nosotros en nuestro dramaturgo aquí en carpeta en nuestro archivo de configuración, configuramos ese atributo de ID de prueba para que sea prueba de datos Entonces aquí por defecto, es ID de prueba de datos, pero lo modificamos para que sea solo prueba de datos. Entonces los dramaturgos nos dan los localizadores. Entonces en nuestro caso, podemos simplemente usar algo así como un peso un punto de página de peso, y podemos obtener por prueba ocho. Y aquí podemos usar campo, y podemos pasar el usuario estándar. Así que déjame pasar el usuario estándar, y vamos a comprobar los resultados. Así que vamos a correr. Así que tenemos después de que tenemos aquí usuario estándar. Hagamos lo mismo para el campo de contraseña. Entonces aquí vamos a dar click en la contraseña, aquí tenemos el selector de ID para la contraseña, vamos a copiar y vamos a usar una página de peso que basara lo que copiamos. Y vamos a llenar la contraseña, que es salsa secreta. Bien. Y también vamos a agarrar el selector. Así que vamos a correr. Entonces ahora, así que en adelante, llenamos la contraseña, pero vamos a agarrar el selector para esto Entonces haciendo clic en esto y en el botón, así tenemos que obtener por ID de prueba, botón de inicio de sesión. Entonces déjame copiar, y deshabilitemos eso. Entonces aquí, usemos el punto de página de espera y realizaremos el click. Así que vamos aquí tenemos el inicio de sesión. Déjame ahorrar. Corremos y observemos lo que vamos a tener. Entonces aquí, después de hacer clic, estamos en la página del producto. Ahora el siguiente paso, veamos después del inicio de sesión, debemos comprobar que el primer artículo es SLS mochila izquierda Así que vamos a realizar también aquí, el login, vamos a hacer clic y vamos a tratar de agarrar el primer elemento. Entonces aquí observamos que tenemos un nombre de inventario de clase y datos vamos a agarrar por clase. Y agregarle un.en nuestra clase. Entonces tenemos esta clase para cada nombre. Así que vamos a crear el localizador aquí mismo. Así const nombre del producto. Y aquí hay una página punto por localizador y nuestro localizador. Entonces ahora necesitamos revisar el texto del primer ítem. Así que usemos esperar esperar nombre del producto, y usaremos el primer método porque queremos verificar solo el primero y el método para tener texto y nuestro texto, vamos a agarrar el texto. Entonces es fuente. Ahora, es una mochila. Éste debería serlo. Entonces vamos a copiar Bien. Vamos a guardar y vamos a comprobar el resultado. Entonces nuestra prueba pasando. Bien, la siguiente acción es extraer el texto del primer elemento. Veamos el costo. Texto del último elemento. Entonces aquí podemos usar algo así como nombre del producto ausente y usar el último porque queremos el último. Y en palabra el texto rastrea el texto, podemos usar el método text Conte que ****** prometerá con la Entonces aquí tenemos el texto para el último elemento. Ahora queremos filtrar por Z a A. Así que para eso, intentemos inspeccionar lo que tenemos aquí. Déjame borrar esta clase. Entonces aquí tenemos un tipo selecto, y dentro, tenemos toda esta opción, lo que significa que si tenemos un select, podemos usar la opción select del método especial. Entonces vamos a agarrarlo digamos que tenemos prueba de datos. Vamos a agarrar por identificación de prueba de datos. Entonces déjame copiar. Y vamos a crear const y filtro desplegable desplegable, página G prueba ID Y aquí tenemos nuestro ID de prueba. Ahora para seleccionar, podemos usar el método especial de este filtro de selección. Entonces selecciona la opción, y queremos esta de Zwa. Entonces voy a copiar. Vamos a pegarlo aquí. Bien. Entonces déjame guardar y corramos a observar si todo va a ser filtrado. Por lo que aquí podemos observar que la última camiseta ahora es el primer inicio. Bien. Entonces después de filtrar, después de filtrar, necesitamos verificar que el último elemento sea ahora el primero. Entonces ahora agreguemos una aserción, aguarden, esperen. Entonces aquí tenemos el nombre del producto, el primero. Y queremos tener Para tener texto, y el texto debe ser el último elemento texto que extraemos en la tercera dicción. Entonces tener texto, último elemento. Y, necesitamos a la señal si nuestro reactor es nulo o cadena. Bien, entonces tenemos la aseveración. Y el último paso no fue el primer elemento a la tarjeta y aseverar soltar carbae tiene el número de Bien. Entonces ahora intentemos agarrar la prueba de datos para el add to card. Aquí, es un botón y podemos agregarlo por texto. Bien. Entonces intentemos agregar una página de peso que obtenemos por rollo y el rol es botón con el nombre agregar a la tarjeta. Y queremos el primero. Entonces el primero y vamos a realizar la acción click. Entonces, vamos a ahorrar. Corremos y veamos los resultados. Entonces después de que tenemos aquí, agregamos el primero. Ahora el último paso es asset shopping car page tiene el número de elementos. Bien, entonces para eso, vamos a ver. Aquí tenemos un hilado con una clase y datos así que vamos a agarrarlo por clase. Vamos a copiar y vamos a comprobar en el punto. Aquí está uno de uno. Eso es lo que necesitamos. Y vamos a realizar la última aseveración. Esperar, esperar localizador de puntos de página. Nuestro localizador es por clase, y tener que tener texto y uno porque agregamos solo un elemento. Bien, así que corramos la última vez y veamos si nuestra prueba va a pasar. Entonces nuestra prueba pasó y hemos agregado un elemento. Ahora, hagamos un breve resumen. Así que aquí realizamos el login. Después de eso, creamos el localizador para el nombre del producto. Aafirmamos que tenemos el primer elemento fuente Lab Bec tech, extrajo el texto del último elemento con la ayuda del contenido del texto Después de eso, creamos el localizador para el desplegable desplegable select Seleccionamos la opción de filtro llamada Z a A. Aafirmamos que el primer elemento se convirtió en el último elemento después del filtrado y pulsamos en la tarjeta Oddo y después de eso, aseveramos que la página de la tarjeta Ahora puedes comparar mi resultado, mi implementación con tu implementación. Espero que te haya gustado. Nos vemos en la siguiente lección. 19. Práctica 2: Hola, y bienvenidos a la Lección dos de nuestra práctica. Entonces te voy a mostrar paso a paso lo que necesitamos para automatizar. Después de eso, pondrás el video, la lección compondrá y tratarás de implementarlo tú mismo. Y después de implementarlo, continúe la lección y compare nuestro enfoque para la implementación. Entonces primero, tendremos que hacer el inicio de sesión con el usuario estándar y el secreto Ssci Después de eso, hará el login. Obtendremos el nombre, extraeremos el nombre en un costo del primer elemento. Vamos a añadir el primer elemento a la tarjeta, sólo éste. Después de eso, iremos a nuestra tarjeta. Entonces déjame quitarle esta. Iremos a nuestra tarjeta y después de navegar a la tarjeta, debemos afirmar que este artículo fue agregado a nuestra tarjeta Entonces este es nuestro sencillo escenario. Ahora, permítanme agregar todos estos pasos a visual al cd. Aquí tenemos los pasos que queremos automatizar. Ahora puedes poner la lección en pausa e intentar implementarse por sí misma. Empecemos a implementar. Vamos a crear una prueba, darle un nombre a la práctica dos. Y aquí tenemos una sincronización, que recibirá el accesorio de página y nuestra implementación. Entonces al principio, tenemos que ir también y estamos usando también la salsa. Déjame hacer la salida. Vamos a copiar. Entonces estamos navegando. Después de eso, tenemos el inicio de sesión. Por lo que voy a copiar el inicio de sesión del primer ejercicio. Entonces básicamente, aquí tenemos la entrada para el nombre de usuario, la contraseña y haciendo clic en el botón de inicio de sesión. Y después de eso, queremos extraer después de iniciar sesión. Queremos extraer el texto de este primer elemento. Entonces vamos a comprobar lo que tenemos aquí. Entonces aquí podemos tomar una prueba de datos trabajo por clase. Así que vamos a agarrarlo por clase. A ver si es uno tenemos seis, necesitamos ya el primero. Déjame copiarlo. Y vamos a crear una página de texto de primer elemento de costo localizador Dodd, nuestro localizador, que es una clase Y aquí queremos agarrar el primero, y para extraer el texto, shuc text content Y este método extraerá la t de nuestro elemento. Entonces el siguiente, queremos agregarle este elemento a la tarjeta. Así que vamos a agarrar. Veamos qué tenemos para este botón. Así podemos agarrarlo agregándolo a la tarjeta Um, vamos a esperar página punto G por Rf. Tenemos un botón. Botón con el nombre en la tarjeta, necesitamos el primero. Tenemos que dar click en el primero. Después de agregar a la tarjeta, debemos navegar a esta tarjeta. Vamos a agarrar el selector. Aquí tenemos escritorio de datos y también tenemos una clase. Vamos a agarrarlo también por clase. Vamos a copiar y vamos a esperar localizador de puntos de página y vamos a realizar un clic. Entonces déjame minimizar y abrir el corredor de Cypress por NP, prueba de dramaturgo, UI Bien, vamos a ejecutar el segundo. Practica dos. Entonces aquí tenemos un aquí. Espere hasta que se cargue. Entonces veamos dónde está el error. Entonces aquí debemos agregar una espera porque ir a devuelve una promesa. Sí, vamos a añadir un peso, y vamos a correr una vez más. Entonces la prueba se está ejecutando, y terminamos en el carrito de compras. Entonces déjame hacer lo mismo aquí, dando clic en el carrito de compras. Y veamos podemos afirmar por texto porque extraemos Aquí extraemos el texto y podemos agarrar el elemento por texto Entonces creo una aseveración, una espera, una espera y una edad que consiguen por mensaje de texto Y voy a proporcionar esta prueba extraída. Entonces obtenemos por texto también. Y vamos a usar queremos ser visibles. Entonces aquí tenemos el año porque contenido de texto está devolviendo una promesa, y aquí necesitamos agregar un peso. Entonces ahora todo está claro. Vamos a ahorrar, y vayamos a nuestro corredor y verifiquemos. Así que déjame correr. Sí, así que nuestra prueba pasó, comprobamos que este texto sea visible. Entonces hagamos un resumen. Entonces hicimos la parte de inicio de sesión. Después de navegar, luego extraemos el texto con la ayuda del contenido del texto. Después de eso, hicimos clic en el primer botón agregar a la tarjeta, hicimos clic en el enlace del carrito de compras Y al final, afirmamos que nuestro elemento se agregó a la tarjeta Así que espero que hayan disfrutado de esta lección. Nos vemos en la siguiente. 20. Refactorización y mejoras: Hola, y bienvenidos de nuevo. En esta lección, quiero hacer un poco de refactorización de nuestras dos pruebas de práctica Entonces lo primero que quiero hacer, quiero extraer las acciones que tenemos en común. Nuestra primera acción es la parte de inicio de sesión y la parte de navegación. Quiero extraerlo en un antes de cada gancho. Entonces para hacer eso, debemos crear un antes de cada gancho. Vamos a usar test y tenemos antes de cada uno. Y también es fregadero, que recibirá un accesorio de página. Y dentro de eso, tenemos el cuerpo de nuestro gancho. Entonces aquí quiero agregar solo ve a y la parte de inicio de sesión. Entonces déjame copiar eso, y publiquémoslo aquí. Y ahora podemos eliminar este login de nuestra prueba. Déjame borrarlos a los dos Bien. Entonces ahora nuestras pruebas se ven un poco más claras porque solo eliminamos la parte de registro. Entonces intentemos ejecutar la prueba y ver si están pasando. Así que corre el primero, tenemos un gancho antes, así que la prueba pasó, y vamos a tratar de correr el segundo antes de gancho. Entonces fuera de las pruebas están pasando con el antes de cada gancho. La segunda mejora que quiero implementar aquí es qué paso de prueba para que nuestras acciones sean más claras y más legibles para todos. Entonces intentemos agregar un paso más antes de cada gancho. Así que esperamos el paso del punto de prueba, entonces podemos darle un nombre a nuestro paso. El primero, vamos a navegar a nuestro sitio web. Bien, entonces aquí también es una sincronización y además, podemos proporcionar el cuerpo de nuestro paso. Entonces déjame cortar esto. Entonces aquí tenemos un paso donde navegaremos a nuestro sitio web. Así que vamos a fuente sitio web de demostración. Ahora podemos crear algo, otro paso para el inicio de sesión. Entonces podemos decir algo como iniciar sesión. Iniciar sesión con usuario estándar. Y aquí no podemos estos pasos del login. Entonces, permítanme eliminar este comentario. Bien, entonces ahora tenemos antes de cada dos pasos. El primero es navegar al sitio web de demostración de origen e iniciar sesión con el usuario estándar. Permítanme implementar los pasos para nuestra prueba, y comparemos cómo se verá la prueba y qué tan claros serán, tan fácil sería entender lo que tenemos en nuestras pruebas. Agregué los pasos para nuestra prueba. Entonces aquí tenemos todos estos pasos, verificar que el nombre del primer producto sea correcto. Por lo que los productos agregan primer producto a la tarjeta para verificar el conteo de tarjetas, y también lo mismo con la segunda prueba. Agregamos y navegamos hasta el carrito de compras y verificamos el nombre del producto. Ahora intentemos ejecutar la primera prueba. Y aquí hemos mostrado todos estos pasos. Y ahora, si un paso fallará, puedes verificar el fallido, y es más fácil verificar cuál es la causa raíz de una falla. Entonces vamos a correr el segundo y también aquí tenemos los ganchos antes. Y aquí tenemos todos estos pasos, y también tenemos pasos dentro del primer producto de captura, y después de ganchos, no tenemos nada. Entonces vamos a resumir lo refractario que hicimos. Entonces, la primera implementación fue extraer las acciones que están en común. Entonces extraemos la parte de navegación y la parte de registro antes de cada gancho. Después de eso, agregamos pasos de prueba con nombres, lo que nos está ayudando a que nuestra prueba sea más clara y más fácil de entender y a hacer modificaciones en el futuro. Así que espero que lo hayan disfrutado. Nos vemos en la siguiente lección. 21. Configuración del framework y creación del objeto de página de inicio de sesión: Bienvenido a este capítulo donde construiremos un marco de automatización de pruebas usando dramaturgo y el modelo Bij Object Al final de este capítulo, tendrás un marco escalable estructurado que podrás usar para pruebas de palabras reales. Entonces, ¿por qué necesitamos un framework? Imagínese escribir todos sus casos de prueba en un solo archivo. Se vuelve desordenado, difícil de mantener y propenso a errores Ahí es donde entra en juego la palabra modelo de objeto de página pom. modelo de objetos de página nos ayuda a separar la lógica de interactuar con UY de los casos de prueba reales, haciendo que nuestra prueba sea más legible y mantenible Aquí hay una descripción general rápida de lo que vamos a construir. Comenzaremos configurando el proyecto, luego crearemos Objetos Biji, definiremos localizadores y acciones, definiremos localizadores y acciones, los integraremos con accesorios de dramaturgo y finalmente escribiremos y ejecutaremos Así que comencemos. Aquí he abierto una carpeta vacía marco dramaturgo en código de Visual Studio, y vamos a instalar dramaturgo Para eso, abramos el menú de la terminal desde la nueva terminal. Y aquí deberíamos escribir NPM en él play writ, y usemos latest Ahora aquí se nos pregunta. Usaremos todo por defecto. Javascript de Discript realmente no importa. Usaremos Typescript porque dramaturgo fue diseñado inicialmente para el Discript y todo lo demás quedará como predeterminado Ahora, esperemos. Después de instalar todo, tenemos esta estructura de prueba. Entonces ejemplo de texto, podemos eliminar porque no lo necesitamos y también podemos eliminar lo que tenemos dentro de estas pruebas. Entonces en esta carpeta de prueba, vamos a mantener nuestra prueba. Ahora vamos a crear otra carpeta donde guardaremos nuestro objeto de página. Así que vamos a llamarlo páginas. Y también, podemos crear una carpeta donde guardaremos nuestros accesorios, donde nuestras utilidades. Así que déjame crear otra carpeta, y vamos a llamarlo algo así como accesorios. Bien. Que tenemos nuestra estructura de proyecto, hablemos de objetos de página. Un objeto de página es una clase que representa nuestra página web. En lugar de escribir localizadores e interacciones directamente en prueba, los definimos en clases separadas para que nuestro código sea más reutilizable y mantenible Entonces comencemos con la creación de la primera página. Entonces vamos a usar esta aplicación web wag y la primera página que vamos a automatizar es la página de inicio de sesión Entonces dentro de la carpeta de estas páginas, vamos a crear un nuevo archivo y vamos a nombrarlo página de inicio de sesión y no esta la extensión de TIScript Y aquí comencemos creando una clase, una clase exportación, y vamos a nombrarla página de inicio de sesión. A continuación, necesitamos sumar nuestras variables que vamos a utilizar. Así que permítanme crear una variable privada para nuestro accesorio de página. Entonces página privada y también usaremos la mecanografía. Tendremos una página. Entonces es página y vamos a importar esta página. Entonces agreguemos una importación. Importar. Y usemos una página de y aquí deberíamos tener dramaturgo Sí. Entonces aquí tenemos dramaturgo Tendremos una variable para la página. También desde esta página, necesitamos una variable para este nombre de usuario, entrada, entrada de contraseña, y para la parte inferior de inicio de sesión. Entonces vamos a agregarlos Nuestros campos son privados, lo que significa que necesitan ser instanciados dentro de esta clase Así que vamos a crear un constructor para esta clase. Donde instanciamos nuestros campos. Constructor, y nuestro constructor recibirá nuestro accesorio de página. Y dentro, tendremos esta página. Ir a la página. Instanciaremos esta página Y también, debemos instanciar todos estos nuestros campos. Así que este campo de nombre de usuario igual página localizador de puntos, y aquí debemos proporcionar nuestro localizador. Entonces, busquemos el localizador para esto. Entonces aquí tenemos prueba de datos y tenemos ID. Entonces vamos a agarrarlo por AD. Así que agreguemos hash y este ID. Además, instanciemos este campo de contraseña. Ahora donde crearemos un objeto de esta clase, habremos instanciado junto con esta clase, tendremos la página y todos estos Pero ahora es el momento de agregar métodos o acciones que se puedan realizar con estos localizadores Tenemos dos métodos para escribir para el campo de nombre de usuario para la contraseña, y una acción para hacer clic en el botón de inicio de sesión. Entonces déjame crear la primera acción para ingresar el nombre de usuario. Entonces tenemos una sincronización y vamos a nombrarla Ingresa nombre de usuario. Y nuestro método recibirá un nombre de usuario. Vamos a agregar un tipo de cadena. Bien. Y dentro de este método, realizamos un peso este nombre de usuario campo dot fill y nuestro nombre de usuario. Entonces déjame hacer rápidamente el mismo método para la contraseña. Aquí he creado otro método para ingresar la contraseña y otro método para hacer clic en el botón Iniciar sesión. Y ahora en nuestro caso, podemos combinar todos estos tres métodos en un solo método, que se llamará Login. Así podremos crear algo así, una sincronización, un inicio de sesión, y nuestro método recibirá nombre de usuario y contraseña. Así nombre de usuario como contraseña de cadena. También como cadena, y por dentro, vamos a usar nuestros métodos creados. Así que espera este nombre de usuario do Yenter, y recibimos un nombre de usuario Y también lo mismo con Enter password, recibimos nuestra contraseña y la última está dando clic. Entonces esto, da clic en el botón de inicio de sesión. Ahora, vamos a crear una prueba, una prueba de inicio de sesión usando esta clase de objeto de página. Entonces, dentro de esta prueba, vamos a crear un nuevo archivo, y llamémoslo pruebas de inicio de sesión dotspcdtts y usemos Import Necesitamos importar la prueba del dramaturgo. Entonces aquí el primero es dramaturgo. Y vamos a crear nuestra prueba. Así que vamos a crear la prueba, nombra inicio de sesión exitoso. Entonces es un sumidero y recibimos el accesorio de página como parámetro. Y aquí tenemos el cuerpo. Entonces aquí hay un fregadero. Entonces aquí tenemos el cuerpo. Entonces primero, vamos a crear una const e instanciar nuestra Entonces nuestra clase es exportada. Así podemos crear const login page igual nueva página de inicio de sesión. Así que aquí tenemos nuestro constructor está recibiendo una página de tipo página del dramaturgo, por lo que debemos proporcionar nuestro accesorio de página Así que ahora tenemos todos nuestros métodos disponibles desde esta página de inicio de sesión. Además, podemos crear aquí un método para visitar la página de inicio de sesión de demostración de origen. Entonces déjame crearlo. Hagamos una sincronización visita la página de inicio de sesión. Y tenemos a la espera de esta.page.g2, y sabemos que nuestra demo SOS, URL será Entonces déjenme decir. Y ahora también podemos hacer la visita desde esta página de inicio de sesión contras. Así que tenemos la página de inicio de sesión punto, y tenemos Visitar la página de inicio de sesión. Ahora el siguiente paso después de visitar, caso de que podamos hacer para hacer el login. Así podemos hacer word login page dot ender username. Déjame tratar de hacer el primero así, usuario estándar. Iniciar sesión Página de inicio de sesión, contraseña. Entonces la salsa secreta de contraseña, y después de eso, tenemos que hacer clic en la página de inicio de sesión, y hagamos clic en Patrón de inicio de sesión. Entonces intentemos refrescarnos así que déjame abrir el corredor dramaturgo Así que NP juega bien invitado. Ahí está Y. Déjame minimizar porque tengo que monitores, haga clic en Entrar, y esperemos. Entonces aquí tenemos a nuestro corredor y vamos a ejecutar este primer login exitoso, y vamos a observar. Entonces aquí tenemos un error. Sí, así que no tenemos una espera antes eso porque déjame agregar un peso aquí. Así que intentemos ahora mismo. Por lo que podemos observar que realizamos el login y después terminamos en esta página de productos. Además, podemos realizar el inicio de sesión utilizando este método de inicio de sesión. Así podemos usar wait login page dot, y tenemos el método de inicio de sesión, que es recibir al usuario estándar como nombre de usuario y la contraseña como fuente secreta. Entonces déjame comentar este y agregar aquí y una espera. Bien, así que vamos a esforzarnos por ejecutar esto. Entonces nuestra prueba pasó, y terminamos en esta página del producto. También una pequeña mejora, que podemos hacer es agregar el tipo de retorno de nuestro método. Entonces agreguemos una promesa de peso peso. Y si agregamos este peso de promesa, sabremos que cuando nuestro método esté devolviendo una promesa, entonces deberíamos usar un peso. Entonces eso fue para la lección de hoy. Creamos un simple objeto de página, página, instanciamos todos nuestros objetos y usamos esta página para crear una prueba de registro simple y exitosa Entonces nos vemos en la siguiente lección. 22. Crear el modelo de objetos de la página de productos: Hola. En esta lección, seguiremos construyendo nuestro marco. Para ser más específicos, agregaremos objeto de segunda página para la página de productos. Entonces queremos agregar algunas pruebas para esta página del producto donde estamos terminando después de hacer el Logie Así que comencemos por crear otra clase de página de producto. Así que déjame nuevo archivo y vamos a llamarlo productos página punto gs. Y aquí dentro, vamos a crear nuestros productos de clase de exportación de clase, página de productos. Y comencemos sumando nuestro campo. Entonces necesitamos una página de tipo página, y vamos a importarla de dramaturgo, importar Page y aquí tenemos el primero, dramaturgo. Además, echemos un vistazo qué más necesitamos. Entonces necesitaremos localizador para este campo. Entonces, hagamos una inspección. Tenemos título, así que vamos a nombrarlo título de página privada. Vamos a hacer un localizador de aserciones. También es localizador de dramaturgo. Agreguemos ce a la Importación. A continuación, agreguemos esto al botón de la tarjeta. Una mochila a la tarjeta. Así que vamos a agregarlo privado. Y agreguemos también este carrito de compras bage después de hacer clic. Así que vamos a nombrarlo. Privado Siguiente, deberíamos crear el constructor con la ayuda del cual instanciamos nuestra clase como lo hicimos aquí en nuestra página de inicio de sesión Así que vamos a crear nuestro constructor. Sotrctor recibirá nuestro accesorio de página como parámetro. Y dentro, instanciemos nuestra página para que sea igual a la página que recibimos Y permítanme agregar localizadores para todos estos campos. Entonces aquí agregué todos estos localizadores para todos nuestros elementos, y el siguiente paso es crear acciones que vamos a realizar con este elemento Entonces, para el título de la página, necesitaremos el texto. Queremos extraer el texto de este localizador. Entonces déjame crear una acción que obtendrá el texto del título de la página. Así que también agreguemos un tipo de retorno a nuestro método. Entonces queremos devolver una promesa de cadena. Entonces queremos el texto, que será una cadena. Ahora dentro de eso vamos a crear un texto const title. Y vamos a asignar esto lejos este título de página y el contenido de texto de método especial, que están devolviendo una promesa de cadena o nulo. Entonces, devolvamos este texto del título, y puede ser un nulo. Entonces agreguemos ese letrero. Entonces aquí creamos el texto del título de la página. Además, así, deberíamos crear get shopping cart page text. Simplemente voy a copiarlo y vamos a simplemente renombrar Así que aquí hemos agregado método que devolverá el texto. Y también, necesitamos crear un método para dar clic en este botón Agregar al carrito. Así que haz clic en Agregar para tallar botón atrás. Así que vamos a devolver también una promesa de void solo para saber que necesitamos agregar esperar antes de usar este método. Así que espera este botón de agregar a carbac, así que haz clic. Entonces retomemos lo que tenemos. Creamos todos estos localizadores, todas estas variables. Después de eso, los instanciamos en esta construcción y creamos los métodos con la ayuda de ellos realizamos acciones con estos elementos porque aquí son privados Así que ahora es el momento de crear la segunda página de productos test spec. Así que vamos a crear un nuevo archivo, y llamémoslo prueba de producto punto spec punto ds. Y déjame copiar esta prueba porque vamos a necesitar esto, y cambiemos el nombre de nuestra prueba a algo como agregar a la tarjeta y además recibiremos aquí una página. Y para el inicio, necesitamos realizar el login. Entonces copiamos el inicio de sesión de esto de la prueba de inicio de sesión. Pero después de realizar el inicio de sesión, necesitamos verificar que terminamos en la página del producto. Entonces aquí quiero afirmar que después de hacer el Login, hemos mostrado este product text title Así que déjame crear el segundo costo con nuestra página de productos. Así const página de productos, igual nueva vamos a usar la página de productos, y también estamos recibiendo un accesorio de página Ahora bien, si usamos esta página de producto costo, tendremos todos nuestros métodos. Entonces comencemos haciendo una aseveración de que tenemos el texto de los productos Entonces usemos expect y inside, tendremos la página de productos fuera que creamos, y aquí tenemos Obtener el texto del título de la página, nuestro método, y usemos nuestra afirmación B, vamos a hacer a B, esperar. Entonces también tenemos que importar esta expectativa del dramaturgo Bien. Entonces ahora usemos dos B y el producto de texto. Bien, entonces déjame guardar y vamos a abrir la nueva terminal, y vamos a abrir así que déjame despejar y dejar clavijas jueguen escribir, pruebas, ¿y tú qué? Entonces déjame minimizar vamos a ejecutar esto. Entonces aquí tenemos el segundo archivo de especificaciones. Vamos a ejecutarlo, y vamos a observar lo que tenemos. Entonces aquí tenemos el cheque de que terminamos en esta página de producto con el título productos. Lo siguiente que queremos hacer es hacer clic en este botón de tarjeta automática. Entonces para eso, simplemente podemos hacer esperar la página de productos, y tenemos nuestro método. Haga clic en el botón de mochila AutoCard. Después de hacer clic, debemos hacer una afirmación de que nuestra página de tarjeta se convirtió en una tiene el valor de una Entonces podemos usar esperar y aquí nuestra página de productos de peso, tenemos el método, el texto de la página de la tarjeta de página, aseveremos ser uno a B, y tenemos el valor de uno Así que déjame guardar y volvamos a ejecutar una prueba de tiempo más. Entonces nuestra prueba pasó porque aquí el valor es uno. En este ejemplo de prueba de productos, podemos ver los beneficios de tener los objetos de página porque aquí reutilizamos la página de inicio de sesión que creamos en la lección anterior, y aquí simplemente reutilizamos todos estos métodos y todos estos parámetros. Así que espero que lo hayan disfrutado. Nos vemos en la siguiente. 23. Agregar el Fijo de inicio de sesión para la autenticación: En esta lección, mejoraremos nuestro marco de dramaturgo agregando la funcionalidad de inicio de sesión como accesorio Esto nos permitirá reutilizar la funcionalidad de inicio de sesión en múltiples pruebas sin repetir el proceso de inicio de sesión en cada prueba. Piense en un accesorio como una configuración reutilizable para nuestra prueba. Entonces en nuestro caso, para poder escribir prueba, necesitamos realizar el login. Entonces nuestra configuración es el inicio de sesión. Vamos a crear un accesorio para ayudarnos con la funcionalidad de inicio de sesión. Así que aquí dentro de los accesorios, carpeta, déjame agregar un nuevo archivo, y llamémoslo accesorios punto s. Entonces la sintaxis para un accesorio es simple. Lo tenemos descrito. Entonces aquí tenemos creando un fixture, y tomé la sintaxis de esta documentación de dramaturgo Primero, necesitamos importar la prueba y una prueba base del dramaturgo Lo siguiente es, vamos a exportar esta nueva prueba de costos, que es igual a prueba base y se extiende. Entonces aquí debemos agregar nuestro nuevo método. Así que vamos a llamarlo página autenticada, y es una página de inicio de sesión Ahora, permítanme importar también esta página de inicio de sesión, y aquí se importó. Lo siguiente que queremos hacer es crear esta página autenticada Así que vamos a crear esta configuración. Entonces es una función de sincronización que tendrá como parámetro, el accesorio de página. Y aquí hemos usado parámetro, que nos mostrará lo que queremos devolver después de usar este fixture. Así que permítanme comenzar creando esta página de inicio de sesión, igual nueva página de inicio de sesión para tener acceso a todo esto. Y aquí, permítanme realizar el registro que he agregado todos estos pasos para realizar login, visitar y rellenar toda la contraseña y nombre de usuario y hacer clic. Y después de eso, deberíamos usar esta opción que nos mostrará qué devolver. Así que estamos devolviendo una página de inicio de sesión con la autentificación de la página de inicio de sesión Ahora intentemos implementar y usar este accesorio de página de autenticación en nuestra prueba Entonces aquí estamos realizando el inicio de sesión antes de hacer clic en este botón Auto car. Entonces déjame copiar todo lo que esté relacionado con el inicio de sesión, e intentemos usar nuestro fixture. Necesitamos importar nuestros contras de prueba que se extendieron aquí mismo. Así que permítanme tratar de importar prueba de prueba de. Y vamos a demostrar que tenemos nuestros accesorios y accesorios. Ahora podemos eliminar esta prueba del dramaturgo porque extendimos la prueba desde aquí, extendiendo la prueba de prueba como prueba base desde el dramaturgo Y ahora, junto con este fixture, podemos usar nuestra página autiicada de sesgo creada Entonces déjame copiar esto. Podemos agregarlo aquí. Y en caso de que sepamos que debemos hacer el login antes de hacer la aserción o hacer clic en el botón de la mochila, déjame borrar esto Y aquí solo podemos agregar esta página autenticada. Entonces déjame correr las fotos escribiendo Y para mostrarte cómo va a funcionar esto. Así que aquí, déjame ejecutarlo. Y vamos a extender. Entonces observamos que aquí ejecutamos la página autenticada del fixture Y aquí realizamos todas estas acciones para el login. Y por si acaso, permítanme maximizar, tendremos muchas pruebas para la página del producto. Ese es un escenario muy posible, y necesitaremos realizar el inicio de sesión. Para todas estas pruebas, se verá muy desordenado. Pero con la ayuda de este fixture, donde estamos realizando el login, se ve muy claro y es más fácil de entender. Y también, aquí podemos agregar muchos otros accesorios si así lo necesitamos. También en caso de que tengamos muchas pruebas, podemos agregar este accesorio con el inicio de sesión antes cada prueba de sierra de gancho antes de cada una. Y aquí tenemos una función de sincronización como parámetro, recibimos página autenticada Así que déjeme pasarlo aquí. Y en el cuerpo solo estará esta página auenticada. Ahora podemos eliminar esto de todas estas pruebas Así que observamos que toda nuestra prueba pasó porque el login se ejecutó aquí desde el fixture en el antes de cada gancho. Los accesorios son extremadamente útiles para usar cuando necesitamos hacer una configuración para una determinada prueba Entonces, en nuestro caso, utilizamos este accesorio para configurar la funcionalidad de inicio de sesión. Espero que lo hayan disfrutado. Nos vemos en la siguiente. 24. Recapitulación del marco: Bienvenida de nuevo. Ahora construimos un marco estructurado de dramaturgo, tomemos un momento para revisar lo que implementamos y por qué es importante Este enfoque no se trata solo de escribir pruebas, se trata de crear un conjunto de automatización mantenible y escalable Así que agregamos dos archivos de objetos de página donde podemos guardar localizadores y acciones que se pueden realizar con ellos. Entonces en nuestro caso, tenemos la página de inicio de sesión y la página de productos. En cada una de estas clases, declaramos las variables privadas para nuestros localizadores Los instanciamos, y después de eso, creamos métodos donde se pueden realizar acciones que se pueden realizar con estos elementos web Lo mismo se agregó aquí para la página del producto. También para cada funcionalidad, o página web, creamos archivos de prueba separados. Usando este enfoque, nuestro marco se volvió modular, legible y más fácil de escalar. Entonces en nuestro ejemplo, tenemos la prueba de inicio de sesión, y aquí podemos agregar solo pruebas que estén relacionadas con el inicio de sesión. Podemos agregar un inicio de sesión exitoso o iniciar sesión con credenciales incorrectas y así sucesivamente. Y lo mismo, es con esta prueba de productos. Aquí, podemos agregar solo pruebas que estén relacionadas con la página del producto. Y al final, agregamos un accesorio aquí en nuestra carpeta de accesorios que funciona como configuración para nuestra prueba, haciendo el inicio de sesión como antes de cada gancho, pero en una forma más corta. Si esta estructura está en su lugar, ahora puede extender su marco agregando más páginas, utilidades y escenarios de prueba. Por ejemplo, usamos demostración de Souls y aquí puedes intentar agregar un objeto de página más para la página de la tarjeta e implementar algunas pruebas nuevas aquí también en un archivo para página de tarjeta en la prueba de página CRP, puedes usar la parte de inicio de sesión, la parte de productos, y los nuevos pasos para trabajar con la página de tarjeta Espero que hayas disfrutado de la lección, nos vemos en la siguiente.