如何单击阴影内的按钮 Cypress.io

问题描述

我正在使用 cypress.io,我需要单击 shadow-root 中的一个按钮。

Code HTML

我需要点击是按钮。

我该怎么做?

解决方法

您可能想使用按钮文本而不是类来选择您想要的按钮。

同一个类 .buttons-confirmation 出现在两个按钮上,因此当您选择它时,您将获得两个按钮。

cy.get('base-confirmation')
  .shadow()
  .contains('button','Yes')
  .click();
,

您可以简单地将 { "includeShadowDom" : true } 与其他属性一起添加到您的 cypress.json 文件中,然后像单击常规元素一样单击该元素

cy.get('base-confirmation')
  .contains('button','Yes')
  .click();
,

您可以使用 .shadow() 遍历 shadow dom 并对所需元素执行操作。

如果您想点击按钮:

cy.get('base-confirmation')
  .shadow()
  .find('.modal-content')
  .find('.content-confirmation')
  .find('.base-confirmation')
  .find('.buttons-confirmation')
  .click()

如果您想点击按钮:

cy.get('base-confirmation')
  .shadow()
  .find('.modal-content')
  .find('.content-confirmation')
  .find('.base-confirmation')
  .find('.buttons-confirmation.cancelBtn')
  .click()