Cypress将鼠标悬停在名为&Quot;Automation&Quot;的菜单选项上

2022-03-13 00:00:00 css-selectors css cypress

我尝试使用以下命令将鼠标悬停在菜单选项(快照-它在自动选项卡下)上,但似乎不起作用:

cy.get('.menu.button.overlay_button.projects_popover').click(),
cy.contains('Automation').trigger('mousedown'),
cy.contains('Shots').trigger('mousedown').click()

Cypress有悬停选项吗?

我首先单击项目,然后转到自动化,然后单击快照。

另外,我不认为在柏树上有像这样的东西。我想把鼠标放在"自动化"选项卡上。我可以点击它,但我不能像硒一样悬停。请帮帮忙


解决方案

否,Cypress当前没有hover()命令。但是,这可能会在将来添加。

浏览器中有两种不同形式的悬停代码:

1)css通过:hover伪类设置样式 2)javascript通过mouseover/mouseout事件侦听器。

如果您的应用程序使用#1(css),则Cypress当前无法对其进行测试,因为它无法通过javascript解析伪CSS样式。

如果您的应用使用#2(javascript事件),您可以使用解决方法,手动触发mouseover/mouseout事件:

cy.get('.menu.button.overlay_button.projects_popover').click(),
cy.contains('Automation').trigger('mouseover'),
cy.contains('Shots').trigger('mouseover').click()

您的应用也可能正在侦听mouseenter/mouseleave事件,在这种情况下,您也可以触发这些事件。

相关文章