Cypress基础-02

1. beforeEach() hook

每次运行测试之前自动运行：

beforeEach(() => {
    cy.visit("http://localhost:3000")
  })

2. 自定义命令行custom Cypress commands

允许用户在不同的Cypress spec file中reuse code.

Eg.  “get” data-test attributes more easily:

1. 添加自定义命令到 cypress/support/commands.ts file：

   /// <reference types="cypress" />
   
   Cypress.Commands.add("getByData", (selector) => {//TypeScript?
     return cy.get(`[data-test=${selector}]`)
   })

   2. 无法检测自定义命令ERRORS解决

   创建cypress/support/index.ts 并添加以下代码：

   /// <reference types="cypress" />
   
   declare namespace Cypress {
     interface Chainable {
       getByData(dataTestAttribute: string): Chainable<JQuery<HTMLElement>>
     }
   }

   3. 使用：自定义的“getByData”命令，将允许pass任意data-test的值。

   before:
   cy.get("[data-test='hero-heading']")
   after:
   cy.getByData("hero-heading")