如何使用cypress与打印版面交互

我有一个打印按钮，点击按钮显示打印布局。如何使用cypress与“打印”布局交互。我想在这里检查几件事：

cypress版本：3.5.0（最新）

下面是我的cypress测试，但未能识别

CypressError:超时重试：应查找元素：“打印预览应用”，但从未找到它。

context('Print button tests', () => {
            it.only('Print action displays correct data', () => {
                cy.get('.timetable-filter-panel-button.btn.btn-primary > span')
                    .contains("Print current view")
                    .click();
                cy.get('print-preview-app').find('#sidebar').find('#header').find('#headerContainer').find('h1').contains("Print")

            })
        })

---

这是我测试一个按钮的代码，该按钮调用打开打印对话框的

window.print（）

方法

我使用

stub

，因为它会阻止实际的打印方法，并记录发生的情况。另一个选项是

spy

，它记录方法调用，但“通过”，因此实际调用将发生

Cypress.Commands.add（'wasCalled'，（stubOrSpy）=>{
expect（stubOrSpy）.to.be.call；
})
它（`should call Print dialog`，（）=>{
/*注意：无法在其外部存根（）*/
让打印存根
cy.window（）.then（win=>{
printsub=cy.stub（win，'print'）
cy.contains（selectorForPrintButton，'Print'）。单击（）；
cy.wasCalled（打印存根）
})
})

我刚刚添加了一个小命令

cy.wasCalled（）

，因为（从文档中）测试存根的唯一方法似乎是使用

expect（…）

表达式

在测试中按顺序使用

expect

在某些场景中可能会出现问题，因为据我所知，

expect

是同步的，因此可能会在前面的

cy

命令完成之前触发（例如调用动画的

click（）

）

通过将其放入自定义命令中，

expect

有效地添加到命令链中。我可能误解了这里的某些内容，但除了模式

expect（stub）.to.be.called

之外，找不到任何官方的Cypress示例

---

如果您想实际打开打印对话框，然后关闭它，您可以通过在文档上键入{esc}来完成，可能是

cy.document（）.type（{esc}）

。我还没试过这个不起作用

如果我们假设打印对话框是另一个窗口，那么这个答案表示您不能与它交互

但是，它确实显示了如何正确地测试存根是否被调用（请参见上面的注释）

cy.window（）.its（'print'）.should（'be.called'））

这是标准的chrome打印对话框-为什么要测试它？我肯定谷歌的开发者已经有了。@RichardMatsen我们在网页上有一个“打印”按钮，我有一个自动化任务来检查它是否显示打印对话框/窗口。然后关闭对话框。因为在点击打印按钮后，对话框仍然保持打开状态，其他规格的测试失败，因为对话框位于窗口顶部。我不打算检查对话框中任何与打印相关的功能。不过这是我的第一个问题，现在尝试在窗口打开后关闭

打印

。是的，我看到了另一个问题。它给出了以下错误

CypressError:cy.type（）失败，因为它需要DOM元素。收到的主题是：>

哪一位导致了这种情况？当尝试使用

cy.document（）.type（{esc}）关闭打印对话框时，

Ok，这是最重要的内容。让我想想。我发现只有在我将代码

cy.wasCalled（printStub）

放入

中，然后在调用“打印”按钮后，

块中，代码才起作用。否则，窗口上的打印事件在“expect”检查之前尚未发生。

2) Click on the `Cancel` button: please see the html image below 

context('Print button tests', () => {
            it.only('Print action displays correct data', () => {
                cy.get('.timetable-filter-panel-button.btn.btn-primary > span')
                    .contains("Print current view")
                    .click();
                cy.get('print-preview-app').find('#sidebar').find('#header').find('#headerContainer').find('h1').contains("Print")

            })
        })