初识cypress

我是一个前端开发工程师，由于没有自动化测试这块，一直都是人工去测，不免太耗时。所以想试试Cypress，希望能有收获。

我在selenium和cypress这两个框架中纠结，最后选择这个框架的初心很简单，老公推荐的，哈哈，我信他。然后就开始了我的自动化测试之旅。

首先，还是得安装环境，因为nodejs和npm早就ready，我只需要新创建一个文件夹，在该文件夹下执行命令npm install cypress,然后等待大概十分钟左右，安装完成！

image

那就尝试下手动添加package.json

{
"name": "Cypress_project",
  "version": "1.0.0",
  "dependencies": {
},
  "scripts": {
"cypress": "cypress open"
  }
}

执行npm run cypress

image

在原项目中也可添加cypress，最近npm install cypress不成功，改为cnpm install cypress快多了，安装完，没有生产cypress目录，在package.json中的“script”中添加"cypress": "cypress open" ，执行npm run cypress，第一次执行，会自动创建cypress目录。

examples下面是Cypress提供的demo，点击即可运行。运行时一直刷刷刷的在跑案例跑网页，这种感觉，就跟上了高速一般~~

暗暗发誓，一定要用好这个玩意儿，解放双手，翻身农奴把歌唱~~

Cypress内置工具

• Cypress._：Lodash
• Cypress.$：jQuery
• Cypress.Blob：blob-utli
• Cypress.minimatch()：minimatch
• Cypress.moment()：moment.js
• new Cypress.Promise(fn)：Bluebird

Cypress 中内置的断言 包含了几种类型：

• Chai：断言
  • expect('test').to.be.a('string')：BDD 风格
  • assert.equal(3, 3, 'vals equal')：TDD 风格
• Chai jQuery：关于 DOM 的断言
  • expect(\$el).to.have.attr('foo', 'bar')
• Sinon-Chai：关于函数调用情况的断言
  • expect(spy).to.be.called
• .should()：在 Cypress 中封装了以上所有可用断言
  • cy.get('li.selected').should('have.length', 3)：should
  • cy.get('div').should(($div) => { expect($div)... })：BDD

注意到 Cypress 使用 Mocha BDD 风格的生命周期，
不同测试的命名风格：

Mocha BDD	Mocha TDD	Jest
describe/context	suite	describe
specify/it	test	test/it
before	setup	beforeAll
after	teardown	afterAll
beforeEach	suiteSetup	before
afterEach	suiteTeardown	after