1.使用uni-app官网中的自动化测试方式
uni-app自动化测试@about | uni-app官网创建项目
$ npm install -g @vue/cli# 全局安装vue-cli
$ cd ... // 切换到工程保存目录
$ vue create -p dcloudio/uni-preset-vue#alpha my-project//也可以使用vue create -p dcloudio/uni-preset-vue my-project
$ cd my-project
$ npm install -D [email protected]
$ npm install -S puppeteer
$ npm install -S cross-env adbkit node-simctl playwright @playwright/test
(如果下载依赖超时,使用cnpm)
package.json内容如下(如果一直报错,可以删除node_modules文件夹重新拉取所有依赖)
注意:如果执行测试用例,报错.waitFor is not Function 大概率是有依赖没安装
{
"name": "my-project3",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "npm run dev:h5",
"build": "npm run build:h5",
"build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build",
"build:custom": "cross-env NODE_ENV=production uniapp-cli custom",
"build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
"build:mp-360": "cross-env NODE_ENV=production UNI_PLATFORM=mp-360 vue-cli-service uni-build",
"build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build",
"build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build",
"build:mp-jd": "cross-env NODE_ENV=production UNI_PLATFORM=mp-jd vue-cli-service uni-build",
"build:mp-kuaishou": "cross-env NODE_ENV=production UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build",
"build:mp-lark": "cross-env NODE_ENV=production UNI_PLATFORM=mp-lark vue-cli-service uni-build",
"build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build",
"build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build",
"build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
"build:mp-xhs": "cross-env NODE_ENV=production UNI_PLATFORM=mp-xhs vue-cli-service uni-build",
"build:quickapp-native": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-native vue-cli-service uni-build",
"build:quickapp-webview": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview vue-cli-service uni-build",
"build:quickapp-webview-huawei": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build",
"build:quickapp-webview-union": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build",
"dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch",
"dev:custom": "cross-env NODE_ENV=development uniapp-cli custom",
"dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve",
"dev:mp-360": "cross-env NODE_ENV=development UNI_PLATFORM=mp-360 vue-cli-service uni-build --watch",
"dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch",
"dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
"dev:mp-jd": "cross-env NODE_ENV=development UNI_PLATFORM=mp-jd vue-cli-service uni-build --watch",
"dev:mp-kuaishou": "cross-env NODE_ENV=development UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build --watch",
"dev:mp-lark": "cross-env NODE_ENV=development UNI_PLATFORM=mp-lark vue-cli-service uni-build --watch",
"dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
"dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch",
"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch",
"dev:mp-xhs": "cross-env NODE_ENV=development UNI_PLATFORM=mp-xhs vue-cli-service uni-build --watch",
"dev:quickapp-native": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-native vue-cli-service uni-build --watch",
"dev:quickapp-webview": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview vue-cli-service uni-build --watch",
"dev:quickapp-webview-huawei": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build --watch",
"dev:quickapp-webview-union": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build --watch",
"info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
"serve:quickapp-native": "node node_modules/@dcloudio/uni-quickapp-native/bin/serve.js",
"test:android": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=android jest -i",
"test:h5": "cross-env UNI_PLATFORM=h5 jest -i",
"test:ios": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=ios jest -i",
"test:mp-baidu": "cross-env UNI_PLATFORM=mp-baidu jest -i",
"test:wx": "cross-env UNI_PLATFORM=mp-weixin jest -i"
},
"dependencies": {
"@dcloudio/uni-app-plus": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-h5": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-helper-json": "*",
"@dcloudio/uni-i18n": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-360": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-alipay": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-baidu": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-jd": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-kuaishou": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-lark": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-qq": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-toutiao": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-vue": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-weixin": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-mp-xhs": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-quickapp-native": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-quickapp-webview": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-stat": "^2.0.1-alpha-35220220719002",
"@playwright/test": "^1.23.4",
"@vue/shared": "^3.0.0",
"adbkit": "^2.11.1",
"core-js": "^3.6.5",
"cross-env": "^7.0.3",
"flyio": "^0.6.2",
"node-simctl": "^7.1.0",
"playwright": "^1.23.4",
"regenerator-runtime": "^0.12.1",
"vue": "^2.6.11",
"vuex": "^3.2.0"
},
"devDependencies": {
"@babel/runtime": "~7.17.9",
"@dcloudio/types": "^3.0.4",
"@dcloudio/uni-automator": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-cli-i18n": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-cli-shared": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-migration": "^2.0.1-alpha-35220220719002",
"@dcloudio/uni-template-compiler": "^2.0.1-alpha-35220220719002",
"@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.1-alpha-35220220719002",
"@dcloudio/vue-cli-plugin-uni": "^2.0.1-alpha-35220220719002",
"@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.1-alpha-35220220719002",
"@dcloudio/webpack-uni-mp-loader": "^2.0.1-alpha-35220220719002",
"@dcloudio/webpack-uni-pages-loader": "^2.0.1-alpha-35220220719002",
"@vue/cli-plugin-babel": "~4.5.19",
"@vue/cli-service": "~4.5.19",
"babel-plugin-import": "^1.11.0",
"cross-env": "^7.0.2",
"jest": "^25.4.0",
"jest-environment-node": "^26.5.2",
"mini-types": "*",
"miniprogram-api-typings": "*",
"postcss-comment": "^2.0.0",
"puppeteer": "^15.4.0",
"vue-template-compiler": "^2.6.11"
},
"browserslist": [
"Android >= 4.4",
"ios >= 9"
],
"resolutions": {
"@babel/runtime": "~7.17.9"
},
"uni-app": {
"scripts": {}
}
}
jest.config.js
注意:微信小程序 的port不设置,如果设置了大概率会报错Failed to launch wechat web devTools, please make sure http port is open
module.exports = {
globalTeardown: '@dcloudio/uni-automator/dist/teardown.js',
testEnvironment: '@dcloudio/uni-automator/dist/environment.js',
testEnvironmentOptions: {
"mp-weixin": {
// port: 33489, // 默认 9420
account: "", // 测试账号
url:'D:/my-project3/dist/dev/mp-weixi',
args: "", // 指定开发者工具参数
cwd: "", // 指定开发者工具工作目录
launch: true, // 是否主动拉起开发者工具
teardown: "disconnect", // 可选值 "disconnect"|"close" 运行测试结束后,断开开发者工具或关闭开发者工具
remote: false, // 是否真机自动化测试
executablePath: "D:/桌面助手/微信web开发者工具/cli.bat", // 开发者工具cli路径,默认会自动查找, windows: C:/Program Files (x86)/Tencent/微信web开发者工具/cli.bat", mac: /Applications/wechatwebdevtools.app/Contents/MacOS/cli
},
},
// cli --auto D:\my-project3\dist\dev\mp-weixin --auto-port 33489
testTimeout: 35000,
reporters: [
'default'
],
watchPathIgnorePatterns: ['/node_modules/', '/.git/'],
moduleFileExtensions: ['js', 'json'],
rootDir: __dirname,
testMatch: ['/src/**/*test.[jt]s?(x)'],
testPathIgnorePatterns: ['/node_modules/']
}
测试用例index.test.js
注意点:微信小程序需要设置一定的延时时间,是为了小程序打开开发者工具时间,否则容易超时链接不上报错Async callback was not invoked within the 5000ms timeout specified by jest.setTimeout
describe('pages/index/index.vue', () => {
let page
beforeAll(async () => {
// 重新reLaunch至首页,并获取首页page对象(其中 program 是uni-automator自动注入的全局对象)
page = await program.reLaunch('/pages/index/index')
await page.waitFor(2000)
},10000)//此处设置延时是为了小程序打开开发者工具时间,否则容易超时链接不上报错
it('测试下内容', async () => {
// 检测首页u-link的文本内容
console.log(await (await page.$('.title')).text());
expect(await (await page.$('.title')).text()).toBe('Hello')
})
})
2.uni-app项目使用微信小程序自动化测试方式
官网文档地址
创建好uni-app项目后 安装miniprogram-automator
执行 npm i miniprogram-automator -D
创建 openWeixin.js文件
const automator = require('miniprogram-automator')
automator.launch({
cliPath: 'D:/**/微信web开发者工具/cli.bat', // 工具 cli 位置,如果你没有更改过默认安装位置,可以忽略此项
projectPath: 'D:/**/dist/dev/mp-weixin', // 项目文件地址
}).then(async miniProgram => {
const page = await miniProgram.reLaunch('/pages/decorationPages/home/index')
await page.waitFor(15000)
const element = await page.$('.title')
console.log(await element.attribute('class'))
await element.tap()
await miniProgram.close()
})
之后执行 node openWeixin.js