Interactuando con los elementos
Contenido del curso
Interactuando con los elementos
Contenido del curso
Manuel Ledezma
santi Bedoya
Gissell Angelica Quintero Hernandez
Jose Alzugaray
Mónica Evelyn Quevedo Devia
Jesus Cuadro
Vasti Gabriela Flores Zelaya
Luis Ernesto Yepes Fernandez
Javier Fuentes Mora
ProfesorJavier Fuentes Mora
Profesor
ingri sepulveda
MANUEL ALEJANDRO CUELLAR GUARIN
Javier Fuentes Mora
Profesor
Osmel Jose Vera Isasis
Luis Ernesto Yepes Fernandez
Renato Caceres
Xavier Alberto Castillo varon
Pehuen Santore
Luis Palomo
Mónica Evelyn Quevedo Devia
Pehuen Santore
Javier Fuentes Mora
Profesor
Alexis Giovana Montes de Oca Juarez
Vasti Gabriela Flores Zelaya
Capacitacion Interware
Jose Miguel Lopez
Alexis Giovana Montes de Oca Juarez
Cristian Ponce Gonzalez
Juliana Jiménez Echeverri
Irving Juárez
ESTIBEN CASTAÑEDA MORALES
Mi código del reto
const puppeteer = require('puppeteer') describe('llenar un formulario',() => { it('test llenado de formulario', async() => { const browser = await puppeteer.launch({ headless: false, defaultViewport: null }) const page = await browser.newPage() await page.goto("https://devexpress.github.io/testcafe/example/") //llenado de formulario await page.type('#developer-name','Manuel',{delay:100}) await page.click('#remote-testing') await page.click('#traffic-markup-analysis') await page.click('#tried-test-cafe') await page.click('#slider > span') await page.type('#comments', 'hola esto es un comentario') await page.click('#windows') await page.select('#preferred-interface','JavaScript API') await page.click('#submit-button') await page.waitForTimeout(2000) },350000) })
Hola como estas ? soy nuevo en esto una pregunta es que en el código ya no deja poner el waitfortimeout; que pusiste tu?
Este te puede funcionar new Promise(r => setTimeout(r, 2000));
Así resolví el reto para elegir una opción de la lista: await page.select('#id-select-element', 'value')
Asi quedo el mio
<const puppeteer = require('puppeteer') describe('Interactuando con elemntos', () => { it('Debe abrir', async () => { const browser = await puppeteer.launch({ headless: false, // slowMo: 0, // devtools:false, defaultViewport: null//expanda al tam de la ventana // defaultViewport: { // width:2100, // height:1080 // } }) const page = await browser.newPage() await page.goto('https://demo.guru99.com/test/simple_context_menu.html') //Con esta instruccion le damos aceptar a los alerts que nos salgan en la pagina page.on('dialog', async (dialog) => { await dialog.accept() }) //click derecho // await page.click('#authentication > span', { button: 'right', delay:500}) // await page.waitForTimeout(3000) //Doble click await page.click('#authentication > button', { clickCount: 2, delay: 500 }) await page.goto('https://devexpress.github.io/testcafe/example/') await page.type('#developer-name', 'Monica Evelyn', { delay: 100 }) await page.click('#windows') await page.click('#remote-testing') //await page.select(’#id-select-element’, ‘value’) --> PARA SELECCIONAR DE UNA LISTA DESPLEGABLE await page.select('#preferred-interface', 'JavaScript API') await page.click('#tried-test-cafe') await page.type('#comments', 'Test para formulario realizado en Puppeteer como prueba e2e', { delay: 100 }) await page.click('#submit-button') await new Promise(r => setTimeout(r, 3000)); await browser.close() }, 350000) }) // //await page.waitForTimeout(3000) reemplace con await new Promise(r => setTimeout(r, 3000));>
Asi me quedo el ejercicio:
describe('Interactuando con elementos', () => { it('Debe darle click a el boton', async () => { const browser = await puppeteer.launch({ // headless: 'new' hace que no se habara el navegador y que las pruebas sean // más rápidas, el headless: false siempre nos abre el navegador headless: false, defaultViewport: null, // máximiza el viewport de la página al tamaño de la ventana }) const page = await browser.newPage() await page.goto('https://devexpress.github.io/testcafe/example/') await page.type('#developer-name', 'Jesus', { delay: 100 }) await page.click('#remote-testing') await page.click('#tried-test-cafe') await page.click('#macos') await page.select('#preferred-interface', 'Both') const selector = '#slider > span' await page.evaluate((selector) => { const elemento = document.querySelector(selector) if (elemento) { elemento.style.left = '66.6666%' } }, selector) await page.type( '#comments', '"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."', { delay: 100 } ) await page.click('#submit-button') await new Promise((resolve) => setTimeout(resolve, 8000)) //click derecho // await page.click('#authentication > span', {button: 'right', delay: 500}) //doble click // await page.click('#authentication > button', { // clickCount: 2, // delay: 500, // }) await browser.close() }, 3500000) })
Genial! Gracias por compartir! No encontraba como hacer la parte del slider
Hola! Cuando instalé la extensión de jest nunca me salió el icono de play y cada vez que hago un npm run test corre los dos archivos de pruebas que tenemos. como puedo mejorar eso? gracias
Hola , solo tienes que deshabilitarlo , https://marketplace.visualstudio.com/items?itemName=Orta.vscode-jest ahi viene la forma en que se deshabilita "jest.autoRun": "off"
si, desde el archivo de configuración de la extension de jest puedes deshabilitar el autoRun
😊
Buenas tengo una pregunta si tengo esos dos archivos de pruebas navegador e interactuando como hago para que se ejecute solo uno?
mas adelante , lo vemos pero debes de filtrar desde el comando de jest algo como esto npm test -- -t "<Test Suite> <Test>"
hola comparto mi codigo espero que les sirva..
Solución
await page.select('#preferred-interface', "Both")
await page.goto('https://devexpress.github.io/testcafe/example/') await page.type('#developer-name', 'Cesar',{delay: 100}) await page.click('#remote-testing') await page.click('#tried-test-cafe') await page.select('#preferred-interface','JavaScript API') await page.type('#comments','Esta es una prueba') await page.click('#submit-button') await page.waitForTimeout(3000)
buenas tardes comunidad pregunta ¿como hago para cuando corra el proceso de un solo archivo no se corran todo?, anexo un aimagen
porque el page.waitForTimeout( 3000) me aparece TACHADO?
No es que no funcione, sino que el editor de código te recomienda no usarlo ya que en general no es recomendable usar setTimeOuts.
Hola lo puedes reemplazar con esta instruccion, lo que pasa es que el waitDorTimeout ya esta deprecated u obsoleto await new Promise(r => setTimeout(r, 3000));
me sale la opcion de aceptar cache y no me funciona el codigo capaz seria bueno configurar la accion del aceptar de cache?
hola puedes expandir a que te refieres?
Hola, buena tarde.
Estoy viendo que en le archivo de package.json tiene el siguiente propiedad test
"test": "jest --forceExit --detectOpenHandles" ```para que sirve --detectOpenHandles?
la opción --detectOpenHandles en Jest es una herramienta útil para detectar y solucionar problemas de manijas abiertas que pueden causar fugas de memoria y problemas de cierre.
Cuando ejecuto la prueba, se ejecutan todos los test anteriores, ¿Cómo puedo evitarlo?
en el packgae agrega lo siguiente debajo del test
"test:single": "jest ELNOMBREDELTEST.test.js"
luego ejecuta asi npm run test:single
Hola, buena tarde.
Estoy realizando la practica de la clase pero no mu muestra la alerta7notificación del doble click, pero no me muestra error en entorno de desarrollo.
Me podrían guiar para saber que estoy haciendo mal, por favor.
Les comparto mi código:
const puppeteer = require('puppeteer') describe('Formularios', () => { it('llenar formulario', async () => { const browser = await puppeteer.launch({ headless: false, defaultViewport: null }) const page = await browser.newPage() await page.goto('https://demo.guru99.com/test/simple\_context\_menu.html') //listener - estos escuchan los cambios page.on('dialog', async(dialog)=>{ await dialog.accept() }) //clic derecho en elementos //await page.click('#authentication > span', {button:'right', delay: 500}) //await page.waitForTimeout(3000) //doble click await page.click('#authentication > button',{clickCount: 2,delay:500}) await page.goto('https://devexpress.github.io/testcafe/example/') await page.type('#developer-name', 'Alexis',{delay:100}) await page.click ('#reusing-js-code') await page.click ('#tried-test-cafe') await page.type('#comments', 'Esto es una prueba') await page.click('#submit-button') await page.waitForTimeout(3000) await browser.close() }, 350000)})
Pueden hacer está función utilitaria para tener tiempos de espera
/** * Espera la cantidad de tiempo especificada en milisegundos antes de resolver la promesa. * @param {number} ms - La cantidad de tiempo en milisegundos para esperar. * @returns {Promise<void>} Una promesa que se resuelve después del tiempo de espera. */ export function waitFor(ms: number) { return new Promise((resolve) => setTimeout(resolve, ms)); }
Solución al reto: await page.select('select', 'Both');
El link para el test del right-click and double-click https://demo.guru99.com/test/simple_context_menu.html
Después de colocar el comando para el comentario la solución fue la siguiente. await page.click('#windows') await page.select('#preferred-interface','JavaScript API') await page.click('#submit-button')
