gpt4 book ai didi

angular - 在 Cypress 中关闭 Angular Material 对话框

转载 作者:太空狗 更新时间:2023-10-29 17:51:05 24 4
gpt4 key购买 nike

我正在使用 Angular Material 将 Cypress 添加到我的 Angular 6 项目中。欢迎新用户使用 Material Dialog(其中包含 iFrame),并通过在对话框外单击关闭对话框。

我尝试以多种方式在 Cypress 中关闭此对话框,并引入了等待和过度超时以确保它与网络加载问题无关:

cy.get('dialog-element', { timeout: 10000})
.wait(3000).click(-50, -50);

失败是因为它被 cdk-overlay-container 覆盖了。使用 click(..., { force: true } ) 没有帮助。尝试过

cy.get('.cdk-overlay-container', { timeout: 10000})
.wait(3000).click(-50, -50, { force: true });

这也没有帮助。该对话框不会被关闭并且连续点击不会起作用,即它在尝试进行时总是失败,例如

cy.get('[data-cy=element-on-page-beneath-dialog]').click();

调试时,我可以在对话框外看到将发生点击的红点,因此鼠标的位置不是问题。

编辑:根据要求编辑 Material Dialog HTML(注意宽度和高度足够小,因此对话框不会填满页面但会留下足够的空间,并且 src 具有真正的 Youtube 视频链接)

<div style="overflow: hidden;">
<iframe style="margin-top: 2px; overflow: hidden;" [width]="videoWidth" [height]="videoHeight" src="..." frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
<div>

最佳答案

它可能只是选择器。以下测试似乎工作正常,使用选择器 .cdk-overlay-backdrop 而不是 .cdk-overlay-container

describe('closing-an-angular-material-dialog-in-cypress', () => {

it('closes the dialog', () => {
cy.visit('https://material.angular.io/components/dialog/overview')
cy.contains('button', 'Pick one').click()
cy.get('.cdk-overlay-backdrop').click(-50, -50, { force: true });
})

})

关于angular - 在 Cypress 中关闭 Angular Material 对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53854954/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com