Puppeteer browser and page instant close, page.evaluate not working on bloc 2

Question

i have this script, everything works until the start of block 2 I do not understand why it does not do the work in block 2, I should have a return in "page.on request" but it is not the case it leaves directly, would you have an idea of the problem?

node return no error to me

thanks

async function main() {
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    await page.setViewport({width: 1200, height: 720})
    await page.goto('https://site.local', { waitUntil: 'networkidle0' }); // wait until page load
    await page.type("input[name='UserName']", "myusername");
    await page.type("input[name='Password']", "mypassworduser");
    // click and wait for navigation
    await Promise.all([
            page.click("body > main > button"),
            page.waitForNavigation({ waitUntil: 'networkidle0' }),
    ]);

    await page.goto(urlformation);

    await page.setRequestInterception(true);

    await page.on('request', (request) => { 
      if (request.resourceType() === 'media') {
        var CurrentRequest  = request.url();
        console.log(CurrentRequest);
        fs.appendFileSync(fichiernurlaudio, request.url()+"\r\n"); 
      }
      request.continue();

    }); 
//START BLOC 1 ------------------IT WORK    
    const Titresaudios = await page.evaluate(() => {
        let names = document.querySelectorAll(
            "td.cursor.audio"
        );
        let arr = Array.prototype.slice.call(names);
        let text_arr = [];
        for (let i = 0; i < arr.length; i += 1) {
            text_arr.push($vartraited+"\r\n");
        }
        return text_arr;
    })
    fs.appendFileSync(fichiernomaudio, Titresaudios);
//END BLOCK 1------------------IT WORK- i got data in my file   

//START BLOCK 2-------seems to ignore-----------NOT WORKING
    await page.evaluate(()=>{

        let elements = document.querySelectorAll("td.cursor.audio");    

        elements.forEach((element, index) => {
                setTimeout(() => {
                    element.click();
                }, index * 1000);  
        })

    })
//END BLOCK 2---------seems to ignore---------NO WORKING 

//i should see some console.log in page.on('request' (request) => { but instant close after works of bloc 1


    await page.close();
    await browser.close();


}

main();

Answer 1

I have no clue, what exactly you are trying to achieve there, but that block could be rewritten like this:

// ...
const els = await page.$$( 'td.cursor.audio' );
for( const el of els ) {

  // basically your timeout, but from outside the browser
  await page.waitFor( 1000 );

  // perform the action
  await el.click();

}
// ...

In your script the only thing you did in the evaluate() call was to schedule a few timeout-actions. As soon as those were scheduled (but not executed!) the callback of evaluate() exits and your script proceeds with closing the browser. So likely your clicks were never executed.

---

In my experience it is usually advisable to do as much as you can in NodeJS and not within the browser. Usually also makes for easier debugging.