大家好，我是阿萨。昨天我们学习了Cypress默认文件结构。了解了一个cypress 自动化测试项目主要的文件结构，知道了什么内容应该放到什么位置了。也学会了写第一条测试脚本。但是实际的测试过程中，经常会写脚本的时候无法一次完成脚本。写脚本很简单，但是调试脚本让其达到自己的想要的效果，也非常重要，它比我们怎么写脚本更重要。类似我们会用工具很重要，但是工具没有按照我们期待的方式工作时，会调试工具，让其为我们服务才是更关键的本领。今天就给大家讲解下如何调试我们的脚本。今天主要给大家讲解2个关键字 pause 和debug.
一.pause
还是使用我们之前的login 页面。如果脚本老是失败，我们想看下提交之前用户名和密码都输入了吗，怎么办？先添加下pause
describe('Login', function(){ const username='Sarah' const password ='changeme_123' context('Test HTML Login Form',function(){ it('Login success',function(){ cy.visit('http://localhost:7077/login') cy.get('input[name=username]').type(username) cy.get('input[name=password]').type(password) //pause cy.pause() cy.get('form').submit() cy.url().should('include','/dashboard') cy.get('h1').should('contain',username) }) }) }) context('Test HTML Login Form',function(){ it('Login success',function(){ cy.visit('http://localhost:7077/login') cy.get('input[name=username]').type(username) cy.get('input[name=password]').type(password)//pause cy.pause() cy.get('form').submit() cy.url().should('include','/dashboard') cy.get('h1').should('contain',username) }) })})
然后运行下Runner. 右上角上显示 Resume 和Next
Resume就是 执行完后续的所有脚本。
Next 类似单步调试，一步一步地去执行所有脚本。可以单独调用pause。
cy.pause()
也可以命令行后面调用。
cy.get('form').pause().submit()
二. debug
我们还是拿之前的login的脚本来看。比如我们写的脚本,想要打印login 信息。
describe('Login', function(){ const username='Sarah' const password ='changeme_123' context('Test HTML Login Form',function(){ it('Login success',function(){ cy.visit('http://localhost:7077/login') cy.get('input[name=username]').type(username) cy.get('input[name=password]').type(password) //debug cy.debug() cy.get('form').submit() cy.url().should('include','/dashboard') cy.get('h1').should('contain',username) }) }) })
打开console，可以看到下方有debug Info
运行前打开 Console ，可以直接debug 我们的程序。
可以单独调用
cy.debug()
也可以在某一个命令之后写。
cy.get('a').debug().should('have.attr', 'href')
昨天的思考题答案：
- 在Support 文件夹里
- 在Fixture 的json 文件里。
今天的思考题：
- 单步执行脚本该怎么操作？
- 调试脚本该如何操作？
你学会了吗？如果觉得阿萨的内容对你有帮助，欢迎围观点赞。
