25、Cypress测试：从基础到高级应用

Cypress测试：从基础到高级应用

1. Cypress测试运行与调试

在Cypress测试运行时，你能看到所有步骤的执行情况，比如在登录界面输入邮箱和密码。左侧每个单独的步骤通过时会变为绿色。更棒的是，点击左侧的某一行，视口会切换到该步骤执行时的屏幕快照，并且正在操作的元素会高亮显示。这些屏幕快照在调试测试时非常有用，能让你清楚地看到每一步发生了什么。

2. 理解Cypress的工作原理

Cypress测试表面上看起来简单，但开发者命令的表面简单性背后隐藏着相当多的复杂性。Cypress采用异步结构，这意味着很多常见的JavaScript模式在Cypress中要么不起作用，要么不被推荐。例如，使用常规的变量赋值会带来问题。

Cypress命令虽然看起来像常规的JavaScript函数调用，但实际上都是异步的。每次使用 cy 命令时，就像创建了一个JavaScript Promise，后续的 cy 命令就像是前一个命令的 then 子句，即每个后续的 cy 命令只有在前一个命令完成后才会执行。

当Cypress命令作为测试的一部分实际运行时，它会将自身加入测试的命令队列并立即返回。我们所认为的实际命令（如 get 、 click 等）只有在整个测试加载完成后，作为这个Promise队列的一部分才会执行。

Cypress有自己独立的运行环境，普通的JavaScript赋值或逻辑如果不通过Cypress进行中介，就无法访问Cypress的数据