cypress 我们直接去Cypress的官网,根据教程我们先进入我们项目的根目录,执行npm install cypress --save-dev,在安装完成之后是没有任何的动静的,除了我们的package.json中会多一个版本号的记录,在这里我们根据指引在控制台中输入node_modules/.bin/cypress open这一条命令主要是让我们进入这个目录后去执行cypress的一个可执行文件,在等待片刻后页面上会弹出一个熟悉的控制台,在控制台中会有一个Alert,我们点击按钮got it 就可以看到我们项目的根目录中生成了一个cypress.json文件和一个Cpress的文件夹,在文件夹的intergration中会有一些默认写好的spec,这些用例是框架在找不到指定路径时就会默认生成这么一个目录去提供整体结构的示例的,在cypress\integration 文件夹下写测试用例,可根据情况分文件夹存放 然后我们在cypress.json中填入我们需要修改的信息
{
"projectId": "pza7eq",
"baseUrl": "http://localhost:3000",
"viewportHeight": 768,
"viewportWidth": 1366
}
然后我们在package.json的scripts项下面加一条启动命令:"test:e2e": 'cypress open',下次启动直接运行这条命令就可以了。然后根据我们修改后的json在我们希望的目录下创建一系列的文件,这样我们就可以愉快的在cypress\integration 文件夹下写用例了
describe('这里写用例的名字,分组使用', function() {
it('动作的名字,可以理解为二级分组', function() {
干嘛干嘛的写在这里
})
it('动作的名字,可以理解为二级分组', function() {
干嘛干嘛的写在这里
})
})
语法 | 释义 | 用法 | 备注 |
---|---|---|---|
cy.visit() | 访问一个路径 | cy.visit(URL) | |
cy.get() | 选择一个元素 | cy.get('.action-email') | 支持css选择器 |
cy.type() | 在所选输入中输入文本 | cy.type('输入的文本') | |
cy.pause() | 暂停 | 放在要断点调试的位置 | 暂停,以逐步测试 |
cy.debug() | 调试 | 放在要断点调试的位置 | 调试 |