Que es Playwright

Playwright es una biblioteca de automatización de pruebas y navegación web que fue desarrollada por Microsoft. Es una herramienta de código abierto que permite a los desarrolladores automatizar interacciones en páginas web, como hacer clic en botones, completar formularios, navegar por sitios web y realizar capturas de pantalla.

Lo que hace que Playwright sea único y poderoso es su capacidad para interactuar con navegadores populares, como Chrome, Firefox y WebKit (utilizado por Safari), desde un solo conjunto de API coherente. Esto significa que puedes escribir tu código de automatización una vez y ejecutarlo en diferentes navegadores sin tener que modificarlo.

GraphQL también proporciona una gran flexibilidad al permitir a los clientes definir sus propios tipos de datos y operaciones, lo que permite una mayor personalización y capacidad de integración. Además, es independiente del lenguaje y puede ser utilizado con cualquier lenguaje de programación.

Playwright también proporciona una amplia gama de características útiles, como la capacidad de interceptar y modificar solicitudes de red, la simulación de dispositivos móviles y la ejecución de pruebas en entornos de emulación de navegadores. Además, es compatible con varios lenguajes de programación, como JavaScript, Python y C#, lo que permite a los desarrolladores elegir el lenguaje que más les convenga.

Características clave de Playwright:

1. Soporte multi-navegador: Playwright permite interactuar con los navegadores web más populares, como Chrome, Firefox y WebKit (Safari), desde un único conjunto de API. Esto proporciona una gran flexibilidad y portabilidad al momento de desarrollar pruebas o automatizar tareas en diferentes navegadores.
2. API coherente: Playwright ofrece una API coherente y fácil de usar, independientemente del navegador utilizado. Esto significa que puedes escribir tu código de automatización una vez y ejecutarlo en diferentes navegadores sin tener que aprender API específicas para cada uno.
3. Interceptación y modificación de solicitudes: Playwright permite interceptar y modificar solicitudes de red en tiempo real. Esto es útil para simular diferentes escenarios, como respuestas de red lentas o errores, y facilita la implementación de pruebas de carga y pruebas de integración más completas.
4. Emulación de dispositivos móviles: Playwright permite emular diferentes dispositivos móviles, como iPhones, iPads y dispositivos Android, para probar y depurar aplicaciones web responsivas. Esto te ayuda a garantizar que tu sitio web se vea y funcione correctamente en dispositivos móviles.
5. Capturas de pantalla y grabación de videos: Playwright proporciona funciones integradas para capturar capturas de pantalla y grabar videos de las interacciones realizadas durante la automatización. Estas características son útiles para documentar errores, generar informes visuales y realizar análisis posteriores.
6. Modo de espera inteligente: Playwright tiene un modo de espera inteligente que garantiza que las interacciones se realicen en el momento adecuado. En lugar de establecer tiempos de espera estáticos, Playwright espera automáticamente a que se cumplan las condiciones definidas, como la aparición de un elemento en la página, antes de continuar con la siguiente acción.

Configuración inicial

Instalación de Playwright en Python utilizando pip:

Para comenzar, debes instalar Playwright en tu entorno de desarrollo Python. Puedes hacerlo siguiendo estos pasos:

• Abre tu terminal o línea de comandos.
• Ejecuta el siguiente comando para instalar Playwright:

             pip install playwright
         

Este comando descargará e instalará Playwright y sus dependencias en tu entorno de Python.

Importación de Playwright en tu script:

Una vez que hayas instalado Playwright, puedes importarlo en tu script de Python para comenzar a utilizarlo. Aquí tienes un ejemplo de cómo importarlo:

             from playwright import sync_playwright
         

En este ejemplo, estamos importando la función sync_playwright que nos permitirá crear una instancia de Playwright y acceder a los diferentes navegadores compatibles, como Chrome, Firefox y WebKit.

Ahora estás listo para comenzar a utilizar Playwright en tu script de Python.

Recuerda que Playwright también tiene soporte para navegadores basados en Node.js, como JavaScript y TypeScript. Si prefieres utilizar Playwright con Node.js, los pasos de configuración pueden variar ligeramente.

Una vez completada la configuración inicial, puedes comenzar a aprovechar las capacidades de automatización y pruebas de Playwright en tu script de Python.

Automatizando una tarea de inicio de sesión

En este ejemplo, automatizaremos el proceso de inicio de sesión en una aplicación web. Veremos cómo navegar a la página de inicio de sesión, completar los campos de usuario y contraseña, y hacer clic en el botón de inicio de sesión.

Crearemos nuestro archivo en python:

             from playwright import sync_playwright
             
             def inicio_sesion():
                with sync_playwright() as playwright:
                    browser = playwright.chromium.launch()
                    context = browser.new_context()
                    page = context.new_page()

                    # Navegar a la página de inicio de sesión
                    page.goto('https://www.ejemplo.com/login')

                    # Completar campos de usuario y contraseña 
                    page.fill('#username', 'miUsuario')
                    page.fill('#password', 'miContraseña')

                    # Hacer clic en el botón de inicio de sesión
                    page.click('button[type="submit"]')

                    
                    # Realizar las acciones posteriores al inicio de sesión
                    # ...


                    # Cerrar el navegador
                    browser.close()

            inicio_sesion()
         

En este ejemplo, hemos utilizado el navegador Chromium, pero puedes reemplazarlo por 'firefox' o 'webkit' si prefieres utilizar Firefox o WebKit (Safari) como navegador.

El código comienza importando la función sync_playwright y luego define una función llamada inicio_sesion() que contiene todo el proceso de inicio de sesión automatizado.

Dentro de la función, se crea una instancia de Playwright y se inicia el navegador. Luego, se crea un contexto y una nueva página para interactuar con la aplicación web.

