Implementation:Puppeteer Puppeteer Frame Evaluate

Knowledge Sources	Puppeteer Puppeteer API
Domains	Browser_Automation, Web_Scraping
Last Updated	2026-02-11 23:00 GMT

Overview

Concrete tools for executing JavaScript in the browser context and extracting data, provided by the puppeteer-core library.

Description

The Frame class provides evaluate() for general JavaScript execution, while Page provides $$eval() and $eval() for selector-scoped extraction. All methods execute JavaScript in the browser's context and transfer serializable results back to Node.js.

Usage

Call these methods after the page has loaded to extract data from the DOM.

Code Reference

Source Location

• Repository: puppeteer
• evaluate: packages/puppeteer-core/src/api/Frame.ts (lines 480-489)
• $$eval: packages/puppeteer-core/src/api/Page.ts (lines 1477-1489)

Signature

abstract class Frame {
  abstract evaluate<
    Params extends unknown[],
    Func extends EvaluateFunc<Params>,
  >(
    pageFunction: Func | string,
    ...args: Params
  ): Promise<Awaited<ReturnType<Func>>>;
}

class Page {
  async $$eval<
    Selector extends string,
    Params extends unknown[],
    Func extends EvaluateFunc<[Array<NodeFor<Selector>>, ...Params]>,
  >(
    selector: Selector,
    pageFunction: Func | string,
    ...args: Params
  ): Promise<Awaited<ReturnType<Func>>>;
}

Import

// Accessed through Page or Frame instance
const page = await browser.newPage();
const result = await page.evaluate(() => document.title);
const texts = await page.$$eval('p', els => els.map(e => e.textContent));

I/O Contract

Inputs (evaluate)

Name	Type	Required	Description
pageFunction	Function or string	Yes	JavaScript function to execute in the browser context
...args	Params	No	Serializable arguments passed to the function

Inputs ($$eval)

Name	Type	Required	Description
selector	string	Yes	CSS selector to match elements
pageFunction	Function	Yes	Function receiving matched elements as first argument
...args	Params	No	Additional serializable arguments

Outputs

Name	Type	Description
evaluate return	Promise<T>	Serialized return value from the browser function
$$eval return	Promise<T>	Serialized return value from the selector-scoped function

Usage Examples

Extract Page Title

const title = await page.evaluate(() => document.title);
console.log(title);

Extract Multiple Elements

const links = await page.$$eval('a', anchors =>
  anchors.map(a => ({
    text: a.textContent,
    href: a.href,
  }))
);
console.log(links);

Pass Arguments To Browser

const result = await page.evaluate(
  (x, y) => x + y,
  5,
  10
);
console.log(result); // 15

Extract Search Results (From Examples)

const puppeteer = require('puppeteer');

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://developer.chrome.com/');
// ... search interaction ...
const results = await page.$$eval('.gsc-result .gs-title', titles =>
  titles.map(t => t.textContent)
);
await browser.close();

Related Pages

Implements Principle

• Principle:Puppeteer_Puppeteer_Data_Extraction

Requires Environment

• Environment:Puppeteer_Puppeteer_Node_18_Runtime