From f1d0c7b212a8a01c4e5edf002de313e4338c6be4 Mon Sep 17 00:00:00 2001 From: yinjiacheng Date: Wed, 5 Jun 2024 19:11:14 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0image=E3=80=81video=E3=80=81w?= =?UTF-8?q?eb-view=E8=87=AA=E5=8A=A8=E5=8C=96=E6=B5=8B=E8=AF=95=E7=94=A8?= =?UTF-8?q?=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- hybrid/html/local.html | 2 + pages/component/image/image.test.js | 32 ++++ pages/component/image/image.uvue | 23 ++- pages/component/video/video.test.js | 148 ++++++++++++++++-- pages/component/video/video.uvue | 84 +++++++++- .../web-view-local/web-view-local.test.js | 77 +++++++-- .../web-view-local/web-view-local.uvue | 47 +++++- pages/component/web-view/web-view.test.js | 46 +++++- pages/component/web-view/web-view.uvue | 43 ++++- 9 files changed, 459 insertions(+), 43 deletions(-) diff --git a/hybrid/html/local.html b/hybrid/html/local.html index eafd76ec..fbd12a61 100644 --- a/hybrid/html/local.html +++ b/hybrid/html/local.html @@ -48,6 +48,8 @@

普通input

+
+ hello uni-app x apk下载(自动化测试使用) diff --git a/pages/component/image/image.test.js b/pages/component/image/image.test.js index c5f25b02..9fd9ff2c 100644 --- a/pages/component/image/image.test.js +++ b/pages/component/image/image.test.js @@ -70,6 +70,38 @@ describe('component-native-image', () => { }) } + it('test event load', async () => { + await page.setData({ + autoTest: true, + imageSrc: 'https://request.dcloud.net.cn/api/http/contentType/image/png' + }); + await page.waitFor(async () => { + return await page.data('eventLoad'); + }); + expect(await page.data('eventLoad')).toEqual({ + tagName: 'IMAGE', + type: 'load', + width: 10, + height: 10 + }); + }); + + it('test event error', async () => { + await page.setData({ + imageSrc: 'https://request.dcloud.net.cn/api/http/contentType/404.png' + }); + await page.waitFor(async () => { + return await page.data('eventError'); + }); + expect(await page.data('eventError')).toEqual({ + tagName: 'IMAGE', + type: 'error' + }); + await page.setData({ + autoTest: false + }); + }); + it('path-screenshot', async () => { const page = await program.navigateTo('/pages/component/image/image-path'); await page.waitFor(3000); diff --git a/pages/component/image/image.uvue b/pages/component/image/image.uvue index 42e9f4ca..f28352c3 100644 --- a/pages/component/image/image.uvue +++ b/pages/component/image/image.uvue @@ -34,16 +34,33 @@ // 自动化测试 autoTest: false, setCookieImage: "", - verifyCookieImage: "" + verifyCookieImage: "", + eventLoad: null, + eventError: null } }, methods: { error(event : ImageErrorEvent) { this.loadError = true - console.log(event.type, event.detail); + console.log(event.type, event.detail); + if (this.autoTest) { + this.eventError = { + "tagName": event.target?.tagName, + "type": event.type, + // "errMsg": event.detail.errMsg + }; + } }, load(event : ImageLoadEvent) { - console.log(event.type, event.detail); + console.log(event.type, event.detail); + if (this.autoTest) { + this.eventLoad = { + "tagName": event.target?.tagName, + "type": event.type, + "width": event.detail.width, + "height": event.detail.height + }; + } }, imageFormat() { uni.navigateTo({ diff --git a/pages/component/video/video.test.js b/pages/component/video/video.test.js index ea02d3d1..39516114 100644 --- a/pages/component/video/video.test.js +++ b/pages/component/video/video.test.js @@ -30,17 +30,143 @@ describe('component-native-video', () => { }); it('test local source', async () => { - await page.callMethod('downloadSource'); - await page.waitFor(5000); - expect(await page.data('isError')).toBe(false); - await page.setData({ - localSrc: '/static/test-video/2minute-demo.m3u8' - }); - await page.waitFor(100); - expect(await page.data('isError')).toBe(false); - await page.setData({ - autoTest: false - }); + await page.setData({ + autoTest: true, + isError: false + }); + await page.callMethod('downloadSource'); + await page.waitFor(5000); + expect(await page.data('isError')).toBe(false); + await page.setData({ + localSrc: '/static/test-video/2minute-demo.m3u8' + }); + await page.waitFor(100); + expect(await page.data('isError')).toBe(false); + await page.setData({ + autoTest: false + }); + }); + + it('test event play pause', async () => { + await page.setData({ + autoTest: true + }); + await page.callMethod('play'); + await page.waitFor(async () => { + return await page.data('eventPlay'); + }); + expect(await page.data('eventPlay')).toEqual({ + tagName: 'VIDEO', + type: 'play' + }); + await page.callMethod('pause'); + await page.waitFor(async () => { + return await page.data('eventPause'); + }); + expect(await page.data('eventPause')).toEqual({ + tagName: 'VIDEO', + type: 'pause' + }); + await page.callMethod('play'); + }); + + it('test event waiting progress timeupdate', async () => { + await page.setData({ + pos: 10 + }); + await page.callMethod('seek'); + await page.waitFor(async () => { + return await page.data('eventWaiting'); + }); + expect(await page.data('eventWaiting')).toEqual({ + tagName: 'VIDEO', + type: 'waiting' + }); + await page.waitFor(async () => { + return await page.data('eventProgress'); + }); + expect(await page.data('eventProgress')).toEqual({ + tagName: 'VIDEO', + type: 'progress', + buffered: 100 + }); + await page.waitFor(250); + expect(await page.data('eventTimeupdate')).toEqual({ + tagName: 'VIDEO', + type: 'timeupdate', + currentTime: 10, + duration: 121 + }); + }); + + it('test event fullscreenchange fullscreenclick controlstoggle', async () => { + await page.callMethod('requestFullScreen'); + await page.waitFor(async () => { + return await page.data('eventFullscreenchange'); + }); + expect(await page.data('eventFullscreenchange')).toEqual({ + tagName: 'VIDEO', + type: 'fullscreenchange', + fullScreen: true, + direction: 'horizontal' + }); + if (process.env.uniTestPlatformInfo.startsWith('android')) { + const res = await program.adbCommand('wm size'); + const width = res.data.split(' ').at(-1).split('x')[0] + const height = res.data.split(' ').at(-1).split('x')[1] + const res2 = await program.adbCommand('wm density'); + const scale = res2.data.split(' ').at(-1) / 160; + await page.waitFor(100); + await program.adbCommand(`input tap ${parseInt(height / 2)} ${parseInt(width / 2)}`); + await page.waitFor(100); + expect(await page.data('eventControlstoggle')).toEqual({ + tagName: 'VIDEO', + type: 'controlstoggle', + show: false + }); + expect(await page.data('eventFullscreenclick')).toEqual({ + tagName: 'VIDEO', + type: 'fullscreenclick', + screenX: parseInt(height / 2 / scale), + screenY: parseInt(width / 2 / scale), + screenWidth: parseInt(height / scale), + screenHeight: parseInt(width / scale) + }); + } + await page.callMethod('exitFullScreen'); + }); + + it('test event ended', async () => { + await page.setData({ + pos: 120 + }); + await page.callMethod('seek'); + await page.waitFor(async () => { + return await page.data('eventEnded'); + }); + expect(await page.data('eventEnded')).toEqual({ + tagName: 'VIDEO', + type: 'ended' + }); + }); + + it('test event error', async () => { + const oldSrc = await page.data('src'); + await page.setData({ + src: 'invalid url' + }); + await page.waitFor(async () => { + return await page.data('eventError'); + }); + expect(await page.data('eventError')).toEqual({ + tagName: 'VIDEO', + type: 'error', + errCode: 300001 + }); + await page.setData({ + autoTest: false, + src: oldSrc + }); }); it('test format', async () => { diff --git a/pages/component/video/video.uvue b/pages/component/video/video.uvue index 7811c282..68a784ea 100644 --- a/pages/component/video/video.uvue +++ b/pages/component/video/video.uvue @@ -174,7 +174,17 @@ isPlaying: false, isPause: false, isError: false, - localSrc: '' + localSrc: 'https://qiniu-web-assets.dcloud.net.cn/video/sample/2minute-demo.mp4', + eventPlay: null, + eventPause: null, + eventEnded: null, + eventTimeupdate: null, + eventFullscreenchange: null, + eventWaiting: null, + eventError: null, + eventProgress: null, + eventFullscreenclick: null, + eventControlstoggle: null } }, onLoad() { @@ -362,36 +372,107 @@ console.log(res.type); this.isPlaying = true; this.isPause = false; + if (this.autoTest) { + this.eventPlay = { + "tagName": res.target?.tagName, + "type": res.type + }; + } }, onPause: function (res : UniEvent) { console.log(res.type); this.isPlaying = false; this.isPause = true; + if (this.autoTest) { + this.eventPause = { + "tagName": res.target?.tagName, + "type": res.type + }; + } }, onEnded: function (res : UniEvent) { console.log(res.type); + if (this.autoTest) { + this.eventEnded = { + "tagName": res.target?.tagName, + "type": res.type + }; + } }, onTimeUpdate: function (res : UniVideoTimeUpdateEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); + if (this.autoTest) { + this.eventTimeupdate = { + "tagName": res.target?.tagName, + "type": res.type, + "currentTime": Math.round(res.detail.currentTime), + "duration": res.detail.duration.toInt() + }; + } }, onFullScreenChange: function (res : UniVideoFullScreenChangeEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); + if (this.autoTest) { + this.eventFullscreenchange = { + "tagName": res.target?.tagName, + "type": res.type, + "fullScreen": res.detail.fullScreen, + "direction": res.detail.direction + }; + } }, onWaiting: function (res : UniEvent) { console.log(res.type); + if (this.autoTest) { + this.eventWaiting = { + "tagName": res.target?.tagName, + "type": res.type + }; + } }, onError: function (res : UniVideoErrorEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); this.isError = true; + if (this.autoTest) { + this.eventError = { + "tagName": res.target?.tagName, + "type": res.type, + "errCode": res.detail.errCode + }; + } }, onProgress: function (res : UniVideoProgressEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); + if (this.autoTest) { + this.eventProgress = { + "tagName": res.target?.tagName, + "type": res.type, + "buffered": res.detail.buffered + }; + } }, onFullScreenClick: function (res : UniVideoFullScreenClickEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); + if (this.autoTest) { + this.eventFullscreenclick = { + "tagName": res.target?.tagName, + "type": res.type, + "screenX": res.detail.screenX.toInt(), + "screenY": res.detail.screenY.toInt(), + "screenWidth": res.detail.screenWidth.toInt(), + "screenHeight": res.detail.screenHeight.toInt() + }; + } }, onControlsToggle: function (res : UniVideoControlsToggleEvent) { console.log(res.type + " -> " + JSON.stringify(res.detail)); + if (this.autoTest) { + this.eventControlstoggle = { + "tagName": res.target?.tagName, + "type": res.type, + "show": res.detail.show + }; + } }, // 自动化测试 downloadSource() { @@ -399,7 +480,6 @@ url: 'https://qiniu-web-assets.dcloud.net.cn/video/sample/2minute-demo.mp4', success: (res) => { this.localSrc = res.tempFilePath; - this.autoTest = true; }, fail: (_) => { this.isError = true; diff --git a/pages/component/web-view-local/web-view-local.test.js b/pages/component/web-view-local/web-view-local.test.js index bc1fdd29..62c2e089 100644 --- a/pages/component/web-view-local/web-view-local.test.js +++ b/pages/component/web-view-local/web-view-local.test.js @@ -1,18 +1,18 @@ // uni-app自动化测试教程: uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/ describe('component-native-web-view', () => { - let page; - beforeAll(async () => { - page = await program.reLaunch('/pages/component/web-view-local/web-view-local'); - await page.waitFor(1000); - }); + if (!process.env.uniTestPlatformInfo.startsWith('web') && !process.env.UNI_AUTOMATOR_APP_WEBVIEW) { + let page; + beforeAll(async () => { + page = await program.reLaunch('/pages/component/web-view-local/web-view-local'); + await page.waitFor(1000); + }); - it('check_load_url', async () => { - expect(await page.data('loadError')).toBe(false) - }); + it('check_load_url', async () => { + expect(await page.data('loadError')).toBe(false) + }); - it('screenshot', async () => { - if (process.env.uniTestPlatformInfo.startsWith('android') && !process.env.UNI_AUTOMATOR_APP_WEBVIEW) { + it('screenshot', async () => { await page.waitFor(async () => { return await page.data('loadFinish') === true; }); @@ -20,6 +20,59 @@ describe('component-native-web-view', () => { fullPage: true }); expect(image).toSaveImageSnapshot(); - } - }); + }); + + it('test event download', async () => { + await page.setData({ + autoTest: true + }); + await page.callMethod('testEventDownload'); + await page.waitFor(async () => { + return await page.data('eventDownload'); + }); + if (process.env.uniTestPlatformInfo.startsWith('ios')) { + expect(await page.data('eventDownload')).toEqual({ + tagName: 'WEB-VIEW', + type: 'download', + url: 'https://web-ext-storage.dcloud.net.cn/uni-app-x/pkg/hello-uniappx.apk', + userAgent: `uni-app-x/${process.env.HX_Version.split('-')[0].split('.').slice(0, 2).join('.')}`, + contentDisposition: '', + mimetype: 'application/vnd.android.package-archive', + contentLength: 27317517 + }); + return; + } + expect(await page.data('eventDownload')).toEqual({ + tagName: 'WEB-VIEW', + type: 'download', + url: 'https://web-ext-storage.dcloud.net.cn/uni-app-x/pkg/hello-uniappx.apk', + userAgent: `uni-app-x/${process.env.HX_Version.split('-')[0].split('.').slice(0, 2).join('.')}`, + contentDisposition: `attachment; filename="hello-uniappx.apk"; filename*=utf-8''hello-uniappx.apk`, + mimetype: 'application/vnd.android.package-archive', + contentLength: 27317517 + }); + }); + + it('test event message', async () => { + await page.callMethod('testEventMessage'); + await page.waitFor(async () => { + return await page.data('eventMessage'); + }); + expect(await page.data('eventMessage')).toEqual({ + tagName: 'WEB-VIEW', + type: 'message', + data: [{ + action: 'message' + }] + }); + await page.setData({ + autoTest: false + }); + }); + } else { + // TODO: web 端暂不支持 + it('web', async () => { + expect(1).toBe(1) + }) + } }); \ No newline at end of file diff --git a/pages/component/web-view-local/web-view-local.uvue b/pages/component/web-view-local/web-view-local.uvue index 4d1e8c30..add414e6 100644 --- a/pages/component/web-view-local/web-view-local.uvue +++ b/pages/component/web-view-local/web-view-local.uvue @@ -1,6 +1,6 @@ @@ -9,12 +9,16 @@ data() { return { loadError: false, - loadFinish: false + loadFinish: false, + // 自动化测试 + autoTest: false, + eventMessage: null, + eventDownload: null } }, methods: { message(event : UniWebViewMessageEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); let contentStr = JSON.stringify(event.detail); contentStr = JSON.stringify(event.detail.data[0]); @@ -23,17 +27,46 @@ content: contentStr, showCancel: false }); + if (this.autoTest) { + this.eventMessage = { + "tagName": event.target?.tagName, + "type": event.type, + "data": event.detail.data + }; + } }, error(event : UniWebViewErrorEvent) { this.loadError = true - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); }, loading(event : UniWebViewLoadingEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); }, load(event : UniWebViewLoadEvent) { this.loadFinish = true; - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); + }, + download(event : UniWebViewDownloadEvent) { + console.log(JSON.stringify(event.detail)); + if (this.autoTest) { + const arr = event.detail.userAgent.split(' '); + this.eventDownload = { + "tagName": event.target?.tagName, + "type": event.type, + "url": event.detail.url, + "userAgent": arr[arr.length - 1], + "contentDisposition": event.detail.contentDisposition, + "mimetype": event.detail.mimetype, + "contentLength": event.detail.contentLength.toInt() + }; + } + }, + // 自动化测试 + testEventDownload() { + uni.createWebviewContext('web-view')?.evalJS("document.getElementsByTagName('a')[0].click()"); + }, + testEventMessage() { + uni.createWebviewContext('web-view')?.evalJS("document.getElementById('postMessage').click()"); } } } diff --git a/pages/component/web-view/web-view.test.js b/pages/component/web-view/web-view.test.js index 7995ecc6..a7ca302b 100644 --- a/pages/component/web-view/web-view.test.js +++ b/pages/component/web-view/web-view.test.js @@ -1,7 +1,7 @@ // uni-app自动化测试教程: uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/ describe('component-native-web-view', () => { - if (process.env.uniTestPlatformInfo.startsWith('android') && !process.env.UNI_AUTOMATOR_APP_WEBVIEW) { + if (!process.env.uniTestPlatformInfo.startsWith('web') && !process.env.UNI_AUTOMATOR_APP_WEBVIEW) { let page; beforeAll(async () => { page = await program.reLaunch('/pages/component/web-view/web-view'); @@ -11,6 +11,50 @@ describe('component-native-web-view', () => { it('check_load_url', async () => { expect(await page.data('loadError')).toBe(false) }); + + it('test event loading load', async () => { + await page.setData({ + autoTest: true + }); + await page.callMethod('reload'); + await page.waitFor(async () => { + return await page.data('eventLoading'); + }); + expect(await page.data('eventLoading')).toEqual({ + tagName: 'WEB-VIEW', + type: 'loading', + src: 'https://www.dcloud.io/' + }); + await page.waitFor(async () => { + return await page.data('eventLoad'); + }); + expect(await page.data('eventLoad')).toEqual({ + tagName: 'WEB-VIEW', + type: 'load', + src: 'https://www.dcloud.io/' + }); + }); + + it('test event error', async () => { + await page.setData({ + src: 'https://www.dclou.io/uni-app-x' + }); + await page.waitFor(async () => { + return await page.data('eventError'); + }); + expect(await page.data('eventError')).toEqual({ + tagName: 'WEB-VIEW', + type: 'error', + errCode: 100002, + errMsg: 'page error', + url: 'https://www.dclou.io', + fullUrl: 'https://www.dclou.io/uni-app-x', + src: 'https://www.dclou.io/uni-app-x' + }); + await page.setData({ + autoTest: false + }); + }); } else { // TODO: web 端暂不支持 it('web', async () => { diff --git a/pages/component/web-view/web-view.uvue b/pages/component/web-view/web-view.uvue index 13e73aaf..0ab931f2 100644 --- a/pages/component/web-view/web-view.uvue +++ b/pages/component/web-view/web-view.uvue @@ -50,7 +50,12 @@ webviewContext: null as WebviewContext | null, loadError: false, horizontalScrollBarAccess: true, - verticalScrollBarAccess: true + verticalScrollBarAccess: true, + // 自动化测试 + autoTest: false, + eventLoading: null, + eventLoad: null, + eventError: null } }, onReady() { @@ -76,27 +81,51 @@ this.webviewContext?.evalJS("alert('hello uni-app x')"); }, message(event : UniWebViewMessageEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); }, error(event : UniWebViewErrorEvent) { this.loadError = true - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); + if (this.autoTest) { + this.eventError = { + "tagName": event.target?.tagName, + "type": event.type, + "errCode": event.detail.errCode, + "errMsg": event.detail.errMsg, + "url": event.detail.url, + "fullUrl": event.detail.fullUrl, + "src": event.detail.src + }; + } }, loading(event : UniWebViewLoadingEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); + if (this.autoTest) { + this.eventLoading = { + "tagName": event.target?.tagName, + "type": event.type, + "src": event.detail.src + }; + } }, load(event : UniWebViewLoadEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); + if (this.autoTest) { + this.eventLoad = { + "tagName": event.target?.tagName, + "type": event.type, + "src": event.detail.src + }; + } }, download(event : UniWebViewDownloadEvent) { - console.log(JSON.stringify(event)); + console.log(JSON.stringify(event.detail)); uni.showModal({ content: "下载链接: " + event.detail.url + "\n文件大小: " + event.detail.contentLength / 1024 + "KB", showCancel: false }); }, confirm(event : UniInputConfirmEvent) { - console.log(JSON.stringify(event)); let url = event.detail.value; if (!url.startsWith('https://') && !url.startsWith('http://')) { url = 'https://' + url; -- GitLab