test(ios): add repeater and webview safe area tests (#6578)

tests/app/testRunner.ts

@@ -136,11 +136,15 @@ allTests["FLEXBOXLAYOUT"] = flexBoxLayoutTests;
 import * as safeAreaLayoutTests from "./ui/layouts/safe-area-tests";
 import * as safeAreaListViewtTests from "./ui/list-view/list-view-safe-area-tests";
 import * as scrollViewSafeAreaTests from "./ui/scroll-view/scroll-view-safe-area-tests";
+import * as repeaterSafeAreaTests from "./ui/repeater/repeater-safe-area-tests";
+import * as webViewSafeAreaTests from "./ui/web-view/web-view-safe-area-tests";
 
 if (platform.isIOS && ios.MajorVersion > 10) {
     allTests["SAFEAREALAYOUT"] = safeAreaLayoutTests;
     allTests["SAFEAREA-LISTVIEW"] = safeAreaListViewtTests;
     allTests["SAFEAREA-SCROLL-VIEW"] = scrollViewSafeAreaTests;
+    allTests["SAFEAREA-REPEATER"] = repeaterSafeAreaTests;
+    allTests["SAFEAREA-WEBVIEW"] = webViewSafeAreaTests;
 }
 
 import * as stylePropertiesTests from "./ui/styling/style-properties-tests";

tests/app/ui/repeater/repeater-safe-area-tests.ts

@@ -0,0 +1,95 @@
+import * as helper from "../helper";
+import * as TKUnit from "../../TKUnit";
+import { parse } from "tns-core-modules/ui/builder";
+import * as view from "tns-core-modules/ui/core/view";
+import * as platform from "tns-core-modules/platform";
+import { Repeater } from "tns-core-modules/ui/repeater";
+import { ios as iosUtils } from "tns-core-modules/utils/utils";
+import { UITest } from "../../ui-test";
+import {
+    dipToDp, left, top, right, bottom, height, width,
+    equal, check, lessOrCloseEnough, greaterOrCloseEnough,
+    isLeftAlignedWith, isRightAlignedWith, isTopAlignedWith
+} from "../layouts/layout-tests-helper";
+
+export class RepeaterSafeAreaTest extends UITest<Repeater> {
+
+    private executeSnippet<U extends { root: view.View }>(ui: U, setup: (ui: U) => void, test: (ui: U) => void, pageOptions?: helper.PageOptions): void {
+        function waitUntilTestElementLayoutIsValid(view: view.View, timeoutSec?: number): void {
+            TKUnit.waitUntilReady(() => {
+                return view.isLayoutValid;
+            }, timeoutSec || 1);
+        }
+
+        setup(ui);
+        helper.buildUIAndRunTest(ui.root, () => {
+            waitUntilTestElementLayoutIsValid(ui.root);
+            test(ui);
+        }, pageOptions);
+    };
+
+    private noop() {
+        // no operation
+    };
+
+    private getViews(template: string) {
+        let root = parse(template);
+        return {
+            root,
+            list: root.getViewById("repeater") as Repeater
+        };
+    };
+
+    private repeater_in_full_screen(repeater: Repeater, pageOptions?: helper.PageOptions) {
+        let expectedTop = 0;
+        if (pageOptions && pageOptions.actionBarFlat) {
+            const actionBarHeight = round(dipToDp(repeater.page.actionBar.nativeViewProtected.frame.size.height));
+            const app = iosUtils.getter(UIApplication, UIApplication.sharedApplication);
+            const statusBarHeight = round(dipToDp(app.statusBarFrame.size.height));
+            expectedTop = actionBarHeight + statusBarHeight;
+        }
+
+        const l = left(repeater);
+        const t = top(repeater);
+        const r = right(repeater);
+        const b = bottom(repeater);
+        equal(l, 0, `${repeater}.left - actual:${l}; expected: ${0}`);
+        equal(t, expectedTop, `${repeater}.top - actual:${t}; expected: ${expectedTop}`);
+        equal(r, platform.screen.mainScreen.widthPixels, `${repeater}.right - actual:${r}; expected: ${platform.screen.mainScreen.widthPixels}`);
+        equal(b, platform.screen.mainScreen.heightPixels, `${repeater}.bottom - actual:${b}; expected: ${platform.screen.mainScreen.heightPixels}`);
+    }
+
+    private repeater_in_full_screen_test(pageOptions?: helper.PageOptions) {
+        const snippet = `
+        <Repeater id="repeater" loaded="onLoaded" backgroundColor="Crimson"></Repeater>
+        `;
+        this.executeSnippet(
+            this.getViews(snippet),
+            this.noop,
+            ({ list }) => {
+                this.repeater_in_full_screen(list, pageOptions);
+            },
+            pageOptions
+        );
+    }
+
+    public test_repeater_in_full_screen_action_bar() {
+        this.repeater_in_full_screen_test({ actionBar: true });
+    }
+
+    public test_repeater_in_full_screen_action_bar_hidden() {
+        this.repeater_in_full_screen_test({ actionBarHidden: true });
+    }
+
+    public test_repeater_in_full_screen_action_bar_flat() {
+        this.repeater_in_full_screen_test({ actionBarFlat: true });
+    }
+
+    public test_repeater_in_full_screen_tab_bar() {
+        this.repeater_in_full_screen_test({ tabBar: true });
+    }
+}
+
+export function createTestCase(): RepeaterSafeAreaTest {
+    return new RepeaterSafeAreaTest();
+}

tests/app/ui/web-view/web-view-safe-area-tests.ts

@@ -0,0 +1,95 @@
+import * as helper from "../helper";
+import * as TKUnit from "../../TKUnit";
+import { parse } from "tns-core-modules/ui/builder";
+import * as view from "tns-core-modules/ui/core/view";
+import * as platform from "tns-core-modules/platform";
+import { WebView } from "tns-core-modules/ui/web-view";
+import { ios as iosUtils } from "tns-core-modules/utils/utils";
+import { UITest } from "../../ui-test";
+import {
+    dipToDp, left, top, right, bottom, height, width,
+    equal, check, lessOrCloseEnough, greaterOrCloseEnough,
+    isLeftAlignedWith, isRightAlignedWith, isTopAlignedWith
+} from "../layouts/layout-tests-helper";
+
+export class WebViewSafeAreaTest extends UITest<WebView> {
+
+    private executeSnippet<U extends { root: view.View }>(ui: U, setup: (ui: U) => void, test: (ui: U) => void, pageOptions?: helper.PageOptions): void {
+        function waitUntilTestElementLayoutIsValid(view: view.View, timeoutSec?: number): void {
+            TKUnit.waitUntilReady(() => {
+                return view.isLayoutValid;
+            }, timeoutSec || 1);
+        }
+
+        setup(ui);
+        helper.buildUIAndRunTest(ui.root, () => {
+            waitUntilTestElementLayoutIsValid(ui.root);
+            test(ui);
+        }, pageOptions);
+    };
+
+    private noop() {
+        // no operation
+    };
+
+    private getViews(template: string) {
+        let root = parse(template);
+        return {
+            root,
+            list: root.getViewById("webview") as WebView
+        };
+    };
+
+    private webview_in_full_screen(webView: WebView, pageOptions?: helper.PageOptions) {
+        let expectedTop = 0;
+        if (pageOptions && pageOptions.actionBarFlat) {
+            const actionBarHeight = round(dipToDp(webView.page.actionBar.nativeViewProtected.frame.size.height));
+            const app = iosUtils.getter(UIApplication, UIApplication.sharedApplication);
+            const statusBarHeight = round(dipToDp(app.statusBarFrame.size.height));
+            expectedTop = actionBarHeight + statusBarHeight;
+        }
+
+        const l = left(webView);
+        const t = top(webView);
+        const r = right(webView);
+        const b = bottom(webView);
+        equal(l, 0, `${webView}.left - actual:${l}; expected: ${0}`);
+        equal(t, expectedTop, `${webView}.top - actual:${t}; expected: ${expectedTop}`);
+        equal(r, platform.screen.mainScreen.widthPixels, `${webView}.right - actual:${r}; expected: ${platform.screen.mainScreen.widthPixels}`);
+        equal(b, platform.screen.mainScreen.heightPixels, `${webView}.bottom - actual:${b}; expected: ${platform.screen.mainScreen.heightPixels}`);
+    }
+
+    private webview_in_full_screen_test(pageOptions?: helper.PageOptions) {
+        const snippet = `
+        <WebView id="webview" loaded="onLoaded" backgroundColor="Crimson"></WebView>
+        `;
+        this.executeSnippet(
+            this.getViews(snippet),
+            this.noop,
+            ({ list }) => {
+                this.webview_in_full_screen(list, pageOptions);
+            },
+            pageOptions
+        );
+    }
+
+    public test_webview_in_full_screen_action_bar() {
+        this.webview_in_full_screen_test({ actionBar: true });
+    }
+
+    public test_webview_in_full_screen_action_bar_hidden() {
+        this.webview_in_full_screen_test({ actionBarHidden: true });
+    }
+
+    public test_webview_in_full_screen_action_bar_flat() {
+        this.webview_in_full_screen_test({ actionBarFlat: true });
+    }
+
+    public test_webview_in_full_screen_tab_bar() {
+        this.webview_in_full_screen_test({ tabBar: true });
+    }
+}
+
+export function createTestCase(): WebViewSafeAreaTest {
+    return new WebViewSafeAreaTest();
+}