microsoft/playwright · error · Error
No element matching ${selector}
Error message
No element matching ${selector} What it means
Thrown by Frame.resolveSelector() when selectors.query() returns null for the given selector string. This method resolves a selector to a full chain (including iframe traversal) and is used internally by MCP tools and locator resolution. It means no element in the frame matches the selector at query time.
Source
Thrown at packages/playwright-core/src/server/frames.ts:1314
return dom.assertDone(await this._retryWithProgressIfNotConnected(progress, selector, options, (progress, handle) => handle._tap(progress, options)));
}
async fill(progress: Progress, selector: string, value: string, options: types.CommonActionOptions) {
return dom.assertDone(await this._retryWithProgressIfNotConnected(progress, selector, options, (progress, handle) => handle._fill(progress, value, options)));
}
async focus(progress: Progress, selector: string, options: types.StrictOptions & { noAutoWaiting?: boolean }) {
dom.assertDone(await this._retryWithProgressIfNotConnected(progress, selector, options, (progress, handle) => handle._focus(progress)));
}
async blur(progress: Progress, selector: string, options: types.StrictOptions & { noAutoWaiting?: boolean }) {
dom.assertDone(await this._retryWithProgressIfNotConnected(progress, selector, options, (progress, handle) => handle._blur(progress)));
}
async resolveSelector(progress: Progress, selector: string, options: { mainWorld?: boolean } = {}): Promise<{ resolvedSelector: string }> {
const element = await progress.race(this.selectors.query(selector, options));
if (!element)
throw new Error(`No element matching ${selector}`);
const generated = await progress.race(element.evaluateInUtility(async ([injected, node]) => {
return injected.generateSelectorSimple(node as unknown as Element);
}, {}));
if (!generated)
throw new Error(`Unable to generate locator for ${selector}`);
let frame: Frame | null = element._frame;
const result = [generated];
while (frame?.parentFrame()) {
const frameElement = await frame.frameElement(progress);
if (frameElement) {
const generated = await progress.race(frameElement.evaluateInUtility(async ([injected, node]) => {
return injected.generateSelectorSimple(node as unknown as Element);
}, {}));
frameElement.dispose();
if (generated === 'error:notconnected' || !generated)
throw new Error(`Unable to generate locator for ${selector}`);View on GitHub (pinned to c8fc3bf8d3)
Solutions
- Use page.waitForSelector() or locator.waitFor() before resolving to ensure the element exists.
- Verify the selector is correct by testing it in browser DevTools: document.querySelector('your-selector').
- If the element is in an iframe, navigate the frame chain first or use frame.locator().
- Use Playwright's built-in locator APIs which auto-wait and retry instead of raw resolveSelector.
Example fix
// before
const result = await frame.resolveSelector('nonexistent-selector');
// after
await frame.waitForSelector('#my-element');
const result = await frame.resolveSelector('#my-element'); Defensive patterns
Strategy: validation
Validate before calling
// Wait for element before resolving selector
await page.waitForSelector(selector, { state: 'attached' });
// Now resolve is safe Try / catch
try {
await frame.resolveSelector(selector);
} catch (e) {
if (e.message.startsWith('No element matching')) {
await frame.waitForSelector(selector, { timeout: 5000 });
return frame.resolveSelector(selector);
}
throw e;
} Prevention
- Always waitForSelector before resolving or querying selectors.
- Prefer Playwright locators which auto-wait for elements to appear.
- Test selectors in DevTools before using them in tests.
When it happens
Trigger: Calling resolveSelector with a selector that matches no elements in the current DOM. This can happen when the element has not yet rendered, when the selector is malformed, or when the element is in a different frame than expected.
Common situations: Selector references a dynamically-rendered element that hasn't appeared yet. Typo or stale selector after a UI refactor. Element is inside an iframe but the selector was queried on the parent frame. Shadow DOM elements not reachable with the given selector engine.
Related errors
- Failed to find element matching selector "${selector}"
- Unable to generate locator for ${selector}
- Unsupported token "${unsupportedToken.toSource()}" while par
- Error while parsing css selector "${selector}". Did you mean
- Conflicting exactness in internal:role selector: ${stringify
AI-assisted analysis of microsoft/playwright@c8fc3bf8d3 (2026-08-12).
Data as JSON: /api/errors/dd213bd0017dc585.
Report an issue: GitHub.