Scrape iframes and shadow DOM

Identify the boundary

Standard CSS selectors do not cross into an iframe document or shadow root. Inspect the page structure before writing the selector.

Iframe selector

iframe:iframe .target

Select the iframe element first and add the :iframe boundary. Then manually append the selector for the target element inside the iframe in the selector input. For example, iframe#main:iframe .sku.

Shadow-root selector

.shadow-host:shadow-root .target

Select the shadow host first and add the :shadow-root boundary. Then manually append the selector for the target element inside the shadow root in the selector input. For example, my-component:shadow-root .sku.

Nested boundaries

Build the selector from the outer document towards the target. Test one boundary at a time with Element Preview.

Limitations

  • Cross-origin iframe restrictions or site security controls may prevent access.
  • Closed shadow roots are not generally available to page selectors.
  • Content may require JavaScript execution or a delay before the internal element exists.

Related