更新image、video、web-view自动化测试用例

hybrid/html/local.html

@@ -48,6 +48,8 @@
       <input type="file" accept="image/*" multiple />
       <p style="font-size: 14px;">普通input</p>
       <input placeholder="底部输入框"/>
+      <br/>
+      <a href="https://web-ext-storage.dcloud.net.cn/uni-app-x/pkg/hello-uniappx.apk" download>hello uni-app x apk下载（自动化测试使用）</a>
     </div>
     <!-- uni 的 SDK -->
     <script type="text/javascript" src="uni.webview.1.5.5.js"></script>

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);

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({

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 () => {

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;

pages/component/web-view-local/web-view-local.test.js

 // 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

pages/component/web-view-local/web-view-local.uvue

 <template>
-  <web-view ref="web-view" class="web-view" src="/hybrid/html/local.html" @message="message" @error="error"
-    @loading="loading" @load="load">
+  <web-view id="web-view" ref="web-view" class="web-view" src="/hybrid/html/local.html" @message="message" @error="error"
+    @loading="loading" @load="load" @download="download">
   </web-view>
 </template>
 
@@ -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);
         <!-- #ifdef APP-IOS -->
           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()");
       }
     }
   }

pages/component/web-view/web-view.test.js

 // 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 () => {

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;