Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

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>
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()
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.
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.