2

我正在尝试使用 cypress 自动化文本提交表单。即使在所有字段都已填写后，“创建学生”按钮也会被禁用

图片

请查看 cypress 错误

代码 ：

it('should be able to add a new student and update the details, remove from the class and delete the account', function () {
        cy.visit(
            'https://readingeggs.blake-staging.com/district_ui#/reading/manage-schools/students/195286/new'
        )
        cy.findByLabelText('First Name').type('ark')
        cy.get('#first-name').should('have.value', 'ark')
        cy.findByLabelText('Last Name').type('last')
        cy.get('#last-name').should('have.value', 'last')
        cy.get('[data-test-select-grade]').select('1')
        cy.get('#grade-dropdown').should('have.value', '1')
        cy.get('[data-test-select-teacher]').select('Lehner, Abbey')
        cy.get('#teacher-dropdown').should('have.value', '3068134')
    
        cy.get('[data-test-submit-new-student]').click()
        cy.get('#main')
            .findByRole('alert')
            .should('include.text', `Successfully created a student`)
    })
})
4

3 回答 3

2

请按照错误消息中的建议小心使用click({force:true})，您的测试现在可能会忽略另一个问题！

您可以首先尝试断言该按钮未被禁用。

有时测试可能运行得太快，并且在测试尝试单击之前网页尚未启用该按钮。

添加.should('not.be.disabled')将重试此检查最多 4 秒，这应该足以让页面完成更改。

cy.get('[data-test-submit-new-student]')
  .should('not.be.disabled')
  .click()
于 2022-02-13T07:37:06.460 回答
1

如果 using.should('not.be.disabled')不起作用（我同意，这应该是首先尝试的），请尝试向每个输入添加触发事件 - 以防.type()命令未触发验证更改。

cy.findByLabelText('First Name').type('ark').trigger('change')
cy.get('#first-name').should('have.value', 'ark')

cy.findByLabelText('Last Name').type('last').trigger('change')
cy.get('#last-name').should('have.value', 'last')

cy.get('[data-test-select-grade]').select('1').trigger('change')
cy.get('#grade-dropdown').should('have.value', '1')

cy.get('[data-test-select-teacher]').select('Lehner, Abbey').trigger('change')
cy.get('#teacher-dropdown').should('have.value', '3068134')
    
cy.get('[data-test-submit-new-student]').click()

如果仍然没有快乐，请使用.click({force:true})

顺便说一句，cy.get('[data-test-select-grade]').select('1')看起来有点可疑。select 命令可以将显示值作为字符串，也可以将位置值作为数字。屏幕截图显示选择了“K”，所以我希望其中任何一个都可以工作

cy.get('[data-test-select-grade]').select(1)   // number passed

// or

cy.get('[data-test-select-grade]').select('K')  // string passed
于 2022-02-13T07:54:30.203 回答
0

一种选择是使用{force: true}with click()。

it('should be able to add a new student and update the details, remove from the class and delete the account', function () {
  cy.visit(
    'https://readingeggs.blake-staging.com/district_ui#/reading/manage-schools/students/195286/new'
  )
  cy.findByLabelText('First Name').type('ark')
  cy.get('#first-name').should('have.value', 'ark')
  cy.findByLabelText('Last Name').type('last')
  cy.get('#last-name').should('have.value', 'last')
  cy.get('[data-test-select-grade]').select('1')
  cy.get('#grade-dropdown').should('have.value', '1')
  cy.get('[data-test-select-teacher]').select('Lehner, Abbey')
  cy.get('#teacher-dropdown').should('have.value', '3068134')
  cy.get('[data-test-submit-new-student]').click({force: true})
  cy.get('#main')
    .findByRole('alert')
    .should('include.text', 'Successfully created a student')
})
于 2022-02-13T05:40:55.993 回答