如何在 Cypress 中使用不同的夹具运行相同的测试？答案

【问题标题】：How to run the same test with different fixtures in Cypress?如何在 Cypress 中使用不同的夹具运行相同的测试？
【发布时间】：2019-09-19 18:37:34
【问题描述】：

我正在尝试对显示在两个单独页面上的组件运行完全相同的赛普拉斯测试。为了实现这一点，我想我会使用forEach 声明以便为每个“状态”运行相同的代码（参见下面的代码）。

问题在于before 语句中的代码块开始为状态#2 运行，在状态#1 的测试完成之前。这会导致状态 #1 的测试失败（因为它有状态 #2 固定装置）。

如何使状态#2 的before 部分等待状态#1 中的所有测试完成？

const states = [
  { 
    "startPath": "/path1", 
    "fixture": "fixture1"
  },
  { 
    "startPath": "/path2", 
    "fixture": "fixture2"
  }
]

describe('Start test', function() {

  // Loop through both test
  states.forEach((state) => {

    // In this before statement the fixtures are setup
    before(function () {
      cy.flushDB()
      cy.fixture(state.fixture)
        .then(fixtureData => {
          new Cypress.Promise((resolve, reject) => 
            cy.createCollections(fixtureData, resolve, reject)
          )
        })
        .then(() => cy.visit(state.startPath)) 
    })
    
    context('Within this context', function() {
      it(`Can run some test for fixture ${state.fixture}`, function() {
        
      })
    })
  })
})

【问题讨论】：

标签： javascript cypress

【解决方案1】：

找到了解决方案：我不得不将它包装到另一个 describe 代码块中，然后它就起作用了：

const states = [
  { 
    "startPath": "/path1", 
    "fixture": "fixture1",
    "context": "1"
  },
  { 
    "startPath": "/path2", 
    "fixture": "fixture2",
    "context": "2"
  }
]

describe('Start test', function() {

  // Loop through both test
  states.forEach((state) => {

    // SOLUTION HERE
    describe(state.context, () => {
  
      // In this before statement the fixtures are setup
      before(function () {
        cy.flushDB()
        cy.fixture(state.fixture)
          .then(fixtureData => {
            new Cypress.Promise((resolve, reject) => 
              cy.createCollections(fixtureData, resolve, reject)
            )
          })
          .then(() => cy.visit(state.startPath)) 
      })
      
      context('Within this context', function() {
        it(`Can run some test for fixture ${state.fixture}`, function() {
          
        })
      })
    })
  })
})

【讨论】：

【解决方案2】：

第三种方法可以针对一个测试循环给定夹具的数据集。夹具中的每个数据集都将注册为自己的测试。

集成/example_spec.js

const examples = require('../../fixtures/examples');
// `examples` contains the full contents of the fixture

describe('Using `require`', function () {
    examples.forEach((example) => {
        it('gets its data from a fixture', function () {
            // Do something with each example
        });
    });
});

fixtures/examples.json

[
    {
        "name": "Iteration 1"
    },
    {
        "name": "Iteration 2"
    }
]

见：https://github.com/cypress-io/cypress/issues/3963#issuecomment-483581934

【讨论】：

【解决方案3】：

我可以建议一种稍微不同的方法吗？您可以将测试放在自定义命令中并在测试中重用它。你最终会得到这样的结果：

const states = [
  { 
    "startPath": "/path1", 
    "fixture": "fixture1"
  },
  { 
    "startPath": "/path2", 
    "fixture": "fixture2"
  }
]

Cypress.Commands.add('testcase', function() {
  // steps which you want to perform in both scenarios
})

describe('Start test', function() {
  states.forEach((state) => {
    it('first scenario', function() {
      cy.flushDB()
      cy.fixture(state.fixture)
        .then(fixtureData => {
          new Cypress.Promise((resolve, reject) => 
          cy.createCollections(fixtureData, resolve, reject)
          )
        })
        .then(() => cy.visit(state.startPath))
        cy.testcase()
    })
  })
})

【讨论】：

这确实解决了问题，但是使用嵌套测试（it 语句中的 it 语句）会导致其他不必要的复杂性。我想出了一个解决方案。
您的解决方案是什么？您可以发布它，但您自己的答案除外。这对社区非常有用

【解决方案4】：

在具有多个数据而不是存根 API 的单个夹具 JSON 中完美地为我工作

describe('Test Single Input Field Form', function() 之前声明：

const testData = require("../../fixtures/multipleInputFields.json")

然后

testData.forEach((data) => {
  const message = data.message
  it("Test Case", function () {
    cy.log("data is:" + data)
    cy.get("#user-message").type(message).should("have.value", message)
    cy.get("#get-input > button").click()
    cy.wait(200)
    cy.get("span#display").should("have.text", message)
  })
})

【讨论】：