3

单击位于阴影根内部的元素时出现空指针异常（关闭）

试图用 Java Script 处理它：

public WebElement getShadowRootElement(WebElement element) {
    return (WebElement)
            ((JavascriptExecutor)
                    driver).executeScript("return 
arguments[0].shadowRoot", element);
}

在此处输入图像描述

结果：

Cannot read property 'shadowRoot' of null

添加截图： 1.在此处输入图像描述

在此处输入图像描述

4

3 回答 3

4

<path>如果您的用例是与标签内的元素交互<svg>，则确实在#shadow-root (closed).

@hayatoito（Shadow DOM 的创建者）在此评论中明确提到：

引入封闭阴影树的最初动机是"Never allow an access to a node in a closed shadow tree, via any APIs, from outside"AFAIK。像这样，我们无法访问<video>元素中使用的内部隐藏阴影树中的节点，在 Blink 中。

事实上，我就是这样设计了一个封闭的阴影树。如果有办法访问封闭影子树中的节点，则应将其视为规范的错误。

我认为拥有一个 API 来允许在 Chrome 应用程序或扩展程序层进行访问是完全可以的。但是，对于一个普通的网络应用程序，我认为当前的协议是"Never allow it".

如果我们允许它，这意味着我们不需要封闭的影子树。我认为，只要有一棵开放的影子树就足够了。

WebDriver 视角

最近，@AutomatedTester [David Burns，首席培根官，Mozilla Corporation] 发起了关于WebDriver - Web 组件的可测试性的讨论

目前Selenium 团队已开放接受相同的拉取请求。

奥特罗

在这里您可以找到有关如何使用 selenium 自动化影子 DOM 元素的相关讨论？

于 2019-06-07T21:39:22.530 回答
1

这是解决方案。

WebElement closeElement = (WebElement) js.executeScript("return document.querySelector('button[title='Close Order Status'] svg use').shadowRoot.querySelector('svg path')");
closeElement.click();

快速查找路径的方法

只需提供屏幕截图，即可了解如何找到路径。（仅供参考，此屏幕截图适用于 chrome 清除历史记录中的清除数据按钮） 在此处输入图像描述

于 2019-06-07T20:35:33.553 回答
0

您可以使用类似这样的javascript。

WebElement clearData = (WebElement) js.executeScript("return document.querySelector('button[title='Close Order Status'] svg use').shadowRoot.querySelector('svg path')");

检查如何通过 cssSelector链接定位 #shadow-root (open) 元素以获取更多信息。

于 2019-06-07T19:42:55.173 回答