e2e test在vue中的使用是怎么回事呢？vue相信大家都很熟悉，但是 e2e test是怎么回事呢，下面就让小编带大家一起了解吧。
e2e test在vue中的使用，其实就是vue自带的测试框架，但是很多人没有用到这一功能，一般都顺手删除了，或者直接不安装test部分。
这就是关于e2e test的事情了，大家有什么想法呢，欢迎在评论区告诉小编一起讨论哦!
首先安装一个空的vue文件
vue creat qq
cd qq
vue add e2e-nightwatch
这里就装好了环境，环境其实基于nightwatch和chromedriver两个包，现在装的是vue-cli整合后的版本 。
这时packagejson中已经添加了跑测试的服务
参考官方文档位置
https://cn.vuejs.org/v2/guide/testing.html#%E7%AB%AF%E5%88%B0%E7%AB%AF-E2E-%E6%B5%8B%E8%AF%95
https://cli.vuejs.org/core-plugins/e2e-nightwatch.html
开发规则说明
page-objects
在端到端UI测试中，使用页面对象是一种流行的方法。放置在此文件夹中的文件会自动加载到名称空间中，文件名就是页面对象的名称。
specs
是测试执行的入口，里面的文件会自动执行，不需要import
specsOne
每个页面的测试文件在这里定义，在specs中引用
基本的例子文件都在test里面生成了，下面写一些项目中常用的函数
//在beforeEach中可以设定一些基础设施，比如设定测试网站url
const page = browser.page.sb()
browser.maximizeWindow()
browser.init(Url)
browser.waitForElementVisible('body', 100)
browser.waitForElementPresent('body',100);
browser.setValue('#sb', "admin") //input设置值
browser.click('#sb')
browser.verify.urlContains('sb',"打印一些log")
browser.verify.containsText('.sb', '测试的内容text', '测试的log')
browser.pause(9999)
browser.end()
browser.moveToElement(colors, 0, 400) //调整位置
let value = ""
await browser.getText(title, function (result) {
value = result.value
})
browser.windowHandles(function (result) {
var handle = result.value[1]; //获取第一个窗口句柄
browser.switchWindow(handle);
browser.verify.urlContains("sb.com", "看看换了窗口");
browser.switchWindow(result.value[0]);//转回原来的窗口
});
有些奇怪的是这个框架没有合理的for循环回调.for循环需要再调用前面的css selector来拼接，很麻烦。
let ul="ul li"
browser.elements("css selector", ul, async function (result) {
for (let i = 1; i < result.value.length + 1; i++) {
let selector = ul+ `:nth-of-type(${i}) `
browser.click(li)
}
});
还有一个点是文件上传，其实文件上传直接用browser.setValue就能实现。
var fileload = "qq.txt"
var txt= path.resolve(__dirname, fileload)
var inputFile = ".body .qq input"
browser.setValue(inputFile, txt)
还有一个是iframe设置内容,常见的是iframe做富文本编辑器
browser.click(`.body iframe`)
browser.keys("qweqwe")
