The Puppeteer es un marco basado en la biblioteca de node js que está disponible como código abierto. Se puede utilizar para herramientas de web scraping. También se utiliza para herramientas de automatización de pruebas. Hoy en día, el uso de Puppeteer está aumentando rápidamente en el espacio de prueba de software automatizado. Se requiere un conocimiento básico de la línea de comandos, Javascript y la estructura HTML DOM para comprender tutorial de titiritero. Todo el tutorial está segregado en los siguientes artículos.
Tutorial de titiritero
Tutorial de Tosca # 1: Descripción general del titiritero
Tosca Tutorial # 2: Variables de entorno del titiritero
Tosca Tutorial # 3: Descripción general de la automatización de pruebas de titiritero y raspado web de titiritero
Tosca Tutorial # 4: Instalar Titiritero
Tosca Tutorial # 5: Proyecto de muestra de titiritero
Tutorial de Tosca # 6: Pruebas de automatización de titiriteros
En este tutorial de "Prueba de automatización de titiriteros", explicaremos los pasos detallados para la automatización de titiriteros desde el principio. A continuación, se explicarán las características para comprender las pruebas de automatización de titiriteros desde cero:
· Instalar Puppeteer
· Lanzar aplicación web
· Identificar las propiedades del objeto desde el navegador Chrome
· Pasos de envío de formularios: introducir texto, hacer clic en evento, verificación
· Captura de pantalla
· Ejecutar scripts para la automatización de titiriteros
Automatización del titiritero
Se requieren pruebas para garantizar la calidad de los productos de software. Hay múltiples niveles de prueba definidos en los procesos de desarrollo de software. Para probar las funcionalidades de un software, se puede hacer de forma manual o mediante un proceso automatizado. Los principales propósitos de las pruebas de software automatizadas son:
- Ciclo de ejecución de prueba rápido.
- Evite las posibilidades de errores humanos.
- Reduzca el tiempo de ejecución de la prueba.
- Reducir el tiempo del ciclo de liberación.
- Cree más funcionalidad sin comprometer la calidad.
- La ejecución múltiple se puede realizar en paralelo.
Puppeteer es una biblioteca de nodo basada en javascript que ofrece una interfaz de aplicación (API) de alto nivel para controlar el navegador web Chrome a través del protocolo Chrome DevTools. La mayoría de las operaciones manuales realizadas en el navegador Chrome se pueden automatizar utilizando Puppeteer. Por lo tanto, Puppeteer es una buena opción para realizar pruebas unitarias en aplicaciones web de forma rápida y sencilla.
Enfoque de prueba de automatización de titiriteros:
Los pasos involucrados con las pruebas de automatización de titiriteros se explican a continuación:
Paso 1 # Identificar el escenario de prueba funcional:
Mostraremos el enfoque paso a paso para realizar la automatización Titiritero para el siguiente escenario:
· Inicie el navegador web.
· Invocar la aplicación web de Amazon.
- Busque el libro "Testing Book".
- Agregue el libro al carrito desde el resultado.
- Abra el carrito y compruebe si el libro está disponible en el carrito.
- Capture la pantalla y cierre el navegador.
Step2 # Instale Puppeteer y cree un caso de prueba:
Cree un archivo javascript vacío como "sample_script.js" en una carpeta específica. Aquí, consideraremos la carpeta raíz como SampleProject. Para instalar Puppeteer, usaremos el comando - “npm install puppeteer”. El procedimiento de instalación lleva algún tiempo según la velocidad de la red. Descargará aproximadamente 350 MB de datos. Después de la instalación, la carpeta node_modules, que contiene diferentes componentes de puppeteer y el archivo package-lock.json, se creará en la carpeta raíz del proyecto Puppeteer de muestra.
Paso 3 # Capturar propiedades de identificación del objeto de prueba:
Podemos capturar las propiedades de identificación utilizando la herramienta para desarrolladores del navegador web Chrome. Analizando las diferentes propiedades como id, nombre, XPath, etc., elegiremos la correcta que se puede utilizar en el scripting para realizar cualquier operación. En este tutorial de "Pruebas de automatización de titiriteros", usaremos XPath en el script. A continuación, los pasos a seguir para obtener XPATH o cualquier otra propiedad,
1. Abra Herramientas de desarrollo que están disponibles en "Menú -> Más herramientas" y vaya a la pestaña Elementos.
2. Con la herramienta Finder (haciendo clic en el icono de flecha disponible en la esquina superior izquierda de la pestaña Elementos), resalte el objeto de prueba de la aplicación. Aquí, inspeccionaremos el cuadro de búsqueda.
3. Analice el código fuente resaltado para identificar las propiedades deseadas. Para obtener la propiedad XPATH del objeto de prueba, haga clic con el botón derecho en la sección resaltada y haga clic en "Copiar-> Copiar Xpath" para copiar la propiedad XPATH en el portapapeles.
4. Ahora, pegue el XPath en el cuadro de texto del buscador y presione enter para verificar si el XPath identifica el objeto de manera única.
5. De manera similar, también necesitamos capturar las propiedades de identificación de otro objeto de prueba.
Step4 # Pasos de desarrollo de automatización de titiritero:
Para completar el caso de prueba, necesitamos realizar ciertas operaciones en las páginas web. Para cada una de las operaciones, hay diferentes métodos disponibles. Los métodos que se utilizan en nuestro escenario para "Pruebas de automatización de titiriteros" se explican aquí.
Aplicación de inicio - Después de incluir el titiritero, debemos iniciar el navegador utilizando el método titiritero: iniciar. Se puede pasar una referencia de objeto a este método para definir un navegador headless o headful. Luego, necesitamos crear la instancia del navegador web que se requiere para navegar por la URL. Aquí, la función async se usa para usar la palabra clave await para manejar el sincronizador web.
//Incluye el paquete titiritero const titiritero = require('titiritero'); (async () => { //lanzamiento del navegador sin cabeza const browser = await titiritero.launch({ headless: true }); //Crear una instancia de la página const del navegador = await browser.newPage(); //Navegar a la url espera page.goto('https://www.amazon.in/'); })()Toda la prueba se realizará en un navegador sin cabeza. Si queremos abrir el navegador completo, debemos pasar el objeto al método de lanzamiento como "{Sin cabeza: falso}".
Comprobar la existencia - Necesitamos usar el método página.waitForXpath que verificará la existencia del Xpath y devolverá la referencia del objeto de prueba. Al probar la referencia de devolución, podemos agregar un punto de verificación en el caso de prueba.
\tlet searchBox = await page.waitForXPath("//*[@id='twotabsearchtextbox']",{ visible: true });
\tif (searchBox === null) //Verificación del objeto de prueba
\t{
\t\tconsole.log('No se muestra la pantalla de Amazon');
\t}Introducir datos - Utilizando la tipo método de esa referencia de objeto, podemos ingresar el texto.
await searchBox.type("Libro de prueba");Haga clic en Elemento - Del mismo modo, utilizando el clic método de cualquier objeto de referencia, podemos realizar operaciones de clic.
let btnSearch = await page.waitForXPath("//*/input[@id='nav-search-submit-button']",{visible:true }); btnSearch.click();Imprimir mensaje en la consola - Usando el método console.log, podemos imprimir cualquier mensaje en la consola como salida.
console.log('Se ha generado retraso en la consola');Consulte la nueva pestaña - Usando los métodos page.target y browser.waitforTarget, podemos verificar y almacenar la referencia sobre la nueva pestaña en una variable.
\tconst pageTarget = página.target(); \tconst newTarget = await browser.waitForTarget(target => target.opener() === pageTarget); \t//obtener el nuevo objeto de página: \tconst page2 = espera newTarget.page();
Captura de pantalla - Usando el método página. Captura de pantalla, se ha tomado una instantánea de la página en particular y se guarda según el nombre de archivo proporcionado como argumento.
esperar página.captura de pantalla ({ ruta: 'captura de pantalla1.png' });Cerrar página y navegador - Usando el método Cerrar, podemos cerrar tanto la página web como el navegador.
\tawait página.close(); \tawait navegador.close();
Tiempo de espera - En ciertos casos, existe el requisito de esperar a que se cargue la página o al final de cualquier tarea dependiente; necesitamos pausar la ejecución por un tiempo predefinido. Para realizar esto, podemos usar la página .waitForTimeout método que puede pausar la ejecución según el valor (en milisegundos) pasado a través del argumento.
esperar página.waitForTimeout(2000);
Ahora hemos aprendido los pasos técnicos básicos para automatizar nuestro escenario funcional. Basándonos en el conocimiento, podemos revisar el caso de prueba de automatización de titiriteros a continuación. La descripción detallada de las clases y métodos más utilizados se explicará en publicaciones posteriores.
/**
* @nombre búsqueda en Amazon
*/
const titiritero = require('titiritero');
const reportPath = 'C:\\\\LambdaGeeks\\\\puppteer_proj_sample\\\\output\\\\';
captura de pantalla constante = 'pantalla1.png';
// Se utiliza para exportar el archivo a un archivo .docx
intentar {
(asincrónico () => {
navegador constante = aguarda titiritero.launch({ sin cabeza: falso });
const pageNew = espera navegador.newPage()
espere pageNew.setViewport ({ ancho: 1280, alto: 800 });
espere pageNew.goto('https://www.amazon.in/');
\t//Ingresar criterios de búsqueda
\tlet searchBox = await page.waitForXPath("//*[@id='twotabsearchtextbox']",{ visible: true });
\tif (cuadro de búsqueda === nulo)
\t{
\t\tconsole.log('No se muestra la pantalla de Amazon');
\t}
\telse{\t\t
\t\tawait searchBox.type("Libro de pruebas");
\t\tconsole.log('Se han ingresado criterios de búsqueda');
\t} \t\t
\t//Hiciste clic en el botón de búsqueda
\tlet btnSearch = await pageNew.waitForXPath("//*/input[@id='nav-search-submit-button']",{ visible: true });
\tif (btnBuscar === nulo)
\t{
\t\tconsole.log('El botón Buscar no se muestra');
\t}
\telse{
\t\tawait btnSearch.click();
\t\tconsole.log('Se hizo clic en el botón de búsqueda');
\t}\t
\t//Haga clic en un resultado de búsqueda específico
\tlet myBook = await pageNew.waitForXPath("//*[contains(text(),'Selenium Testing Tools Cookbook Segunda edición')]",{ visible: true })
\tif (miLibro === nulo)
\t{
\t\tconsole.log('El libro no está disponible');
\t}
\telse{
\t\tawait miLibro.click();
\t\tconsole.log('Haga clic en un libro específico para realizar el pedido');
\t} \t
\t// Identificar si se ha abierto la nueva pestaña
\tconst pageTarget = pageNew.target();
\tconst newTarget = await browser.waitForTarget(target => target.opener() === pageTarget);
\t//obtener el nuevo objeto de página:
\tconst page2 = espera newTarget.pageNew();\t
\tawait page2.setViewport({ ancho: 1280, alto: 800 });
\ t
\t//Agregar al carrito
\tlet addToCart = await page2.waitForXPath("//*/input[@id='add-to-cart-button']",{ visible: true });
\tif (añadirAlCarro === nulo)
\t{
\t\tconsole.log('El botón Agregar al carrito no está disponible');
\t}
\telse{
\t\tconsole.log('Haga clic en el botón Agregar al carrito');
\t\tawait addToCart.click();\t\t
\t} \t\t
\t//Verificar el proceso de agregar al carrito\t
\tlet SuccessMessage = await page2.waitForXPath("//*[contains(text(),'Added to Cart')]",{ visible: true });
\tif (mensaje de éxito === nulo)
\t{
\t\tconsole.log('El artículo no se agregó al carrito');
\t}
\telse{
\t\tconsole.log('El artículo se agregó al carrito correctamente');\t\t
\t} \t\t
\t// Capturar nº de carrito
\tlet cartCount = await page2.waitForXPath("//*/span[@id='nav-cart-count']",{ visible: true});
\tlet valor = esperar página2.evaluar(el => el.textContent, cartCount)
\tconsole.log('Recuento de carritos: ' + valor);
\tcartCount.focus();
\tawait page2.screenshot({ ruta: captura de pantalla });
\ t
\tawait páginaNew.waitForTimeout(2000);
\tawait página2.close();
\tawait pageNew.close();
espere navegador.close();
})()
} atrapar (errar) {
consola.error(err)
}Paso 5 # Ejecución de la prueba de automatización de titiritero:
Podemos iniciar la ejecución usando el comando nodo sample_script.js a través del símbolo del sistema. Durante la ejecución, el navegador Chromium se abrirá y automáticamente realizará los pasos funcionales y almacenará la captura de pantalla de la página final. La captura de pantalla y la salida de la consola se verán a continuación.
Conclusión:
A lo largo de este Tutorial de pruebas de automatización de titiriteros, hemos aprendido los pasos detallados sobre las pruebas de automatización de titiriteros. En el próximo tutorial de titiritero, aprenderemos sobre la descripción detallada de las clases y métodos de titiritero más utilizados. Por favor haz click esta página para visitar el portal de referencia de este Tutorial de titiritero.
Hola, soy K. Mondal, estoy asociado con una organización líder. Tengo más de 12 años de experiencia laboral en varios dominios, por ejemplo, desarrollo de aplicaciones, pruebas de automatización, consultor de TI. Estoy muy interesado en aprender diferentes tecnologías. Estoy aquí para cumplir con mi aspiración y actualmente contribuyo como autor y desarrollador de sitios web en LambdaGeeks.
Conectémonos a través de LinkedIn