Puppeteer+Mocha+Chai端到端测试

目录结构

登录

加个最外层的before，判断没登陆过就登录，登录后把window,page,route,router,store挂在全局上

（对Puppeteer封装处理的方式，在这里）

login.js

const {run} = require('nine-nine-six');

before(function() {
	return new Promise(function (resolve, reject) {
		//登录过，就不执行
		if(global.window){
			resolve()
			return
		}
		run({
			url:'http://localhost:8080',
			chromeUrl:'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe'
		},function (res) {
			//window,page,route,router,store
			let {window,page,route,router,store} = res
			let login = page.findVueNode({
				tag:'Login'
			})
			//vue router前置钩子
			router.beforeEach((to, from, next)=>{
				global.route = to
				next()
			})
			let form =  login.form
			form.userName = 'xx'
			form.password = 'xx'
			form.vcode = 'xx'
			//登录
			login.handleSubmit()
			//全局设置window,page,route,router,store
			Object.keys(res).forEach(key=>{
				global[key] = res[key]
			})
			resolve()
		})
	})
})

把expect设成全局的

setup.js

const chai = require('chai');

global.expect = chai.expect;

测试代码

delivery.spec.js

describe('test Delivery',()=>{
  //测试前，路由跳转到要测试的页面
  before(function () {
    router.push({
      name:'Delivery',
    })
  })
  it('test page title',() => {
    expect(window.document.title).to.be.equal('DeliveryTitle');
  })
  it('route name',() => {
    expect(route.name).to.be.equal('Delivery');
  })
  it('test FormItem label',() => {
    let FormItem = page.findVueNode('FormItem')
    expect(FormItem.label).to.be.equal('item label');
  })
})

测试命令：mocha --require setup login specs --recursive -t 0

demo地址