Cypress使用手把手教你写第一个测试用例

创始人

2025-05-29 06:34:04

Cypress安装完后，见安装方法：Cypress安装手把手教你_测试狂人的博客-CSDN博客

有些同学安装后不知道如何去编写脚本，现在手把手教你如何操作，根据我下面的步骤一步步执行。

具体操作

打开后会出现下图所示，开始的时候是“Not Configure”，现在是 “Configure”，点进去下一步：

ps“”如果您不确定自己想要哪种类型并且只想继续您的测试之旅，现在只需选择E2E - 您以后可以随时更改它！

默认下一步就来到此地方，选择谷歌浏览器：

此时你会好奇脚本在那里写？

打开你的IDE，我用的是VScode，打开你的项目，就是安装下载那个，我的在

项目如图：

这是默认的脚本区

1.编写脚本

2.执行打开

3.自动弹出。点击那个脚本test.cy.js：

运行结果右侧绿色的代表通过：

如果错误的脚本，如图，地址改下

它的报错，会提示你脚本哪里不对。

参考别人的完全脚本：Cypress基础入门 - 爱码网

describe('我的第一个测试',function(){it('百度测试用例:',function(){cy.visit('http://www.baidu.com') //访问urlcy.title().should('contain','百度一下，你就知道')   //验证页面 title 是否正确cy.get('#kw').type('python')       //根据 css 定位搜索输入框.should('have.value','python')  //验证关键字自动是否展示正确cy.get('#su').click()   //根据 css 定位搜索按钮并点击cy.url().should('include','wd=python')     //验证目标url 是否正确包含关键字cy.title().should('contain','python_百度搜索')  //验证页面 title 是否正确cy.get('[]').should('contain','python')    // 验证第一个结果中是否包含TesterHomecy.screenshot()})
})