Implementation:Microsoft Playwright ElementHandleDispatcher
| Knowledge Sources | |
|---|---|
| Domains | Dispatcher, DOM |
| Last Updated | 2026-02-12 00:00 GMT |
Overview
Concrete tool for exposing server-side ElementHandle objects over the Playwright RPC protocol provided by the Playwright library.
Description
The `ElementHandleDispatcher` class extends `JSHandleDispatcher` and implements `channels.ElementHandleChannel` to bridge server-side `ElementHandle` objects to remote clients. It provides methods for DOM interaction: `ownerFrame` to get the containing frame, `contentFrame` for iframes, `getAttribute`, `inputValue`, `innerHTML`, `innerText`, `textContent` for querying, `isChecked`/`isDisabled`/`isEditable`/`isEnabled`/`isHidden`/`isVisible` for state checks, `boundingBox`/`screenshot` for visual information, `hover`/`click`/`dblclick`/`tap` for interaction, `fill`/`selectOption`/`setInputFiles`/`type`/`press` for input, and `querySelector`/`querySelectorAll`/`evalOnSelector` for nested queries. Static factory methods handle dispatcher creation and reuse.
Usage
Use ElementHandleDispatcher when the protocol layer needs to expose DOM element handles to Playwright clients for element-specific operations.
Code Reference
Source Location
- Repository: Microsoft_Playwright
- File: packages/playwright-core/src/server/dispatchers/elementHandlerDispatcher.ts
Signature
export class ElementHandleDispatcher extends JSHandleDispatcher<FrameDispatcher> implements channels.ElementHandleChannel {
_type_ElementHandle: boolean;
readonly _elementHandle: ElementHandle;
static from(scope: FrameDispatcher, handle: ElementHandle): ElementHandleDispatcher;
static fromNullable(scope: FrameDispatcher, handle: ElementHandle | null): ElementHandleDispatcher | undefined;
static fromJSOrElementHandle(scope: FrameDispatcher, handle: js.JSHandle): JSHandleDispatcher;
async ownerFrame(params: channels.ElementHandleOwnerFrameParams, progress: Progress): Promise<channels.ElementHandleOwnerFrameResult>;
async click(params: channels.ElementHandleClickParams, progress: Progress): Promise<void>;
async fill(params: channels.ElementHandleFillParams, progress: Progress): Promise<void>;
async screenshot(params: channels.ElementHandleScreenshotParams, progress: Progress): Promise<channels.ElementHandleScreenshotResult>;
// ... additional DOM interaction methods
}
Import
import { ElementHandleDispatcher } from '../server/dispatchers/elementHandlerDispatcher';
I/O Contract
Inputs
| Name | Type | Required | Description |
|---|---|---|---|
| scope | FrameDispatcher | Yes | Parent frame dispatcher scope |
| handle | ElementHandle | Yes | The server-side element handle to expose |
| params | various channel params | Yes | Method-specific parameters for DOM operations |
Outputs
| Name | Type | Description |
|---|---|---|
| frame | FrameDispatcher | The owning frame dispatcher |
| value | string / boolean | Attribute values, text content, or state check results |
| binary | Buffer | Screenshot data |
Usage Examples
import { ElementHandleDispatcher } from '../server/dispatchers/elementHandlerDispatcher';
const elementDispatcher = ElementHandleDispatcher.from(frameScope, elementHandle);
const { frame } = await elementDispatcher.ownerFrame({}, progress);
await elementDispatcher.click({ force: false }, progress);
const { value } = await elementDispatcher.getAttribute({ name: 'href' }, progress);