有一个if语句不起作用的each()

时间:2019-05-24 21:32:57

标签: javascript cypress

问题

我只希望if逻辑中的命令在第三个默认按钮可见的情况下发生,但是会引发错误,指出其父级具有可见的css类:隐藏。当您需要删除该状态时,第三个默认按钮将变为可见,因此我不确定为什么它没有通过。

期望的行为

我想要这样做,因此对于带下划线的每个州,请单击它们以取消选择它们。然后,if语句将照顾那些实际上需要删除的人,因为他们已经为他们填写了信息,因此,如果第三个默认按钮可见,即 remove 按钮,然后执行if语句中的代码,以确保其他默认按钮被隐藏,然后单击删除按钮。

代码

it('deletes all selected states', () => {
  cy.get('span[class*="css-ddft8r-StateText"]').each($el => {
    cy.wrap($el)
      .filter(':has(span[class*="css-1qkbmzm-Underline css-1x6iasc4"])')
      .click({ multiple: true });
    if (cy.get('[data-cy=default-buttons]').eq(3).should('be.visible')) {
      cy.get('[data-cy=default-buttons]')
        .eq(0)
        .should('be.hidden');
      cy.get('[data-cy=default-buttons]')
        .eq(2)
        .should('be.visible');
      cy.get('[data-cy=default-buttons]')
        .eq(3)
        .click();
    }
  });
});

2 个答案:

答案 0 :(得分:1)

  1. Cypress命令返回Chainer对象-它是内部Cypress实体,不能与条件语句一起使用,因为在if语句中始终将对象识别为true。 因此,请给jquery一个机会: if(Cypress.$('[data-cy=default-buttons]:contains("remove")').is(':visible')){ // do assertions cy.get('[data-cy=default-buttons]:contains("remove")').click({force: true}) // as parent is hidden, we can ommit click visibility check by passing force: true }
  2. *=正在检查属性是否包含传递的字符串的一部分,因此可以将选择器简化为: [class*="StateText"]
  3. 整个测试似乎是过度设计的,不能在每个周期和有条件的内部条件下正常使用。也许您甚至不需要检查每个元素的按钮并将断言移出循环。示例存储库会有所帮助。

答案 1 :(得分:0)

因此,我最终使用的解决方案实际上只是使用.each()而不是其中的if语句。我们发现我们可以在data-cy中使用三进制,因为那些css类是不稳定/不可靠的,并且不必写if语句。

我们大致这样做:

cy.get('[data-cy=example_data_cy]').each($el => {
//click on the state if it was selected to unselect it