向输入添加一个新的随机值，然后断言该值已在赛普拉斯中更新

Question

我正在使用一个包含大量数据输入的仪表板。用户可以编辑任何输入字段数据，我正在尝试测试该功能。

我运行遇到的麻烦是，如果我有一个函数 generateRandomString() 可以为我的编辑提供新的个人数据，我如何检查该值是否正确 passed/updated?

使用下面的代码，我不能很好地执行 .contains() 检查和运行相同的功能，因为它会有所不同。

有没有办法捕获函数生成的任何内容，然后保存它以便我可以在 .contains() 检查中断言更改？

任何提示或指示将不胜感激！

干杯！

cy.get('[data-cy=station-form-name]')
      .click()
      .clear()
      .type(generateRandomString())
cy.get('button:contains("Create")').click()
// check if the name has been updated
cy.get('[data-cy=station-details-name]').contains(generateRandomString())

Answer 1

您可以使用faker.js生成随机数据。

要安装，请使用命令 npm install @faker-js/faker --save-dev。
您的代码应如下所示：

const faker = require('faker')

describe('Test Suite', () => {

  it('Test Case', () => {
    var randomNumber = faker.random.number()
    cy.get('[data-cy=station-form-name]').click().clear().type(randomNumber)
    cy.get('button:contains("Create")').click()
    // check if the name has been updated
    cy.get('[data-cy=station-details-name]').contains(randomNumber)
  })
})

对于上面的例子，我选择了随机数，但是如果你愿意，你也可以从这个list中得到其他随机的东西。

Answer 2

您可以将随机字符串值存储在 Cypress 环境变量中，稍后再引用它。

// generateRandomString function
const generateRandomString = () => {
// code to generate string
Cypress.env('randomString', myRandomString)
return myRandomString
}

// Cypress test
cy.get('[data-cy=station-form-name]')
      .click()
      .clear()
      .type(generateRandomString())
cy.get('button:contains("Create")').click()
// check if the name has been updated
cy.get('[data-cy=station-details-name]').contains(Cypress.env('randomString'))

如果走这条路，您可能想在 beforeEach 或 afterEach 中添加一些内容来清除该环境变量。

Answer 3

先生成字符串

const myString = generateRandomString()

cy.get('[data-cy=station-form-name]')
      .click()
      .clear()
      .type(myString)
cy.get('button:contains("Create")').click()
// check if the name has been updated
cy.get('[data-cy=station-details-name]').contains(myString)

向输入添加一个新的随机值，然后断言该值已在赛普拉斯中更新

Adding a new random value to an input and then asserting that value has been updated in Cypress

cypress

cypress-testing-library