Browser Automation

Frames, Shadow DOM & Scoping

Frames, Shadow DOM & Scoping

In Shadow Dom

Scope subsequent selectors to inside a shadow DOM.

Scope subsequent selectors to inside a shadow DOM.

Switches the document context into the matched element's shadow root, so that following selectors are evaluated within that shadow tree. Implemented across IBrowser, RESTClient/OttoMagicClient, MagicHelper, PuppeteerClient, and PuppeteerCommunicator - the same engines that implement in-iframe. Use InMainDom() to return to the top-level document.

TIP

Nesting is supported - each subsequent InShadowDom searches from within the current shadow root. The initial host selector may be XPath, but once inside a shadow root, nested selectors must be CSS.

Examples

GPAL Fluent: High-level fluent C# API

browser .InShadowDom(shadowHostSelector) .WithSelector(shadowChildSelector) .GetGrid(out var results); browser.InMainDom();

MagicHelper: MagicHelper utility library

GPAL.MagicHelper.InShadowDom("#shadow-host");

Puppeteer Client: Puppeteer-style C# client

browser.PuppeteerClient.InShadowDom("#shadow-host").Execute();

Puppeteer Communicator: Low-level communicator

//At the CDP level, InShadowDom resolves the backend node id to its shadow root and switches subsequent queries into that context.

var elem = await browser.PuppeteerCommunicator.QuerySelector("#shadow-host"); await browser.PuppeteerCommunicator.InShadowDom(elem.ElementBackendNodeId, sessionId);

REST Client: Direct REST/HTTP client

//Internally maps to WithEndpoint(ApiEndpoint.SwitchToShadowRoot).WithElementId(selector).

GPAL.OttoMagicClient.InShadowDom("#shadow-host").Execute();

On this page

Frames, Shadow DOM & Scoping
In Shadow Dom
  • Examples