Implementation:Puppeteer Puppeteer Injected TextContent

Property	Value
sources	`packages/puppeteer-core/src/injected/TextContent.ts`
domains	Injected Scripts, Text Matching, DOM Traversal
last_updated	2026-02-12 00:00 GMT

Overview

Description

The TextContent module provides logic for extracting and caching the text content of DOM nodes in a way that is aware of Shadow DOM, form element values, and elements unsuitable for text matching (such as <script> and <style> tags, or nodes within <head>).

The module exports:

isSuitableNodeForTextMatching(node) -- Filters out SCRIPT, STYLE, and <head>-contained nodes.
createTextContent(root) -- Recursively builds a TextContent object with two properties: full (the complete concatenated text of the node subtree including shadow roots) and immediate (an array of text segments that are direct children of the node).

Results are cached in a WeakMap and automatically invalidated via a MutationObserver that watches for childList, characterData, and subtree changes. For form elements (HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement) the value property is used instead of child text nodes, and an input event listener invalidates the cache on value changes.

Usage

This module runs in the browser page context and is primarily consumed by the TextQuerySelector module, which uses createTextContent to extract text for matching against text selectors (::-p-text).

Code Reference

Source Location

packages/puppeteer-core/src/injected/TextContent.ts (146 lines)

Signature

export interface TextContent {
  full: string;
  immediate: string[];
}

export const isSuitableNodeForTextMatching: (node: Node) => boolean;

export const createTextContent: (root: Node) => TextContent;

Import

import { createTextContent, isSuitableNodeForTextMatching } from '../injected/TextContent.js';
import type { TextContent } from '../injected/TextContent.js';

I/O Contract

isSuitableNodeForTextMatching

Direction	Name	Type	Description
Input	node	`Node`	Any DOM node to check
Output	result	`boolean`	`true` if the node is not a SCRIPT/STYLE and is not inside `document.head`

createTextContent

Direction	Name	Type	Description
Input	root	`Node`	The DOM node whose text content to compute
Output	result	`TextContent`	Object with `full` (complete text) and `immediate` (direct text segments)

Usage Examples

import { createTextContent, isSuitableNodeForTextMatching } from '../injected/TextContent.js';

// Check if a node is suitable for text matching
const div = document.querySelector('div');
if (div && isSuitableNodeForTextMatching(div)) {
  // Build text content for matching
  const textContent = createTextContent(div);

  // Full text includes all descendant text, including shadow roots
  console.log('Full text:', textContent.full);

  // Immediate text segments are direct text children only
  console.log('Immediate segments:', textContent.immediate);
}

// For a form input, the value property is used
const input = document.querySelector('input[type="text"]') as HTMLInputElement;
if (input) {
  const inputText = createTextContent(input);
  console.log('Input value as text:', inputText.full); // e.g., "Hello World"
}

Related Pages

Environment:Puppeteer_Puppeteer_Node_18_Runtime

Page Connections

Double-click a node to navigate. Hold to expand connections.

Principle

Implementation

Heuristic

Environment