Creación de Tests Automatizados con Playwright en Visual Studio Code
Clase 3 de 17 • Curso de Automatización de Test con Playwright
Contenido del curso
Clase 3 de 17 • Curso de Automatización de Test con Playwright
Contenido del curso
Harold Pineda
Jorge Emilio Granados Guzmán
Alfredo Duran
Emmanuel Rodríguez
Jorge Emilio Granados Guzmán
Gabriel Cayoja
OMAR CESAR MAMANI HUAMANI
ariana.mendez
Diana María Rúa Herrera
Miguel Angel Martheyn Berbesi
Miguel Angel Martheyn Berbesi
Mario Alexander Vargas Celis
Carlos Guerra
JOHNATHAN ANDRES VELEZ HERNANDEZ
Geovanni Atavales Quiroga
Ing. Franklin Erick Rojas Romero
ariana.mendez
ariana.mendez
1° Felicitar a la profesora Lupe por que se toma el tiempo para hablar y explicar de una forma muy claro. Me encanta su pausa al hablar 2° Playwright que nota. Llevo muchos dias batallando con un proyecto que tiene Test con Enzyme, Testing Library. y existen unos componentes que se vuelven muy dificiles de probar. Y que esta herramienta te ayude a escribir los test realmente te resulve muchos problemas al momento de desarrollar.
IGUAL
Hola, hay webs como codepen.io en la actualidad que poseen bloqueador de cloudflare intentando saber si soy un humano y no puedo continuar con las pruebas, en el momento que deba probar en una empresa debo contactar a alguien del equipo de desarrollo que deshabilite estos controles?
Generación de Pruebas
📌 Referencia Test Generator | Playwright
. Con Playwright, es posible generar pruebas de manera interactiva (siguiendo, en alma, a Selenium). Con ello, podemos agilizar, y de manera sencilla, la creación de pruebas según el lenguaje de nuestra elección. .
✨ Concepto clave Playwright, está condicionada su configuración ya sea con TypeScript o JavaScript. Las pruebas, pueden ser generadas según el lenguaje de nuestra elección disponible.
.
Para disponer de esta herramienta, ejecutamos el binario de Playwright mediante playwright codegen [url] .
.
📌 Referencia Test Generator | Playwright
. Por ejemplo, utilizando el sitio de pruebas de Playwright podemos evaluar nuestro ejercicio al ejecutar el binario. .
pnpx playwright codegen demo.playwright.dev/todomvcpnpx playwright codegen example.cypress.io.
EXPLICA PLIS
Alguien sabe por qué no me genera los asserts? solo puedo ver los localizadores
Un cordial saludo.
tengo dos preguntas
Quedo atento a sus comentarios
Alguien sabe por qué no me genera los asserts? solo puedo ver los localizadores
Sí, Diana. Para limpiar la terminal de Visual Studio Code, puedes usar el comando clear en sistemas Unix/macOS o cls en Windows. Esto borrará el historial visible sin afectar la instalación de Playwright.
import { test, expect, chromium } from '@playwright/test'; test('test', async ({ page }) => { // Lanzar el navegador en modo no headless const browser = await chromium.launch({ headless: false }); // Esto abre una ventana de navegador visible const pagee = await browser.newPage(); // Crear una nueva página await pagee.goto('https://co.pinterest.com/'); // Verificar que el logo de Pinterest esté visible await expect(pagee.getByRole('link', { name: 'Pinterest logo' })).toBeVisible(); // Esperar explícitamente que el enlace 'Explorar' esté visible e interactuable const explorarLink = pagee.locator('//*[@id="__PWS_ROOT__"]/div/div/div[1]/div[1]/div[1]/div/div[1]/div[2]/a/div/div/span'); await expect(explorarLink).toBeVisible({ timeout: 20000 }); // Espera hasta 20 segundos await explorarLink.click(); // Realiza el clic en el enlace 'Explorar' // Verificar que el cuadro de búsqueda esté visible await expect(pagee.locator('[data-test-id="search-box-input"]')).toBeVisible(); // Interactuar con el cuadro de búsqueda await pagee.locator('[data-test-id="search-box-input"]').click(); await pagee.locator('[data-test-id="search-box-input"]').fill('gatos'); await pagee.locator('[data-test-id="search-box-input"]').press('Enter'); // Verificar que el valor de búsqueda esté correctamente ingresado await expect(pagee.locator('[data-test-id="search-box-input"]')).toHaveValue('gatos'); });
// Lanzar el navegador en modo no headless const browser = await chromium.launch({ headless: false }); // Esto abre una ventana de navegador visible page = await browser.newPage(); // Crear una nueva página
import { test, expect } from '@playwright/test'; test('test', async ({ page }) => { await page.goto('https://www.kia.com.co/'); await page.getByRole('button', { name: 'Nuestros Modelos' }).click(); await page.getByRole('link', { name: 'All New K3 Cross' }).click(); await page.getByLabel('Azul').click(); }); ```import { test, expect } from '@playwright/test'; test('test', async ({ page }) => { await page.goto('https://www.kia.com.co/'); await page.getByRole('button', { name: 'Nuestros Modelos' }).click(); await page.getByRole('link', { name: 'All New K3 Cross' }).click(); await page.getByLabel('Azul').click();});
Genial!
Descubrir esta herramienta tan potente de mano de una buena guía siempre será satisfactorio.
Playwright es una biblioteca Node. js para automatizar Chromium, Firefox y WebKit con una sola API. Playwright está diseñado para habilitar la automatización web entre exploradores que es perenne, capaz, confiable y rápida.
Simplemente maravilloso
Saludos amiga Lupe, muy buen cursito para hacer nuestros test.
para que aparezcan los expect y assert debes observar en la parte superios un pequeño banner con 5 iconos , los cuales se explican en la seccion Recording a test de :
los assert y expect no salen automaticamente , deben agregarle manualmente, no se porque en el video le aparecen