Back to Practice

Shadow DOM in Iframe

Shadow DOM inside Iframe

This scenario requires traversing two boundaries: first switch to the Iframe, then traverse the Shadow DOM.

QA Automation Helper

Target IDsKey Element IDs

#pact1
#shadow-host
#destiny

Advance Testing Tips

  • Step 1: Switch to Iframe using driver.switchTo().frame('pact1').
  • Step 2: Locate the Shadow Host element (#shadow-host).
  • Step 3: Get Shadow Root (e.g. shadowHost.getShadowRoot() or Javascript executor).
  • Step 4: Find the button (#destiny) inside the Shadow Root.