How to get value from dom element in puppetier?Like how to get value in span tag in puppetier?

Question

As example:

async function startInstagram(){
    const browser=await puppeter.launch({headless:false})
    const page=await browser.newPage()
    await page.goto('https://www.instagram.com/50cent/')
    const html=await page.waitForSelector('#mount_0_0_qQ > div > div > div.x9f619.x1n2onr6.x1ja2u2z > div > div > div > div.x78zum5.xdt5ytf.x10cihs4.x1t2pt76.x1n2onr6.x1ja2u2z > div.x9f619.xnz67gz.x78zum5.x168nmei.x13lgxp2.x5pf9jr.xo71vjh.x1uhb9sk.x1plvlek.xryxfnj.x1c4vz4f.x2lah0s.xdt5ytf.xqjyukv.x1qjc9v5.x1oa3qoh.x1qughib > div.xh8yej3.x1gryazu.x10o80wk.x14k21rp.x1porb0y.x17snn68.x6osk4m > section > main > div > ul > li:nth-child(2) > a > div > span > span')
    .catch(e=>console.log(e))
  console.log(`${subs.asElement()}`)
    await browser.close()
}

startInstagram()

I need to got text from span tag in instagramm,but JsHandle@node returns to me.How can I get the value?

This code doesn't log JsHandle, it crashes. `subs` isn't defined and `html` is never used. Please share a [mcve]. Typically, _value_ refers to ``. Are you looking for text contents, e.g. `this is the text content`? BTW, the long [browser-generated selectors](https://serpapi.com/blog/puppeteer-antipatterns/#misusing-developer-tools-generated-selectors) are very brittle. I suggest using a simpler selector. — ggorlen, Mar 29 '23 at 13:04
Does this answer your question? [how to get text inside div in puppeteer](https://stackoverflow.com/questions/55237748/how-to-get-text-inside-div-in-puppeteer) — ggorlen, Mar 29 '23 at 13:21

score 0 · Accepted Answer · edited Apr 03 '23 at 19:35

You don't need to write every element and their class or id's that lead to the element that you want, try closest elements first.
Run $$('Your_Selector_Goes_here'); in the console section if dev tools on your browser, to check what the selector returns.
check Puppeteer docs for using page.$(), page.$$(), page.$eval(), page.$$eval().
.waitForSelector does what it says, waits or gives timeout error if it doesn't exist.

to get the text content and title value of the span tag would be :

async function startInstagram() {
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();

    let url = 'https://www.instagram.com/50cent/'
    await page.goto(url,{ waitUntil: 'load', timeout:0});

    let selector = 'li:nth-child(2) > button > span';
    await page.waitForSelector(selector);
    let subs = await page.$eval(selector, el => el.innerText);
    let subs2 = await page.$eval(selector, el => el.getAttribute("title")); 

    console.log(subs); // text contents
    console.log(subs2); // title attribute

    await browser.close();
}

await startInstagram();

How to get value from dom element in puppetier?Like how to get value in span tag in puppetier?

1 Answers1