如何安装 NodeJS 参考这里,里面有各种平台的安装包. 直接下载安装即可。安装完后通过node -v指令查看是否安装成功。

微软:要说 IDE,我微软敢说第二,没人敢说第一!
JetBrains:???
吃瓜群众:快点!瓜子、板凳...

微软的 VSCode 是一款相当优秀的 IDE,推荐使用它来进行自动化开发。安装教程参考这里,直接根据平台下载安装。

/// <reference types="Cypress" />

describe('百毒网站首页测试用例集', function() {
    beforeEach(() => {
          cy.visit('https://www.baidu.com')
        })
      it('百度一下按钮文本检查', function() {
        cy.get("#su").then($button_start_search=>{
            expect($button_start_search.attr("value")).to.eq("百度一下");
        })
      })
    })

Cypress 会自动检测你可用的浏览器,为了以防万一,我建议把 Chrome 设置为默认浏览器,当然你也可以运行 Cypress 的时候手动指定cypress run --browser chrome
运行效果如下图:

代码解释:

  1. reference表示告诉 VSCode 要去Cypress package 里找相关的语义解析,这样一来 Cypress 相关的语法和函数等就可以尽情地使用了;
  2. describe声明了一个测试用例集;
  3. beforeEach相当于单元测试的setup,即在每个测试用例运行前需要做的事;
  4. it声明了一个测试用例;
  5. cy.get接受一个 js selector, 就是元素定位字符串,当然 Cypress 也支持 xpath 定位,详见这里
  6. 通过thenshould,我们可以把get到的元素对象传递到下一步,以便做进一步处理,这里通过then把找到的button_start_search传递到下一步,并最终通过expect函数来判断button_start_searchvalue属性是否跟预期一致。

保存代码,在 Cypress 应用程序里找到myFirstTestSuites.js,点击它,你会发现它跑起来了,而且如果再次对用例修改并保存,Cypress 会自动检测到新的改动,并马上运行!当然,你也可以去掉这个自动重载机制...

Cypress 入门系列:

注:目前官方团队正在开发 Python 版本,同样的 Free to use,对 JS 恐惧的同学不妨等一等,或者直接 JS 上手,非常简单,VSCode 装上之后,你会爱上 Cypress 和 JS,笔者会慢慢介绍各种 Web UI 自动化复杂场景下 Cypress 的强大应对,目前还没发现 Cypress 无法处理的问题!欢迎一起入坑!QQ 群:947886065.


↙↙↙阅读原文可查看相关链接,并与作者交流