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

Javascript – Puppeteer – pass variable to selector

new to puppeteer and having trouble understanding how I can pass a variable to the browser inside the querySelector

I’ve got something to that goes and queries number of active users and returns the value

    const usedLicenses = await page.evaluate(() => {
            return document.querySelector('#root > div > main > div > div:nth-child(2) > div > div:nth-child(3) > strong').textContent;
  });

If usedLicenses is not 0, I then wish to loop from 1 to whatever the value is to return some further info using this selector

Ignoring the loop requirement for a minute, it seems like I need something like this but how do I use the variable properly inside the selector?

 const activeUsers = await page.evaluate(({usedLicenses}) => {
    return document.querySelector('#root > div > main > div > div:nth-child(3) > ul > li:nth-child(usedLicenses) > div.title > strong').textContent;
   },{usedLicenses});

Thanks

Tags:

2

Answers


  1. 0

    Like this, using template literal and the proper way to pass variable to page.evaluate():

    const activeUsers = await page.evaluate((usedLicenses) => {
    return document.querySelector(`#root > div > main > div > div:nth-child(3) > ul > li:nth-child(${usedLicenses}) > div.title > strong`).textContent;
}, usedLicenses);

    And to full fill all the requirements:

    const activeUsers = await page.evaluate((usedLicenses) => {
    if (usedLicenses == 0) {
        return document.querySelector(`#root > div > main > div > div:nth-child(3) > ul > li:nth-child(${usedLicenses}) > div.title > strong`).textContent;
    } else {
        return document.querySelectorAll(`#root > div > main > div > div:nth-child(3) > ul > li:nth-child(${usedLicenses}) > div.title > strong`).textContent;
    }
}, usedLicenses);

    As far as your post is not a MCVE: Minimal, Complete, and Verifiable Example, I’m not sure the argument to li:nth-child() will work.

    So, you need to adapt a bit if needed or edit your post to add missing informations.

    Login or Signup to reply.
  2. 0

    In Puppeteer, when you’re passing a variable into the page.evaluate() function, you need to ensure that the variable is correctly referenced within the function. Since you’re passing usedLicenses as an argument to evaluate(), you can access it inside the evaluate function directly by referencing it within the function’s scope.

    Here’s how you can pass the usedLicenses variable and use it inside the querySelector:

    const usedLicenses = await page.evaluate(() => {
  return document.querySelector('#root > div > main > div > div:nth-child(2) > div > div:nth-child(3) > strong').textContent;
});

// Convert the value of usedLicenses to an integer if it's a string
const numLicenses = parseInt(usedLicenses, 10);

const activeUsers = await page.evaluate(({numLicenses}) => {
  // Use numLicenses directly in the selector
  return document.querySelector(`#root > div > main > div > div:nth-child(3) > ul > li:nth-child(${numLicenses}) > div.title > strong`).textContent;
}, {numLicenses});

console.log(activeUsers);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search