我希望能够单击复选框,并测试元素不再在Cypress的DOM中。有人能建议你怎么做吗?

// This is the Test when the checkbox is clicked and the element is there

cy.get('[type="checkbox"]').click();
cy.get('.check-box-sub-text').contains('Some text in this div.')

我想做与上面的测试相反的事情。

所以当我再次点击它的div类复选框子文本不应该在DOM。


当前回答

你也可以在元素体或元素的父容器内查询匹配的元素,然后对其长度做一些断言:

cy.get("body").find(".check-box-sub-text").should("have.length", 0);

其他回答

如果没有元素,我们可以使用简单的行:

cy。get (' [type = "复选框“]”)。should(“not exist。”)

cy.get('[data-e2e="create-entity-field-relation-contact-name"]').should('not.exist');

可能会导致一些错误的结果,因为一些错误消息被隐藏了。也许用起来更好

.should('not.visible');

那样的话。

以防有人遇到这个问题,我有一个问题,既。should('not.exist')也。should('have.)。length', 0)工作-更糟糕的是:如果我正在查询的元素实际上从一开始就在那里,两次断言仍然返回true。

在我的例子中,这导致了一个非常奇怪的情况,这三个断言,一个接一个地执行,是正确的,即使断言1+2和3相互矛盾:

cy.get('[data-cy="foobar"]').should('not.exist')
cy.get('[data-cy="foobar"]').should('have.length', 0)
cy.get('[data-cy="foobar"]').should('have.text', 'Foobar')

经过大量测试后,我发现这只是一个竞态条件问题。在运行上述3行之前,我正在等待一个后端调用。像这样:

cy.wait('@someBackendCall')
cy.get('[data-cy="foobar"]').should('not.exist')

然而,一旦后端调用finished, Cypress立即运行前两个断言,并且它们都仍然为真,因为DOM还没有根据后端数据重新呈现。

我在一个我知道在任何情况下都会在那里的元素上添加了一个显式的等待,所以我的代码现在看起来像这样:

cy.wait('@someBackendCall')
cy.get('[data-cy="some-element"]').should('contain', 'I am always here after loading')
cy.get('[data-cy="foobar"]').should('not.exist')

使用.should('not.exist')来断言元素在DOM中不存在。


不要用not。可见的断言。它会错误地通过< 6.0,但现在正确地失败:

// for element that was removed from the DOM
// assertions below pass in < 6.0, but properly fail in 6.0+
.should('not.be.visible')
.should('not.contain', 'Text')

迁移文档:迁移到cypress -6-0

你也可以在元素体或元素的父容器内查询匹配的元素,然后对其长度做一些断言:

cy.get("body").find(".check-box-sub-text").should("have.length", 0);