Cypress - 异步行为

Cypress 来源于 node.js，而 node.js 基于 JavaScript。Cypress 命令本质上是同步的，因为它们依赖于 node 服务器。异步流程意味着测试步骤的执行不依赖于其之前的步骤。

它们之间没有依赖关系，每个步骤都作为一个独立的实体执行。虽然测试步骤按顺序排列，但单个测试步骤不会考虑前一步的结果，而只是执行自身。

示例

以下是 Cypress 中异步行为的一个示例：

// test suite
describe('Tutorialspoint', function () {
   it('Scenario 1', function (){
      // test step to launch a URL
      cy.visit("https://127.0.0.1")
      // identify element
      cy.get('h1#headingText').find('span').should('have.text', 'Sign in')
      cy.get('h1#headingText').find('span').then(function(e){
         const t = e.text()
         // get in Console
         console.log(t)
      })
      // Console message
      console.log("Tutorialspoint-Cypress")
   })
})

执行结果

输出如下：

Promise

右键点击测试运行器并点击“检查”，我们可以在控制台中验证结果。这里，Tutorialspoint-Cypress（之前的一个步骤）在Sign – in（之后添加的步骤）之前被记录在控制台中。

Cypress 命令的设计方式使得每个步骤都按顺序执行，并且不会同时触发。但是，它们是按顺序排列的。因此，它使流程同步。这是通过 Promise 实现的。

在上面的例子中，console.log 是一个纯 JavaScript 语句。它没有像 Cypress 命令那样排列和等待的能力。Promise 允许我们以串行模式执行 Cypress 命令。

Promise 中的模式

Promise 有三种模式来对命令执行的状态进行分类。它们如下：

已解决（Resolved） - 如果测试步骤成功运行，则会产生此结果。
挂起（Pending） - 如果测试步骤运行结果正在等待，则为该结果。
已拒绝（Rejected） - 如果测试步骤运行失败，则为该结果。

只有在先前的步骤成功执行或收到已解决的 Promise 响应后，Cypress 命令才会执行。然后，该方法用于在 Cypress 中实现 Promise。

示例

以下是 Cypress 中 Promise 的示例：

describe('Tutorialspoint Test', function () {
   it('Promise', function (){
      return cy.visit('https://127.0.0.1')
      .then(() => {
         return cy.get('h1#heading');
      })
   })
})

Cypress 对 Promise 的实现是封装的，不可见。因此，它有助于编写更简洁的代码。此外，在自动化测试时，我们不必考虑 Promise 的状态。

无 Promise 的实现

以下命令说明如何在 Cypress 中无需 Promise 进行实现：

describe('Tutorialspoint Test', function () {
   it('Without Promise', function (){
      cy.visit('https://127.0.0.1')
      cy.get('h1#heading')
   })
})

打印页面