3

I'm looking to access to the button but the CLOSED shadow DOM block me, how can i switch it to open and have access to this button ?

<div class="button-holder help-button-holder">
  #shadow-root (closed)
    <link rel="stylesheet" href="chrome-extension://mpbjkejclgfgadiemmefgebjfooflfhl/src/solve/solver-button.css">
    <button tabindex="0" title="Solve the challenge" id="solver-button"></button>
</div>
  • Does this answer your question? [How to automate shadow DOM elements using selenium?](https://stackoverflow.com/questions/55761810/how-to-automate-shadow-dom-elements-using-selenium) – vitaliis Apr 17 '21 at 19:03

2 Answers2

1

I have encounter the same problem and manager to work around it.

So the idea is to focus on the closest element before "shadow-root (closed)", then use Tab key to reach that solver button, then click it.

I work on Kotlin, but you should be able to attempt for python.

// click to focus on the solver button wrapper
driver.findElement(By.cssSelector(".button-holder.help-button-holder")).click()

// use Actions instead of pointing to the solver button itself
val actions = Actions(driver)
actions.sendKeys(Keys.TAB)
actions.click()
piusyikyu
  • 11
  • 2
0
def expand_shadow_element(element):
  shadow_root = driver.execute_script('return arguments[0].shadowRoot', element)
  return shadow_root

outer = expand_shadow_element(driver.find_element_by_css_selector(".button-holder.help-button-holder"))
inner = outer.find_element_by_xpath(".//button[@id='solver-button']")
inner.click()

You can do the following to click the element inside the shadow root.

Arundeep Chohan
  • 9,779
  • 5
  • 15
  • 32