How to automate closed shadow root elements using Selenium?

Sanjay Kumar
Dec 19, 2021

--

Automate Closed Shadow DOM

As per W3C standard (reference MDN),

“When the mode of a shadow root is “closed“, the shadow root’s implementation internals are inaccessible and unchangeable from JavaScript.”
Checkout this page for closed shadow dom example.

But there are some work around to perform action on closed shadow root elements.

One of the workaround to automate closed shadow root elements by using the Actions class in Selenium-

  • Locate the closest element which is outside closed shadow root. It could be the host element for that shadow root.
  • Now focus on this outside element by using click() method.
  • Now use Actions class to press the TAB key to focus on the closed shadow root element.
  • Now use Actions class to perform any action on the closed shadow dom element like sendKeys() or click() etc.

For real time example please refer the below video:

--

--

Sanjay Kumar
Sanjay Kumar

Written by Sanjay Kumar

Founder and Creator of SelectorsHub, TestCase Studio, TestCaseHub & ChroPath | Speaker | Blogger | Automation Passionate