javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > cypress e2e测试编写

cypress e2e测试编写注意点总结分析

作者:今天比昨天更好哦

这篇文章主要为大家介绍了cypress e2e测试编写注意点总结分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

不要认为cypress是同步的

不要认为cypress是以同步的方式执行,不要用const、let、var等去定义一个变量,随后调用它

const a = cy.get('a');
cy.visit('https://example.cypress.io');
// 在这里有可能拿不到a,因为cy.get是异步操作,应该在before()钩子函数中定义变量。
a.first().click();

尽量避免直接访问第三方

尽量避免直接访问第三方,因为第三方提供的访问API,返回的数据不可控,可能会发生改变;如果有这个需求,要使用cy.request()来调用第三方库的API。

登录需要注意的地方

登录在cypress上有些困难: 许多OAuth服务商会运行A/B两套方案,导致登录屏幕动态更改,从而导致自动化测试变得困难。另外,OAuth服务商会根据你的访问次数和频率来判断是否是机器人访问,如果一旦被认定不是真人操作,就会导致不好的结果。

解决方案

token存根,并在测试前带上token返回第三方,从而达到欺骗第三方已经登录的目的

避免测试用例之间的相互依赖

现在的test依赖于之前的test创造的环境,这是错误的写法。正确的写法应该是将之前test需要生成的结果写在before() 钩子中,每次都可以共享。

使用官方更加推荐的写法

比较以下两段代码的差异:

// 不好的写法
describe('my form', () => {
    beforeEach(() => {
        cy.visit('/users/new')
        cy.get('[data-testid="first-name"]').type('johnny')
    })
    it('has validation attr', () => {
        cy.get('[data-testid="first-name"]').should('have.attr', 'data-validation', 'required')
    })
    it('has active class', () => {
        cy.get('[data-testid="first-name"]').should('have.class', 'active')
    })
    it('has formatted first name', () => {
        cy.get('[data-testid="first-name"]').should('have.value', 'Johnny')
    })
})
// 推荐的写法
describe('my form', () => {
    beforeEach(() => {
        cy.visit('/users/new')
    })
    it('validates and formats first name', () => {
        cy.get('[data-testid="first-name"]').type('johnny').should('have.attr', 'data-validation', 'required').and('have.value', 'Johnny')
    })
})

为什么建议写成第二段代码那样?

集成测试和单元测试不同,你始终能知道失败的断言和位置在哪里。不用自己将其拆成一个个小的单元去测试哪段代码出问题。

避免写可能失败的代码

我们在做出数据请求后,希望等待数据响应后,再做接下来的操作。有可能会写成等待多少秒后再执行下一步的操作。但是,这里存在的问题是,

如果在既定的时间内并没有返回数据,就会导致测试失败。

正确的写法应该是给请求一个别名,并等待请求成功后,再做接下来的操作。

// 错误的写法
cy.intercept('GET', '/users', [{ name: 'Maggy' }, { name: 'Joan' }])
cy.get('#fetch').click()
cy.wait(4000) // 不要自己预计写死等待时间
cy.get('table tr').should('have.length', 2)
// 正确的写法
cy.intercept('GET', '/users', [{ name: 'Maggy' }, { name: 'Joan' }]).as('getUsers')
cy.get('#fetch').click()
cy.wait('@getUsers') // 正确等待数据请求回来
cy.get('table tr').should('have.length', 2)

以上就是cypress e2e测试编写注意点总结分析的详细内容,更多关于cypress e2e测试编写的资料请关注脚本之家其它相关文章!

您可能感兴趣的文章:
阅读全文