如何使用 cypress 验证空字段：答案

【问题标题】：How can I validate empty fields with cypress:如何使用 cypress 验证空字段：
【发布时间】：2021-02-19 17:35:01
【问题描述】：

我已经有一个方法可以验证他们何时有一些信息，但是当没有任何信息时它就会崩溃

Cypress.Commands.add('selectedFilterPlan', (filterId, idComponentList) => {
  cy.get(filterId).should('be.visible');
  cy.get(filterId).should('have.value', '');
  cy.get(filterId)
  .then((selects) => {
    let select = selects[0];
    cy.wrap(select).click();
      if(cy.get(idComponentList).should("be.visible")){
        cy.get(idComponentList)
        .get("nz-option-item")
        .then(function(item) {
        cy.wrap(item[0]).click();
        cy.wait(500);
        cy.get("[data-cy=result-filter-list]").should("be.visible");
        });
      }
 });
});

    it('select dropdown plan filters', () => {
      cy.selectedFilterPlan('[data-cy=id-filter-1]', "#cdk-overlay-1");
      cy.selectedFilterPlan('[data-cy=id-filter-2]', "#cdk-overlay-2");
      cy.selectedFilterPlan('[data-cy=id-filter-3]', "#cdk-overlay-3");
      cy.selectedFilterPlan('[data-cy=id-filter-4]', "#cdk-overlay-4");
      cy.selectedFilterPlan('[data-cy=id-filter-5]', "#cdk-overlay-5");
    });

我想创建一个方法来验证并在下一个字段为空时传递给它

enter image description here

【问题讨论】：

标签： angular user-interface testing filter cypress

【解决方案1】：

在您的自定义命令中，您在 if 语句中使用了 cy.get(idComponentList).should("be.visible")，但是，在您的情况下，应该（）产生相同的主题，idComponentList。它不返回布尔值。在 cypress 文档中明确指出 cypress 不适合条件测试。

如果你真的需要检查一个元素的存在，你可以使用：Cypress.$('your_locator').length，它将返回 DOM 中存在的元素数量，即

if(Cypress.$(idComponentList).length !== 0)

或者为了可见性，您可以使用 Cypress.dom 方法：

cy.get(idComponentList).then($el => {
  Cypress.dom.isVisible($el) // true if visible
})

希望对你有用。

【讨论】：