获取 Shadow DOM 中存在的元素的 xpath 的问题

Question

我正在使用机器人框架进行自动化，并想点击 Shadow Dom 上的元素打印按钮（请参阅附件图片获取 Html 代码）。我已经使用 js 路径创建了变量，但它不起作用。任何人都可以帮助找到元素的确切 xpath

*** 变量 ***

${铬} 铬

${打印} ${printIRCF1}

${JSPath}=  document.querySelector('print-preview-app').shadowRoot           
       ...  .querySelector('print-preview-sidebar')  
       ...  .querySelector('print-preview-button-strip').shadowRoot  
       ...  .querySelector('controls')  
       ...  .querySelector('action-button').shadowRoot

任何人都可以用正确的 JsPath 或 xpath 帮助我，以便我可以在我的代码中使用它

Answer 1

以下方法对我有用。

硒库

1. 在 Chrome 中，右键单击要交互的元素并选择“复制 > JS 路径”（在本例中，我想单击搜索按钮）

2。这是我的搜索按钮/图标的 JS 路径：

document.querySelector("body > pw-shell").shadowRoot.querySelector("app-header > div > paper-icon-button:nth-child(5)")

3.然后我用了

Execute JavaScript

关键字。像这样的东西：

${element}=     Execute JavaScript    return document.querySelector("body > pw-shell").shadowRoot.querySelector("app-header > div > paper-icon-button:nth-child(5)")

Click Element    ${element}

4. 这为我选择了搜索按钮/图标。

浏览器

1. 我使用了相同的 JS 路径并将它们与

   Click

   关键字组合

   Click    body > pw-shell >> app-header > div > paper-icon-button:nth-child(5)

在这种情况下，我个人更喜欢浏览器库。可以轻松地与 Shadow DOM 元素进行交互。

（一）https://marketsquare.github.io/robotframework-browser/Browser.html#Cascaded%20selector%20syntax

（b）https://marketsquare.github.io/robotframework-browser/Browser.html#Click