访问影子DOM树

Question

Can't access to element inside shadow dom.

Screenshot demonstrating how it looks:

I've tried to use:

    WebElement root1 = DriverFactory.driver.findElement(By.tagName("downloads-manager"));       
    WebElement shadowRoot1 = expandRootElement(root1);

    WebElement root2 = shadowRoot1.findElement(By.cssSelector("iron-list"));
    WebElement shadowRoot2 = expandRootElement(root2);

    WebElement root3 = shadowRoot2.findElement(By.cssSelector("downloads-item"));
    WebElement shadowRoot3 = expandRootElement(root3);

    shadowRoot3.findElement(By.xpath("//div[@id='title-area' and contains(.,'Lviv')]/ancestor::div[@class='controls']/a[@id='preview']")).click();
 public WebElement expandRootElement(WebElement element) {
    WebElement ele = (WebElement) ((JavascriptExecutor) DriverFactory.driver)                
    .executeScript("return arguments[0].shadowRoot",element);
    return ele;}

In result:

org.openqa.selenium.NoSuchElementException: no such element: Unable to locate element: {"method":"css selector","selector":"downloads-item"}

Answer 1

You have written wrong please refer below code

By.tagName("iron-list")) By.cssselectorBy.tagName("#downloads-item"));

Answer 2

You can use below Xpath

.//*[@id='downloads-list']/downloads-item

or CSS selector

#downloads-list>downloads-item