Después, utilizamos page.goto() para navegar a la página de inicio de sesión y page.fill() para completar los campos de usuario y contraseña con los valores deseados.

Finalmente, se utiliza page.click() para hacer clic en el botón de inicio de sesión. A partir de aquí, puedes agregar acciones posteriores al inicio de sesión según tus necesidades.

Al final del script, se cierra el navegador utilizando browser.close().

Este ejemplo te brinda una idea de cómo puedes utilizar Playwright en Python para automatizar el proceso de inicio de sesión en una aplicación web. Puedes adaptarlo y agregar más acciones según tus requisitos específicos.

Realizando capturas de pantalla automatizadas

En este ejemplo realizaremos las siguientes tareas:

• Configuración de un nuevo contexto y página en Playwright.
• Definición de una lista de URL de las páginas a capturar.
• Iteración sobre las URL y captura de pantalla de cada página.
• Guardado de las capturas de pantalla en una ubicación específica.

A continuación, te desglozaré el código del Ejemplo 2, donde realizaremos capturas de pantalla automatizadas utilizando Playwright en Python:

 
            from playwright.sync_api import sync_playwright
            def capturas_pantallas(): 
                
                with sinc_playwright asplaywright:
                    browser = playwright.chromium.launch()
                    context = browser.new_context()
                    page = context.new_page()

                    # DEfeinir lista de URL de las páginas a capturar
                    urls = [
                        'https://www.ejemplo.com/',
                        'https://www.ejemplo.com/productos',
                        'https://www.ejemplo.com/contacto'
                    ]

                for url in  urls:
                    # Navegar a la URL de la Página
                    page.got(url)

                    # Capturar la pantalla de la página 
                    screenshot_path = f'capturas/{url.replace("https://www.ejemplo.com/", "")}.png'
                    page.screenshot(path=screenshot_path)

                    # Imprimir la ubicación de la captura de pantalla)
                    print(f'Captura de pantalla guardada en: {screenshot_path}') 
                                        
                 # cerrar el navegador
                browser.close()
            
            
            capturas_pantallas()
            

El código comienza importando la función sync_playwright y luego define una función llamada capturas_pantalla() que contiene todo el proceso de captura de pantalla automatizada.

Dentro de la función, se crea una instancia de Playwright y se inicia el navegador. Luego, se crea un contexto y una nueva página para interactuar con la aplicación web.

Se define una lista de URLs de las páginas que deseamos capturar. En este ejemplo, hemos proporcionado tres URLs de ejemplo.

Luego, se itera sobre cada URL en la lista utilizando un bucle for . Dentro del bucle, utilizamos page.goto() para navegar a la URL de la página correspondiente.

A continuación, utilizamos page.screenshot() para capturar la pantalla de la página. Hemos definido una ruta para guardar la captura de pantalla utilizando el nombre de la página en el directorio "capturas". Puedes ajustar la ruta y el formato de archivo según tus necesidades.

Después de cada captura de pantalla, imprimimos la ubicación de la captura guardada para tener un registro de dónde se guardó.

Al final del script, se cierra el navegador utilizando browser.close().

Este ejemplo te muestra cómo utilizar Playwright en Python para realizar capturas de pantalla automatizadas de varias páginas. Puedes personalizar la lista de URLs y ajustar la ubicación de las capturas de pantalla según tus requisitos específicos.

Integración de Playwright con el Page Object Model (POM)

El Page Object Model es un patrón de diseño comúnmente utilizado en la automatización de pruebas para separar la lógica de las pruebas de la estructura de la página web. Playwright se integra de manera efectiva con el POM, lo que permite crear scripts más estructurados y fáciles de mantener. A continuación, se describe cómo Playwright facilita la implementación del POM:

1. Creación de clases de página: En Playwright, puedes crear una clase para cada página o componente importante de tu aplicación web. Estas clases representarán las páginas y encapsularán los elementos y acciones relevantes de cada página.
2. Identificación de elementos en las páginas: Con Playwright, puedes utilizar selectores para identificar los elementos en las páginas web, como campos de entrada, botones y enlaces. Puedes utilizar selectores CSS, selectores XPath u otras estrategias de localización admitidas por Playwright para identificar los elementos de manera única.
3. Métodos para interactuar con los elementos: Puedes definir métodos en las clases de página para realizar acciones comunes en los elementos de la página, como ingresar texto en un campo de entrada, hacer clic en un botón o validar el contenido de un elemento. Esto facilita la reutilización del código y la centralización de la lógica de interacción en un solo lugar.
4. Reutilización de código: El uso del POM en conjunto con Playwright permite reutilizar los métodos y las clases de página en diferentes pruebas. Esto evita la duplicación de código y hace que los scripts de automatización sean más concisos y mantenibles.

Al implementar el POM con Playwright, puedes obtener varios beneficios, como una estructura de código más organizada, fácil mantenibilidad, mayor reutilización de código y una mejor separación entre las pruebas y la estructura de la página. Esto promueve un desarrollo más eficiente y escalable de los scripts de automatización.

Conclusión

Playwright proporciona una excelente integración con el Page Object Model, lo que permite crear scripts de automatización más estructurados y fáciles de mantener. Al utilizar el POM en conjunto con Playwright, puedes mejorar la calidad y la eficiencia de tus pruebas automatizadas, lo que a su vez contribuye a la entrega de aplicaciones web de alta calidad y confiabilidad.

Recuerda que el uso del POM es una práctica recomendada, pero su implementación puede variar según las necesidades y preferencias de cada proyecto. Adaptar el POM a tu contexto específico te ayudará a maximizar los beneficios de Playwright y lograr una automatización de pruebas web más sólida.