javascript - Puppeteer: use function inside page.evaluate - Stack Overflow

admin管理员组

文章数量:1332973

I need to use a function inside page.evaluate with puppeteer. I use exposeFunction and I need to send the full Element to my function

I have a simple example:

const puppeteer = require('puppeteer');    

const myFunction = (content) => {
    console.log(content.outerHTML); // empty
}

(async () => {    
    const browser = await puppeteer.launch()     
    const page = await browser.newPage()  
    page.on('console', msg => console.log('PAGE LOG:', msg.text()));      

    const url =  "";

    await page.goto(url,{
        waitUntil: 'networkidle2'
    })

    await page.exposeFunction('myFunction', myFunction);

    const content = await page.$('.content')

    await page.evaluate( (content) => {    

        myFunction (content); // I need to send full Element

        //console.log(content.outerHTML); // here works fine
        //my_function (JSON.stringify(content)); // sends {}

    }, content )      
})()

I've tried to send with JSON.stringify / JSON.parse with no results.

I need to use a function inside page.evaluate with puppeteer. I use exposeFunction and I need to send the full Element to my function

I have a simple example:

const puppeteer = require('puppeteer');    

const myFunction = (content) => {
    console.log(content.outerHTML); // empty
}

(async () => {    
    const browser = await puppeteer.launch()     
    const page = await browser.newPage()  
    page.on('console', msg => console.log('PAGE LOG:', msg.text()));      

    const url =  "https://www.google.";

    await page.goto(url,{
        waitUntil: 'networkidle2'
    })

    await page.exposeFunction('myFunction', myFunction);

    const content = await page.$('.content')

    await page.evaluate( (content) => {    

        myFunction (content); // I need to send full Element

        //console.log(content.outerHTML); // here works fine
        //my_function (JSON.stringify(content)); // sends {}

    }, content )      
})()

I've tried to send with JSON.stringify / JSON.parse with no results.

• javascript
• puppeteer

Share Improve this question Follow edited Jul 13, 2024 at 14:55 ggorlen 57.5k88 gold badges112112 silver badges154154 bronze badges asked Jun 5, 2019 at 10:08 kurtkokurtko 2,12644 gold badges3232 silver badges4949 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

page.exposeFunction is limited to serialized data as the other answer already points out.

But you can define a function inside of the page.execute block. Be aware, that functions defined there will only be present in the browser environment and not inside your Node.js script.

Code sample

The following code implements the myFunction inside the evaluate function and can then be used below:

await page.evaluate((content) => {
    const myFunction = (content) => {
        return content.outerHTML;
    };

    const result = myFunction(content);
    return result; // or whatever you want to do with the result
}, content);

Short Answer: You cannot.

Long answer: You cannot send DOM elements outside browser via exposeFunction.

Moreover anything you send will be serialized, there cannot be any circular reference. NodeJS does not have a DOM.

So the solution is,

• either pass only the string and object without any circular reference,
• or use puppeteers ElementHandle to handle the elements. In your code, the content variable is a ElementHandle.

本文标签： javascriptPuppeteer use function inside pageevaluateStack Overflow