测试不在单独的 it{} 块中运行，但它们在单个 it{} 块中运行

Question

刚开始用 cypress 进行测试，我无法理解为什么测试不能像这样在单独的块中运行

    it('Validate that user is able to navigate to PDP of a product from PLP', () => {
    cy.xpath("//div[@class='collectionGrid__products']").xpath("//p[normalize-space()='Flight / Pre Workout']").click({force: true})
});

it('Validate that user is able to add product to cart by clicking ADD TO CART CTA button', () => {
    cy.get('.add-to-cart-btn > .button').click({force: true})
});

it('Validate that user is able to close cart drawer by clicking "x" button on top right of cart drawer', () => {
    cy.get('.sidebar__headerClose').click()
});

it('Validate that user is able to open cart drawer by clicking cart button on navbar', () => {
    cy.get('.header-extra__cartAnchor').click()
});

it('Validate that user is able to decrease product count using product quantity spinner', () => {
    cy.get('[aria-label="decrease quantity for Flight / Pre Workout"]').click()
});

但是当我像这样将它们组合在一起时，它可以作为一个单一的测试/功能场景

    it('Validate that user is able to navigate to SUPPLEMENT category PLP from navbar', () => {
    cy.visit("https://www.bareperformancenutrition.com")
    cy.get('.js-mega-menu > .nav__menu-link').click()
    cy.xpath("//div[@class='collectionGrid__products']").xpath("//p[normalize-space()='Flight / Pre Workout']").click({force: true})
    cy.get('.add-to-cart-btn > .button').click({force: true})
    cy.get('.sidebar__headerClose').click()
    cy.get('.header-extra__cartAnchor').click()
    cy.get('[aria-label="decrease quantity for Flight / Pre Workout"]').click()
    cy.get('.sidebar__headerClose').click()
});

我可以得到这方面的帮助吗？这真的很困扰我，因为它无法找到元素而抛出错误。

Answer 1

“测试”在技术上是一个

it()

函数调用，但您可以根据需要使用它们。

如果您想对每个步骤进行描述，创建单独的

it()

函数没有错。

您只需确保页面在每次调用时都处于正确状态。

例如，您可以在

beforeEach()

挂钩中设置页面，例如

beforeEach(() => {
  cy.visit("https://www.bareperformancenutrition.com")
})

context('with empty cart', () => {

  beforeEach(() => {
    cy.get('.js-mega-menu > .nav__menu-link').click()  // open cart
  })

  it('Validate that user is able to navigate to PDP of a product from PLP', () => {
    cy.xpath("...").xpath("...").click()
  })

  it('Validate that user is able to add product to cart...', () => {
    ...
  })

})

context('with items in cart', () => {

  beforeEach(() => {
    cy.get('.js-mega-menu > .nav__menu-link').click()  
    cy.xpath("...").xpath("...").click()
  })

  it('Validate that user is able to decrease product count using product quantity 
  spinner', () => {
    ...
  })
})