抱歉,您的浏览器无法访问本站

本页面需要浏览器支持(启用)JavaScript


了解详情 >

介绍

cypress dashborad的运行依托于官网,所以需要在本地配置你的projectId,并且运行的时候需要通过命令行来执行,且记录带上Record Keys。(尽管如此,实际体验下来,dashborad页面的网络响应速度还是非常快的。)

官方文档:https://docs.cypress.io/guides/dashboard/projects.html#Set-up-a-project-to-record

设置

1.创建cypress.json

或许你在前面已经创建过,在项目根目录下创建cypress.json文件。

2.生成projectId和record key

打开的你的cypress client,点击Runs

image.png

点击Set up a new project

image.png

projectname默认读的是你本地最上层文件夹目名称,可以不动。

下面可以选择你执行的记录查看权限,如果是比较私密的,公司里的建议设置为Private。

点击Set up project,帮你设置好了projectId,并且生成了record key。

image.png

记住这里的record key,下面会用到。

3.配置快捷执行参数

前面说了cypress是通过projectid和record key来对应权限的,执行的时候需要带上record key,官方提供了两种方式。

1)设置环境变量

在命令行执行,先export声明,然后再执行cypress run –record

1
2
export CYPRESS_RECORD_KEY=<record key>
cypress run --record

2)执行带参数

使用npm的应该都知道,很多前端工程有一些快速指令入npm run dev,npm run build之类,这边我们把cypress run也配置成这样,并且顺便把record key带上。

打开根目录下package.json,在scripts里加上下面两行。

1
2
"cy:run": "cypress run --record --key 此处设置为你的",
"cy:ci": "START_SERVER_AND_TEST_INSECURE=1 start-server-and-test start https-get://localhost:3030 cy:run"

image.png

查看Dashboard

命令行执行

在上面都配置好以后,打开命令行进入项目根目录。执行npm run cy:run。

可以看到读取了cases数量并准备执行了。

image.png

开始执行了,一些重要信息也都打印了出来。

image.png

任何时候都可以查看dashboard,不必要等执行结束再,执行中也可以查看实时的记录信息。

登陆dashboard查看结果

在客户端点击Settings,点击Record Key,点击Log In跳转到浏览器登陆,进行登陆

image.png

登陆后看到的界面是这样,可以看到右侧有你的项目。

image.png

一步步点进去。

image.png

看一下错误的case信息,可以看到断言失败了。

image.png

本地执行结束查看Dashboard

上面是主动去查看,你也可以等待本地都执行结束了,可以看到runs里有结果了,点击可以打开浏览器进入个人的Dashboard,并查看本次执行信息。

image.png

关于Dashboard还有一些权限设置,关系绑定等,更多的内容自己去摸索吧,相对次要一些。

评论