Chrome升级96后Selenium4调用JS获取shadow root报类型转换错误

问题根因 #

Chrome v96+ 升级后对齐了W3C WebDriver标准对Shadow DOM的实现规范，配合Selenium 4.x版本时，JavascriptExecutor执行JS返回shadowRoot时，不再返回WebElement类型实例，而是返回Selenium定义的ShadowRoot类型实例，底层用Guava的TransformedEntriesMap承载返回数据，因此强转为WebElement会抛出类转换异常。

解决方案 #

方案1：使用Selenium 4原生API获取ShadowRoot（推荐） #

Selenium 4.0已经内置了获取ShadowRoot的原生方法，无需手动编写JS脚本：

// 直接调用已有元素的getShadowRoot方法获取ShadowRoot实例
ShadowRoot shadowRoot = element.getShadowRoot();

// 后续可直接通过ShadowRoot查询其内部元素，用法和普通WebElement一致
WebElement innerEle = shadowRoot.findElement(By.cssSelector("目标元素选择器"));

方案2：调整JS执行后的强制转换类型 #

如果你需要保留JS执行的写法，只需把返回值的转换类型从WebElement改为ShadowRoot即可：

ShadowRoot shadowRoot = (ShadowRoot) ((JavascriptExecutor)driver).executeScript("return arguments[0].shadowRoot", element);

这里获取到的shadowRoot就是你需要的shadow root元素本身，可直接用于后续DOM操作。

补充说明 #

你之前修改的返回shadowRoot.children的写法是直接获取shadow root的子元素集合，自然无法拿到shadow root实例本身，以上两种方案都可以直接获取到shadow root对象，满足需求。

内容的提问来源于stack exchange，提问作者Dodge