javascript - How to check if element exists inside asyncawait with Puppeteer - Stack Overflow

I am having trouble recording an element on a page after checking if it exists. The block of code I'm referring to is under the "// phone" ment.

This code loops through each section (section of sections) on the page and records "pany" and "phone." "Phone" may not be present in some sections so I figured I'd pass it through an if statement to check if it exists. This creates an error = "Error: failed to find element matching selector ".mn-contact-phone"" How do I solve this?

(async () => {
    try {
        const browser = await puppeteer.launch({ headless: true });
        const page = await browser.newPage();

        // loop through pages
        for (let pg = 1; pg < 5; pg++) {
            await page.goto("webpage");

            // record number of sections
            const sections = await page.$$("#mn-members-listings > div");

            // loop through each section
            for (const section of sections) {
                // pany
                let pany = await section.$eval(
                    "div.mn-searchlisting-title",
                    p => p.innerText
                );

                // phone --> THIS IF/ELSE THROWS AN ERROR
                if (section.$(".mn-contact-phone").length > 0) {
                    let phone = await section.$eval(".mn-contact-phone", phn => phn.innerText);
                } else {
                    let phone = "";
                }

                console.log(`Company = ${pany} | Phone = ${phone}`);
            }
        }
        await browser.close();
    } catch (error) {
        console.log(`Our error is = ${error}`);
    }
})();

I am having trouble recording an element on a page after checking if it exists. The block of code I'm referring to is under the "// phone" ment.

This code loops through each section (section of sections) on the page and records "pany" and "phone." "Phone" may not be present in some sections so I figured I'd pass it through an if statement to check if it exists. This creates an error = "Error: failed to find element matching selector ".mn-contact-phone"" How do I solve this?

(async () => {
    try {
        const browser = await puppeteer.launch({ headless: true });
        const page = await browser.newPage();

        // loop through pages
        for (let pg = 1; pg < 5; pg++) {
            await page.goto("webpage");

            // record number of sections
            const sections = await page.$$("#mn-members-listings > div");

            // loop through each section
            for (const section of sections) {
                // pany
                let pany = await section.$eval(
                    "div.mn-searchlisting-title",
                    p => p.innerText
                );

                // phone --> THIS IF/ELSE THROWS AN ERROR
                if (section.$(".mn-contact-phone").length > 0) {
                    let phone = await section.$eval(".mn-contact-phone", phn => phn.innerText);
                } else {
                    let phone = "";
                }

                console.log(`Company = ${pany} | Phone = ${phone}`);
            }
        }
        await browser.close();
    } catch (error) {
        console.log(`Our error is = ${error}`);
    }
})();

• javascript
• async-await
• puppeteer

Share Improve this question Follow edited Jan 19, 2020 at 18:25 Rtroman14 asked Jan 19, 2020 at 16:57 Rtroman14Rtroman14 32833 silver badges1111 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

From puppeteer docs:

The method runs document.querySelector within the page. If no element matches the selector, the return value resolves to null.

1) null doesn't have length.

2) ElementHandle.$ returns a promise.

change the condition to:

if (await section.$(".mn-contact-phone"))

or if there are multiple elements:

if (await section.$$(".mn-contact-phone").length > 0)