refactor(image-comparison): calculate properly rectangle for iOS (#73)

* refactor(image-comparison): calculate properly rectangle for iOS

* refactor(image-comparison): add method to get actual rectangle dimensions

Author: Vasil Chimev

lib/appium-driver.d.ts

@@ -123,7 +123,7 @@ export declare class AppiumDriver {
     source(): Promise<any>;
     sessionId(): Promise<any>;
     compareElement(element: UIElement, imageName: string): Promise<boolean>;
-    compareRectangles(rect: IRectangle, imageName: string, timeOutSeconds?: number, tollerance?: number): Promise<boolean>;
+    compareRectangle(rect: IRectangle, imageName: string, timeOutSeconds?: number, tollerance?: number): Promise<boolean>;
     compareScreen(imageName: string, timeOutSeconds?: number, tollerance?: number): Promise<boolean>;
     private compare(imageName, timeOutSeconds?, tollerance?, rect?);
     prepareImageToCompare(filePath: string, rect: IRectangle): Promise<void>;

lib/appium-driver.ts

@@ -122,7 +122,7 @@ export class AppiumDriver {
      */
     public async findElementByXPath(xPath: string, waitForElement: number = this.defaultWaitTime) {
         const searchM = "waitForElementByXPath";
-        return await new UIElement(await this._driver.waitForElementByXPath(xPath, waitForElement), this._driver, this._wd, this._webio, searchM, xPath);
+        return await new UIElement(await this._driver.waitForElementByXPath(xPath, waitForElement), this._driver, this._wd, this._webio, this._args, searchM, xPath);
     }
 
     /**
@@ -163,7 +163,7 @@ export class AppiumDriver {
      * @param waitForElement 
      */
     public async findElementByClassName(className: string, waitForElement: number = this.defaultWaitTime) {
-        return new UIElement(await this._driver.waitForElementByClassName(className, waitForElement), this._driver, this._wd, this._webio, "waitForElementByClassName", className);
+        return new UIElement(await this._driver.waitForElementByClassName(className, waitForElement), this._driver, this._wd, this._webio, this._args, "waitForElementByClassName", className);
     }
 
     /**
@@ -182,7 +182,7 @@ export class AppiumDriver {
      * @param waitForElement 
      */
     public async findElementByAccessibilityId(id, waitForElement: number = this.defaultWaitTime) {
-        return new UIElement(await this._driver.waitForElementByAccessibilityId(id, waitForElement), this._driver, this._wd, this._webio, "waitForElementByAccessibilityId", id);
+        return new UIElement(await this._driver.waitForElementByAccessibilityId(id, waitForElement), this._driver, this._wd, this._webio, this._args, "waitForElementByAccessibilityId", id);
     }
 
     /**
@@ -271,10 +271,10 @@ export class AppiumDriver {
     }
 
     public async compareElement(element: UIElement, imageName: string, ) {
-        return await this.compareRectangles(await element.getRectangle(), imageName);
+        return await this.compareRectangle(await element.getActualRectangle(), imageName);
     }
 
-    public async compareRectangles(rect: IRectangle, imageName: string, timeOutSeconds: number = 3, tollerance: number = 0.01) {
+    public async compareRectangle(rect: IRectangle, imageName: string, timeOutSeconds: number = 3, tollerance: number = 0.01) {
         return await this.compare(imageName, timeOutSeconds, tollerance, rect);
     }
 
@@ -452,7 +452,7 @@ export class AppiumDriver {
             return arrayOfUIElements;
         }
         array.forEach(async element => {
-            arrayOfUIElements.push(new UIElement(await element, this._driver, this._wd, this._webio, searchM, args, i));
+            arrayOfUIElements.push(new UIElement(await element, this._driver, this._wd, this._webio, this._args, searchM, args, i));
             i++;
         });
 

lib/ui-element.d.ts

@@ -1,14 +1,16 @@
 import { Point } from "./point";
 import { Direction } from "./direction";
+import { INsCapabilities } from "./interfaces/ns-capabilities";
 export declare class UIElement {
     private _element;
     private _driver;
     private _wd;
     private _webio;
+    private _args;
     private _searchMethod;
     private _searchParams;
     private _index;
-    constructor(_element: any, _driver: any, _wd: any, _webio: any, _searchMethod: string, _searchParams: string, _index?: number);
+    constructor(_element: any, _driver: any, _wd: any, _webio: any, _args: INsCapabilities, _searchMethod: string, _searchParams: string, _index?: number);
     /**
      * Click on element
      */
@@ -69,6 +71,15 @@ export declare class UIElement {
         width: number;
         height: number;
     }>;
+    /**
+     * Get rectangle of element in actual dimensions
+     */
+    getActualRectangle(): Promise<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }>;
     /**
      * Scroll with offset from elemnt with minimum inertia
      * @param direction

lib/ui-element.ts

@@ -1,10 +1,19 @@
 import { Point } from "./point";
 import { Direction } from "./direction";
+import { INsCapabilities } from "./interfaces/ns-capabilities";
 import { IRectangle } from "./interfaces/rectangle";
 import { calculateOffset } from "./utils";
 
 export class UIElement {
-    constructor(private _element: any, private _driver: any, private _wd: any, private _webio: any, private _searchMethod: string, private _searchParams: string, private _index?: number) { }
+    constructor(private _element: any,
+        private _driver: any,
+        private _wd: any,
+        private _webio: any,
+        private _args: INsCapabilities,
+        private _searchMethod: string,
+        private _searchParams: string,
+        private _index?: number
+    ) { }
 
     /**
      * Click on element
@@ -109,6 +118,21 @@ export class UIElement {
         return rect;
     }
 
+    /**
+     * Get rectangle of element in actual dimensions
+     */
+    public async getActualRectangle() {
+        const actRect = await this.getRectangle();
+        if (this._args.isIOS) {
+            const density = this._args.device.config.density;
+            actRect.x *= density;
+            actRect.y *= density;
+            actRect.width *= density;
+            actRect.height *= density;
+        }
+        return actRect;
+    }
+
     /**
      * Scroll with offset from elemnt with minimum inertia
      * @param direction