如何在封闭的shadowDOM下自动执行网页

Question

部分网页处于封闭的影子根模式下。我们如何通过Selenium或javascript自动化它？

编辑： 我们可以在chrome：// inspect /＃apps中的阴影下看到DOM。这似乎是子DOM。 当我们的ShadowRoot DOM妨碍我们自动化时，是否可以在父DOM与上述子DOM之间进行通信以对子DOM执行操作？

Answer 1

简单的答案：您不能。

更复杂的答案：

覆盖Element.prototype.attachShadow函数以覆盖closed设置并将其强制为open。

或重写您的组件以不使用closed。这可以通过组件检查查询参数并在大多数情况下使用关闭状态并在测试模式下打开来完成。

更新

封闭的组件是一种尝试，旨在使组件创建者获得某种程度的安全性，其他人无法破坏其组件。尽管开发人员工具仍然可以看到内部，但外部代码则无法看到，除非该组件以某种方式公开了shadowRoot。

封闭的组件应该做什么，而不是公开其shadowRoot，而是提供足够的属性和功能，以允许组件的用户执行所需的所有操作。

考虑<video> element。它们与它的父元素HTMLMediaElement之间具有数十个属性，以及数十个函数和事件。该组件具有<video>的用户几乎可以执行的所有操作。

如果我们以这种方式编写组件，那么关闭就不成问题了。

有时候人们想测试Web组件的各个方面，但是他们实际上应该只专注于公共接口，而不必担心内部DOM。

如何测试<input>元素。在大多数情况下，您设置.value = "some value";或在change或input上添加事件监听器。

只要您的组件正确地暴露了能够对其进行测试所需的一切，那么关闭组件就不再是问题。