Cypress 片状测试答案

【问题标题】：Cypress flaky testingCypress 片状测试
【发布时间】：2021-10-30 00:09:00
【问题描述】：

我正在使用 Cypress 测试 this webhsop 的前端。有一个特定的测试只在这个租户上失败，而在其他租户上永远不会失败（不同国家有 5 个租户）。但这并不是一直失败，只是有时会失败，我不知道为什么会发生这种情况。

这是测试应该做的：

访问主页
访问产品页面
选择可用的尺寸
将产品放入购物车
重复步骤 2-4
检查购物车金额是否为“2”

问题：

购物车数量有时只有 1，我无法确定原因

我的假设：

我认为在访问第二个产品页面时会丢失购物车金额
这与不接受cookie有关（我不想接受cookie）

注意事项：

除了语言之外，所有其他租户都与我遇到问题的租户相同

这是测试：

describe('[anon] add to cart ' + baseUrl, () => {
  if (!features.shoppingCartFeature) return;

  const homepage         = new Homepage();
  const productpage      = new ProductPage();
  const shoppingCartPage = new ShoppingCartPage();

  const testProduct  = Cypress.env('testProduct');
  const testProduct2 = Cypress.env('testProduct2');

  beforeEach(() => {
    homepage.visit();
  });

  it('add to cart as anomymous user for 2 products', () => {
    productpage.visitProduct(testProduct.productID);
    productpage.add2Cart(true);

    productpage.visitProduct(testProduct2.productID);
    productpage.add2Cart(true);

   shoppingCartPage.checkCartAmount(2);
  });

});

这是产品页面

class ProductPage extends BasePage {
  visitProduct(id) {
    // intercept this api call, bc after the response the size selection is available
    cy.intercept(personalizeUrl).as('sizes');
    cy.visit(baseUrl + `/p/` + id);
    cy.wait('@sizes');
    return this;
  }

  add2Cart(has_size) {
    if (has_size) {
      this.pickSize();
      cy.get(selectors.pdp_add2CartBtn).click();
    } else {
      cy.get(selectors.pdp_add2CartBtn).click();
    }
    cy.checkForPopup();
  }

  /**
   * iterate over the dropdown menu and choose the first size that is not sold out
   */
  pickSize() {
    cy.get(selectors.pdp_chooseSizeBtn).click();
    cy.get(selectors.pdp_sizes).each(($size_elem) => {
      if (
        !$size_elem.text().includes(Cypress.env('soldOutText')) &&
        !$size_elem.text().includes(Cypress.env('onlyInShopText'))
      ) {
        cy.wrap($size_elem).click();
        return false; // has to return false to stop iterating
      }
    });
  }
}

提前谢谢！

【问题讨论】：

如果您的测试有时通过而有时没有通过，网络问题可能会发挥重要作用。

标签： typescript frontend cypress

【解决方案1】：

尝试在每次加载新页面时添加断言。这可以确保在测试继续之前页面已完全加载。基本上，当您导航到主页时，您可以说：

cy.contains('COOL SNEAKERS FOR COOL KIDS).should('be.visible)

对您导航到的每个新页面执行此操作，以便在测试继续之前知道该页面已完成加载。

【讨论】：