我在使用Chrome开发工具时,通过在元素标签页上的cmd+f搜索栏来验证CSS选择器是否有效并能够被找到,以便在使用Playwright(或Puppeteer)编写E2E测试时进行检查。但是如何找到shadow-root内部的选择器呢?请注意:这个选择器可以通过代码找到,我只是无法在DevTools中找到它。以下是示例图片: 和 。
使用shadowRoot可以分为两个阶段来完成。 首先将具有影子DOM的元素分配给一个常量,然后使用querySelector来定位影子内部的元素。 const element = document.querySelector('wc-article-editor'): element.shadowRoot.querySelector('.myclass');