Support landacape & portrait mode for manual device session

AppiumTestDistribution · Apr 14, 2024 · 75ad47f · 75ad47f
1 parent 989b620
commit 75ad47f
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 9 deletions.
diff --git a/src/modules b/src/modules
diff --git a/web/src/components/streaming/AndroidStream.tsx b/web/src/components/streaming/AndroidStream.tsx
@@ -68,7 +68,7 @@ function AndroidStream() {
       containerElement.current &&
       videoElement.current
     ) {
-      videoElement.current.style.height = height + 'px';
+      //videoElement.current.style.width = width + 'px';
       interactionHandler = new SimpleInterationHandler(
         videoElement.current as any,
         canvasElement.current,
@@ -156,7 +156,7 @@ function AndroidStream() {
             style={{
               maxHeight: MAX_HEIGHT + 'px',
               maxWidth: MAX_WIDTH + 'px',
-              width: 'auto',
+              height: 'auto!important',
               position: 'absolute',
             }}
             src={imageSrc}

diff --git a/web/src/components/streaming/ios-stream.tsx b/web/src/components/streaming/ios-stream.tsx
@@ -9,8 +9,8 @@ import DeviceLoading from '../../assets/device-loading.gif';
 import useWebSocket from 'react-use-websocket';
 import { StreamActionNotifier } from './StreamActionNotifier.tsx';
 
-const MAX_HEIGHT = 720;
-const MAX_WIDTH = 720;
+const MAX_HEIGHT = 820;
+const MAX_WIDTH = 820;
 
 function IOSStream() {
   const getParamsFromUrl = () => {
@@ -67,7 +67,7 @@ function IOSStream() {
       containerElement.current &&
       videoElement.current
     ) {
-      videoElement.current.style.height = height + 'px';
+      //videoElement.current.style.width = width + 'px';
       interactionHandler = new SimpleInterationHandler(
         videoElement.current as any,
         canvasElement.current,
@@ -103,7 +103,7 @@ function IOSStream() {
             style={{
               maxHeight: MAX_HEIGHT + 'px',
               maxWidth: MAX_WIDTH + 'px',
-              width: 'auto',
+              height: 'auto!important',
               position: 'absolute',
               backgroundImage: `url(${DeviceLoading})`,
               backgroundRepeat: 'no-repeat',

diff --git a/web/src/libs/simple-interation-handler.ts b/web/src/libs/simple-interation-handler.ts
@@ -11,7 +11,7 @@ export class SimpleInterationHandler {
   private scaleRatio!: number;
   private clickStartTime!: number;
 
-    constructor(
+  constructor(
     private videoElement: HTMLElement,
     touchableElement: HTMLCanvasElement,
     containerElement: HTMLDivElement,
@@ -58,7 +58,11 @@ export class SimpleInterationHandler {
       this.mouseDownPoint?.y != this.mouseUpPoint?.y
     ) {
       //swipe action
-      const message = new SwipeControlMessage(this.mouseDownPoint as any, this.mouseUpPoint, Math.ceil(clickEndTime - this.clickStartTime));
+      const message = new SwipeControlMessage(
+        this.mouseDownPoint as any,
+        this.mouseUpPoint,
+        Math.ceil(clickEndTime - this.clickStartTime),
+      );
       this.controlMessageSender.send(JSON.stringify(message.toJSON()));
       console.log(message.toJSON());
       return;