Puppeteer: Error: failed to find element matching selector '{value}'

ElementHandle.$eval cannot find the requested descendant selector.

Error message

Error: failed to find element matching selector '{value}'

{value} is replaced by the value shown in your error message.

How this error happens

ElementHandle.$eval queries descendants of that handle, not the entire document. A matching sibling is outside its scope.

The snippets use an open Puppeteer page named page.

await page.setContent(
    '<form id="form"></form><input id="email" value="[email protected]">'
);

const form = await page.$("#form");

await form.$eval(
    "#email",
    (input) => input.value
);

How to fix

Use the correct query root, or select the form that actually contains the field.

const email = await page.$eval(
    "#email",
    (input) => input.value
);

console.log(email);

Things to keep in mind

$eval does not wait for rendering. Wait for the field first if it is inserted asynchronously.

All Puppeteer errors