Question

我有一个加载指示器，需要在我断言之前等待消失。

我看到了一些使用以下内容的方法，但是它对我来说似乎不起作用，而且我也不希望它成为断言。 cy.get('element, {timeout: 10000}).should('not.exist);

有人有提示吗？

Answer 1

恕我直言，最干净的方法是不使用get来使用等待或超时，这有点反模式。

我建议使用Cypress waitUntil命令并使用类似以下内容的

 cy.waitUntil(function() {
  return cy.get('element').should('not.exist');

，或者根据应用程序代码，您可以使用not.visible。

Answer 2

加载微调器实现通常只是隐藏元素，而不是将元素从DOM中删除。因此，should("not.exist")对他们不起作用。

在这种情况下（如Diogo's answer已经暗示），

cy.get("element").should("not.be.visible")是正确的方法。

Answer 3

如果您特别需要等待，可以在断言之前使用cypress的wait()函数，并提供超时之前要等待的时间。

但是请注意，这是一种反模式，您可以在文档中找到

您几乎不需要等待任意时间。赛普拉斯总是有更好的表达方式。

也就是说，如果您的加载指示器绑定到某个网络请求，则可以在声明之前等待它们完成。这可以通过类似this的示例来实现：

// Wait for the route aliased as 'getAccount' to respond
// without changing or stubbing its response
cy.server()
cy.route('/accounts/*').as('getAccount')
cy.visit('/accounts/123')
cy.wait('@getAccount').then((xhr) => {
  // we can now access the low level xhr
  // that contains the request body,
  // response body, status, etc
})

可以找到here有关等待请求的更多信息。

此外，请确保您确实要使用.should('not.exist')而不是.should('not.be.visible')。

Answer 4

在很多情况下，Diogo Rocha的方法很重要，但是要确定图像已经消失，您需要遵循Philzen的建议。断言它不可见，并且测试回放将等待它消失。

当您计划拍摄屏幕快照或视觉快照时，这尤其重要，因为返回XHR请求并不一定意味着图像消失了。

Answer 5

.findByTestId('loading-spinner-data-testid').should('not.be.visible')

这对我来说是类似的情况。

截至"@testing-library/cypress": "^5.3.1",

只需确保为您的微调组件提供了data-testid属性。

<LoadingSpinner data-testid='loading-spinner-data-testid'>

Answer 6

像这样使用 cypress-wait-until：

cypress/support/commands.js：

import 'cypress-wait-until'

test.spec.js：

cy.waitUntil(() => cy.get('element').then($el => $el.length === 0))

如何等待元素在柏树中消失

6 个答案: