Saltar al contenido

puppeteer element.click () no funciona y no arroja un error

Solución:

He determinado qué está sucediendo, por qué no obtengo un error y cómo solucionar el problema.

El principal problema es la forma element.click() obras. Utilizando DEBUG="puppeteer:*" Pude ver lo que está pasando internamente. Qué element.click() realmente hace es: –

const box = element.boundingBox();
const x = box.x + (box.width/2);
const y = box.y + (box.height/2);
page.mouse.move(x,y);
page.mouse.down();
sleep(delay);
page.mouse.up();

El problema es que debido a que la vista (div) está animando el elemento boundingBox () está cambiando, y entre el momento en que se solicita la posición del cuadro y se completa el clic (), el elemento se ha movido o no se puede hacer clic.

No se produce un error (promesa rechazada) porque es solo un clic del mouse en un punto de la ventana gráfica y no está vinculado a ningún elemento. Se envía el evento del mouse, solo que nada responde.

Una solución es agregar un retraso suficiente para permitir que finalice la animación. Otro es deshabilitar las animaciones durante las pruebas.

La solución para mí fue esperar a que la posición del elemento se estableciera en su posición de destino, es decir, giré para consultar el boundingBox () y esperar a que x, y informara la posición de los elementos previamente determinada.

En mi caso, esto es tan simple como agregar at 10,10 a mi secuencia de comandos de prueba justo antes del clic, o específicamente

test-id "form1.button3" at 10,10 click

Y en acción, funciona de la siguiente manera, en este caso, la vista se vuelve a animar desde la izquierda.

00.571 [selector.test,61] at 8,410
test-id "main.add" info tag button displayed at -84,410 size 116,33 enabled not selected check "Add"
test-id "main.add" info tag button displayed at -11,410 size 116,33 enabled not selected check "Add"
test-id "main.add" info tag button displayed at 8,410 size 116,33 enabled not selected check "Add"
00.947 [selector.test,61] click

No funcionaría para un elemento que se mueve continuamente o para un elemento que está cubierto por otra cosa. Para esos casos, intente page.evaluate(el => el.click(), element).

El page.click () devuelve una promesa, asegúrese de manejarlo como tal, pero también tenga en cuenta que puede tener problemas si no lo hace referencia como xpath. Eso es lo que tuve que hacer para que funcionara. Intenté usar querySelectors e interactuar con los objetos de esa manera, pero encontré problemas.

page.evaluate(()=>{
await Promise.all([
    page.click("a[id=tab-default-2__item]"),
    //The page.waitFor is set to 15000 for my personal use. 
    //Feel free to play around with this.
    page.waitFor(15000)
]);
});    

Espero que esto ayude.

uso una función auxiliar para manejar el clic


    click: async function (page, selector) {

        //selector must to exists
        await page.waitForSelector(selector, {visible: true, timeout: 30000})
        //give time to extra rendering time
        await page.waitFor(500)

        try {
            await page.click(selector)
        } catch (error) {
          console.log("error clicking " + selector + " : " + error ;
        }
    }

el uso de page.waitFor (500) es un MUY MALA PRÁCTICA en un MUNDO TEÓRICO, pero elimina muchos falsos positivos en la práctica con interfaces complejas.

Prefiero esperar 500ms más que obtener un falso positivo.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *