Question 257265 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Puppeteer: waitForFunction not working as expected

I am using Node and Puppeteer.

I have an element that once I click it, text becomes "Generating" until download is finished. Once completed, text changes to something else. I am trying to poll to 1) verify the text switches to "Generating" (for verification) then 2) Poll until "Generating" is no longer present, indicating that it’s finished and I can proceed. I have tried the following methods and none have seem to worked.

Although, I have tried all of these methods isolated (without being inside waitForFunction() and they all work. For example, verified document… works in console, etc.

Below is a couple of things I’ve tried (for the sake of brevity I’m not including the exhaustive list of others I’ve tried, many of which probably didn’t even make sense but I was desperate). I am not including the 2nd step mentioned above since it’s just an inverse of code below):

await page.waitForFunction('document.querySelector(#rptCol3A1Lnk0_txt).innerText.includes("Generating")')

I then attempted to use $eval, being a beginner with Node and Promises, I tried all combos I could think of with awaits and returns:

await page.waitForFunction((frame) => frame.$eval("#rptCol3A1Lnk0_txt", el => el.textContent.includes("Generating")),
        {timeout: 5000, polling: 300}, frame)

await page.waitForFunction(async (frame) => {
            return await frame.$eval("#rptCol3A1Lnk0_txt", el => el.textContent.includes("Generating"))
        },
        {timeout: 5000, polling: 300}, frame)

await page.waitForFunction(async (frame) => {
            return frame.$eval("#rptCol3A1Lnk0_txt", el => el.textContent.includes("Generating"))
        },
        {timeout: 5000, polling: 300}, frame)

The Puppeteer documentation is not super helpful for this method.

Tags:

2

Answers


  1. 0

    If we’re just wanting to see if the element’s text has switched to "Finished" we can do something similiar:

     // Define a function that checks the element's text
  const checkTextChange = async () => {
    const element = await page.$('.your-element-selector'); // Replace with your element selector
    if (!element) return false; // Element not found

    const text = await element.evaluate((el) => el.textContent);
    return text === 'Finished'; // Check if the text has changed to "Finished"
  };

  // Wait for the element's text to change to "Finished"
  await page.waitForFunction(checkTextChange, { polling: 'raf', timeout: 30000 });

    Not sure if this will help fully but it should be a start.

    Login or Signup to reply.
  2. 0

    If it’s in a frame you call it on the frame. Also you’re quoting things wrong:

    await frame.waitForFunction(() => document.querySelector("#rptCol3A1Lnk0_txt").innerText.includes("Generating"))
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search