Puppeteer - Click div not working

Question

I'm able to login, but i need to click on a div that has no id and i cant figure out how to do it

This is html element. Onclick event (devtool properties) is on the div that has the route (class route-redirect-box)

How can i click this link to go to "listachamados" page?

Page html:

<div class="menu-lateral-contraido-sub-container" title="Lista de Chamados" draggable="true" style="opacity: 1;">

<div to="/main/listachamado/" class="route-redirect-box"><div class="menu-lateral-item-contraido-container cor-tema-topo-fundo ">

<div class="menu-lateral-item-contraido-icon"><i class="ellevo-icons">lista_chamado</i></div></div></div></div>

<div class="menu-lateral-item-contraido-icon"><i class="ellevo-icons">lista_chamado</i></div>
<i class="ellevo-icons">lista_chamado</i>

My code:

const puppeteer = require('puppeteer');

let scrape = async () => {
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();
    await page.goto('https://notreal.br/', {waitUntil: 'load'});
    console.log(page.url());

    const SELETOR_USUARIO = '#usuario';
    const SELETOR_SENHA = '#senha';
    const usuario = 'username';
    const senha = 'password';


    await page.type(SELETOR_USUARIO, usuario);
    await page.type(SELETOR_SENHA, senha);
    //await page.waitForNavigation();


    console.log(page.url());
    await Promise.all([
        page.click('#login'),
        page.waitForNavigation({ waitUntil: 'networkidle0' })

        //page.click('.menu-lateral-item-contraido-container cor-tema-topo-fundo'),

    ]);

    await Permise.all([
      page.waitFor('load'),
      await page.evaluate(() => {
          let lista = document.getElementsByClassName('div.route-redirect-box')
          lista.click()
          //page.click(lista)
      })
    ]);

    //browser.close();
};

scrape().then((value) => {
    console.log(value); 
});

Solution

You misspelled Permise.all. It should be Promise.all.

But you might not need to use Promise.all because you can just simply await the Puppeteer methods that you called.

Additionally, since the onclick event is attached to the .route-redirect-box element, you can use page.click() or page.evaluate() to click the element:

await page.click('.route-redirect-box');

await page.evaluate(() => {
  document.querySelector('.route-redirect-box').click();
});

Or, since you seem to know the URL of the page you are trying to redirect to, you could just use another page.goto() to navigate manually:

await page.goto('https://example.com/main/listachamado/');

Another alternative solution would be, if you know the function that is going to be executed onclick, you can just execute the function itself within page.evaluate():

await page.evaluate(() => {
  function_to_be_executed_onclick();
});

Comments

[nanquim]

page.click and page.evaluet does not work. and page.goto just log off. weird, causa if i try to do this manually i stay logged

[Grant Miller]

@tramada Is there more than one element with .route-redirect-box?