如何模拟 window 在 Cypress.io 中失去焦点

Question

我正在使用 Cypress.io 为网站编写 E2E 测试。我想测试的功能之一是该站点正确检测到焦点丢失并显示 (angular material) 对话框。我遇到的问题是我找不到可靠的方法来触发 window 焦点丢失在测试环境中发生。我查看了 Cypress.io 中各种焦点和模糊事件的文档，但结果是空的。有谁知道是否可以通过编程方式从 Cypress.io 触发 window 焦点丢失（模糊），如果可以，是否有我可以遵循的文档或示例？

Answer 1

这取决于您的页面如何侦听此事件，因此有一些可能的解决方案：

尝试：

cy.window().trigger('blur')

如果还是不行，试试：

cy.document().then((doc) => {
  cy.stub(doc, "hidden").value(true)
})
cy.document().trigger('visibilitychange')

在某些情况下

Answer 2

我有同样的问题，但批准的答案对我不起作用。但是下面的代码没问题

cy.document().then((doc) => {
  cy.stub(doc, "visibilityState").value("hidden") //or "visible" if you want focus
})
cy.document().trigger('visibilitychange')

如何模拟 window 在 Cypress.io 中失去焦点

How to emulate window focus lost in Cypress.io

javascript

automated-tests

e2e-testing

angular

cypress