tests: include tests action bar (#7596)

* tests: update action bar tests

* revert: widgets version in modules

* fix tslint

e2e/ui-tests-app/README.md

@@ -1,17 +1,21 @@
 ***e2e tests execution***
 
 1. Local setup
-    - install appium and all requirments related to how to use `nativescript-dev-appium` plugin
+    - install appium and all requirments related to `nativescript-dev-appium` plugin usage
     - download images: 
     
-        ```npm run load-images Emulator-Api23-Default```
+        ```npm run load-images Emulator-Api23-Default "iPhone X 12"```
 
         or load multiple folders:
 
-        ``` npm run load-images Emulator-Api23-Default Emulator-Google-Api28```
+        ``` npm run load-images Emulator-Api23-Default Emulator-Google-Api28 "iPhone X 12"```
 
-        This command will download https://github.com/NativeScript/functional-tests-images/tree/master/uitestsapp and sparse all passed directories [emulator-name|simulator-name] [emulator-name|simulator-name] [emulator-name|simulator-name]
+        or load all folders:
-    - name your device so that it matches folder name, respectively api level and density of emulators. 
+
+        ``` npm run load-images all```
+
+        This command will download https://github.com/NativeScript/functional-tests-images/tree/master/uitestsapp and sparse all passed directories [emulator-name|simulator-name]
+    - rename/ create your device so that it matches folder name, respectively api level and density of emulators. 
     
         You can also use scripts:
     
@@ -19,7 +23,7 @@
     
         If you need to download system image and create emulator use:
 
-        `npm run update-emulators -u`
+        `npm run update-emulators -- --update-system-images`
 2. Test execution
     - Run test compilation in separate terminal and don't kill it.
     
@@ -31,8 +35,8 @@
 3. Debug test.
     - Run:
 
-        `npm run test-debug [android|ios]`
+        `npm run e2e-debug [android|ios]`
-in separate console and don't kill it. This command will start appium server and driver and use the installed app on the device but it will not execute tests.
+run in separate console and don't kill it. This command will start appium server and driver and use the installed app on the device but it will not execute tests.
     - Go to vs code debugging and use a config like:
 
     ```
@@ -48,13 +52,15 @@ in separate console and don't kill it. This command will start appium server and
                 "--opts",
                 "../config/mocha.opts",
                 "--attachToDebug",
+                "--grpe",
+                "button"
             ],
             "internalConsoleOptions": "openOnSessionStart"
         }
 
 ***mocha options***
 
-mocha opt file is plased in "../config/mocha.opts".
+mocha opt file is located at "../config/mocha.opts".
 
        --timeout 999999
        --recursive e2e
@@ -63,4 +69,8 @@ mocha opt file is plased in "../config/mocha.opts".
        --exit
 
 
-- grep particular suites: "--grep=tabs-tab(s-\\w+)-suite"
+***grep particular suit or test***
+
+` npm run e2e ios -- --grep=tabs-tab(s-\\w+)-suite`
+
+

e2e/ui-tests-app/app/action-bar/action-item-position-page.xml

@@ -1,7 +1,7 @@
 <Page
   xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo">
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionItem ios.position="right" tap="{{ change }}">
         <Button text="{{ text }}" backgroundColor="red" />
       </ActionItem>

e2e/ui-tests-app/app/action-bar/action-view-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionBar.actionItems>
         <ActionItem tap="navigate">
           <ActionItem.actionView>

e2e/ui-tests-app/app/action-bar/all-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar title="Page Title" style="background-color: blue; color: yellow;">
+    <ActionBar title="Page Title" style="background-color: blue; color: yellow;" automationText="actionBar">
       <NavigationButton text="go back"/>
       <ActionBar.actionItems>
         <ActionItem text="ITEM" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/background-css-page.xml

@@ -1,5 +1,5 @@
 <Page>
-  <ActionBar title="This is RED" class="action" />
+  <ActionBar title="This is RED" class="action"  automationText="actionBar"/>
   <StackLayout>
     <Button text="go to cleared page" tap="navigate"/>
   </StackLayout>

e2e/ui-tests-app/app/action-bar/background-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar title="Page Title" style="background-color: green;">
+    <ActionBar title="Page Title" style="background-color: green;" automationText="actionBar">
       <NavigationButton text="go back"/>
       <ActionBar.actionItems>
         <ActionItem text="ITEM" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/clean-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar title="Page Title">
+    <ActionBar title="Page Title" automationText="actionBar">
       <NavigationButton text="go back"/>
       <ActionBar.actionItems>
         <ActionItem text="ITEM" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/color-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar title="Page Title" style="color: green;">
+    <ActionBar title="Page Title" style="color: green;" automationText="actionBar">
       <NavigationButton text="go back"/>
       <ActionBar.actionItems>
         <ActionItem text="ITEM" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/flat-layout-page.xml

@@ -1,6 +1,6 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
 
-    <ActionBar flat="true" backgroundColor="blue">
+    <ActionBar flat="true" backgroundColor="blue" automationText="actionBar">
         <Label text="flat action bar"></Label>
     </ActionBar>
 

e2e/ui-tests-app/app/action-bar/flat-page.xml

@@ -1,6 +1,6 @@
 <Page navigatedTo="onNavigateTo" backgroundColor="yellow">
   
-  <ActionBar backgroundColor="blue">
+  <ActionBar backgroundColor="blue" automationText="actionBar">
       <Label text="flat action bar"></Label>
   </ActionBar>
 

e2e/ui-tests-app/app/action-bar/flat-scrollview-page.xml

@@ -1,6 +1,6 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
 
-    <ActionBar flat="true" backgroundColor="blue">
+    <ActionBar flat="true" backgroundColor="blue" automationText="actionBar">
         <Label text="flat action bar"></Label>
     </ActionBar>
 

e2e/ui-tests-app/app/action-bar/flat-tab-opaque-bar-page.xml

@@ -1,5 +1,5 @@
 <Page backgroundColor="yellow">
-  <ActionBar flat="true" backgroundColor="blue">
+  <ActionBar flat="true" backgroundColor="blue" automationText="actionBar">
       <Label text="flat action bar"></Label>
   </ActionBar>
 

e2e/ui-tests-app/app/action-bar/flat-tab-page.xml

@@ -1,6 +1,6 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
 
-    <ActionBar flat="true" backgroundColor="blue">
+    <ActionBar flat="true" backgroundColor="blue" automationText="actionBar">
         <Label text="flat action bar"></Label>
     </ActionBar>
 

e2e/ui-tests-app/app/action-bar/font-icons-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionBar.actionItems>
         <!-- font family + font size + color -->
         <ActionItem icon="font://&#xF10B;" class="font-awesome font-size color" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/icons-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionBar.actionItems>
         <ActionItem icon="res://icon" tap="navigate"/>
         <ActionItem icon="res://add_to_fav" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/local-icons-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionBar.actionItems>
         <ActionItem icon="~/resources/images/icon.png" tap="navigate"/>
         <ActionItem icon="~/resources/images/add_to_fav@3x.png" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/modal-page-hidden-action-bar-page.xml

@@ -1,4 +1,4 @@
-<Page showingModally="onShownModally" actionBarHidden="true">
+<Page showingModally="onShownModally" actionBarHidden="true" automationText="actionBar">
     <StackLayout id="layout" >
         <Button text="Close" tap="onTap" />
     </StackLayout>

e2e/ui-tests-app/app/action-bar/modal-test-hidden-action-bar-page.xml

@@ -1,4 +1,4 @@
-<Page xmlns="http://schemas.nativescript.org/tns.xsd" actionBarHidden="true">
+<Page xmlns="http://schemas.nativescript.org/tns.xsd" actionBarHidden="true" automationText="actionBar">
   <StackLayout>
     <button text="Open Modal" tap="btnClick" />
     <button text="Go Back" tap="btnBack" />

e2e/ui-tests-app/app/action-bar/modal-test-with-action-bar-page.xml

@@ -1,6 +1,6 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd">
     <Page.actionBar>
-        <ActionBar backgroundColor="green" title="Main View" icon="">
+        <ActionBar backgroundColor="green" title="Main View" icon="" automationText="actionBar">
             <NavigationButton text="Back" icon="" tap="" />
             <ActionBar.actionItems>
                 <ActionItem icon="" text="Left" tap="" ios.position="left" />

e2e/ui-tests-app/app/action-bar/system-icons-page.xml

@@ -1,6 +1,6 @@
 <Page>
   <Page.actionBar>
-    <ActionBar>
+    <ActionBar automationText="actionBar">
       <ActionBar.actionItems>
         <ActionItem ios.systemIcon="12" android.systemIcon="ic_menu_search" tap="navigate"/>
         <ActionItem ios.systemIcon="15" android.systemIcon="ic_menu_camera" tap="navigate"/>

e2e/ui-tests-app/app/action-bar/transparent-bg-css-page.xml

@@ -1,5 +1,5 @@
 <Page>
-  <ActionBar title="This is transparent" class="action" />
+  <ActionBar title="This is transparent" class="action" automationText="actionBar"/>
   <StackLayout>
     <Button text="go to cleared page" tap="navigate"/>
   </StackLayout>

e2e/ui-tests-app/e2e/helpers/image-helper.ts

@@ -1,6 +1,14 @@
 
 export const setImageName = (suite: string, spec: string, testsName: string) => {
-    const testName = `${suite}-${spec}-${testsName.replace(suite, "").replace(spec, "")}`.replace(/(\-+)/ig, "-").replace(/(\_+)/ig, "_");
+    let testName = testsName
+        .replace(suite, "")
+        .replace(spec, "");
+    testName = `${suite}-${spec}-${testName}`
+        .replace("should", "-")
+        .replace(/\s+/g, "-")
+        .replace(/\_+/ig, "_")
+        .replace(/[!$%^&*()+|~=`{}\[\]:";'<>?,.\/]/g, "")
+        .replace(/\-+/g, "-");
 
     return testName;
 };

e2e/ui-tests-app/e2e/helpers/navigation-helper.ts

@@ -107,9 +107,10 @@ export class NavigationHelper {
         const endPoint = <Point>{};
 
         if (this._driver.isIOS) {
+            const rect = this._driver.getScreenActualViewPort();
             startPoint.x = 5;
-            startPoint.y = this._driver.nsCapabilities.device.viewportRect.y / this._driver.nsCapabilities.device.config.density;
+            startPoint.y = rect.y;
-            endPoint.x = (this._driver.nsCapabilities.device.viewportRect.width / this._driver.nsCapabilities.device.config.density) - 5;
+            endPoint.x = (rect.width / this._driver.nsCapabilities.device.deviceScreenDensity) - 5;
             endPoint.y = startPoint.y;
 
             await this._driver.swipe(startPoint, endPoint);

e2e/ui-tests-app/e2e/suites/action-bar/action-bar-base-page.ts

@@ -0,0 +1,13 @@
+import { AppiumDriver } from "nativescript-dev-appium";
+import { PageObjectBaseModel } from "../../page-object-base-model";
+
+export class ActionBarBasePage extends PageObjectBaseModel {
+    private readonly automationText: string = "actionBar";
+    constructor(_driver: AppiumDriver) {
+        super(_driver, ["action-bar"]);
+    }
+
+    get actionBar() {
+        return this._driver.waitForElement(this.automationText);
+    }
+}

e2e/ui-tests-app/e2e/suites/action-bar/action-bar-tests.e2e-spec.ts

@@ -0,0 +1,307 @@
+import { nsCapabilities, createDriver, AppiumDriver, SearchOptions, logError } from "nativescript-dev-appium";
+import { ActionBarBasePage } from "./action-bar-base-page";
+import { assert } from "chai";
+import { setImageName } from "../../helpers/image-helper";
+// import { unlinkSync, existsSync } from "fs";
+
+const suite = "action-bar";
+const testNamePrefix = `${suite}: `;
+
+describe(`${suite}-suite`, async function () {
+    let driver: AppiumDriver;
+    let actionBarBasePage: ActionBarBasePage;
+
+    before(async function () {
+        nsCapabilities.testReporter.context = this;
+        driver = await createDriver();
+        await driver.restartApp();
+        actionBarBasePage = new ActionBarBasePage(driver);
+        await actionBarBasePage.initSuite();
+    });
+
+    after(async function () {
+        await actionBarBasePage.endSuite();
+    });
+
+    beforeEach(async function () {
+        driver.imageHelper.testName = setImageName(suite, "", this.currentTest.title);
+        driver.imageHelper.options = {
+            donNotAppendActualSuffixOnIntialImageCapture: true
+        };
+    });
+
+    afterEach(async function () {
+        if (this.currentTest.state === "failed") {
+            await driver.logTestArtifacts(this.currentTest.title);
+            // await driver.resetApp();
+            // await actionBarBasePage.initSuite();
+        }
+    });
+
+    const btnGoToClearPageTap = async () => {
+        await clickOnElement("go to cleared page");
+    };
+
+    const btnGoToPrevPageTap = async () => {
+        await clickOnElement("go to previous page");
+    };
+
+    const btnTap = async () => {
+        await clickOnElement("Tap");
+    };
+
+    const clickOnElement = async (automationText: string) => {
+        const el = await driver.waitForElement(automationText);
+        if (el === null) {
+            logError(`Element ${automationText} not found!`);
+            assert.isTrue(false, `Element ${automationText} should be visible`);
+        }
+        await el.click();
+    };
+
+    it(`${testNamePrefix}"actBG", set background color`, async function () {
+        await actionBarBasePage.navigateToSample("actBG");
+        await driver.imageHelper.compareScreen();
+
+        await btnGoToClearPageTap();
+        await driver.imageHelper.compareScreen();
+
+        await btnGoToPrevPageTap();
+        await driver.imageHelper.compareScreen();
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"actBGCss", issue-516`, async function () {
+        await actionBarBasePage.navigateToSample("actBGCss");
+        const imageNameRed = setImageName(suite, "", `${testNamePrefix} should navigate to "actBGCss" issue-516-red`);
+        const imageNameTrans = setImageName(suite, "", `${testNamePrefix} should navigate to "actBGCss" issue-516-trans`);
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar, { imageName: imageNameRed, keepOriginalImageName: true });
+        await btnGoToClearPageTap();
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar, { imageName: imageNameTrans, keepOriginalImageName: true });
+
+        await btnGoToPrevPageTap();
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar, { imageName: imageNameRed, keepOriginalImageName: true });
+
+        await btnGoToClearPageTap();
+        await (await driver.waitForElement("ITEM")).click();
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar, { imageName: imageNameRed, keepOriginalImageName: true });
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"actColor", should set text color`, async function () {
+        await actionBarBasePage.navigateToSample("actColor");
+        const result = await driver.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix}"actIcons"`, async function () {
+        await actionBarBasePage.navigateToSample("actIcons");
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix}"actLocalIcons"`, async function () {
+        await actionBarBasePage.navigateToSample("actLocalIcons");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("undefined");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("alwaysTemplate");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("undefined");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("automatic");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"actResIcons"`, async function () {
+        await actionBarBasePage.navigateToSample("actResIcons");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("undefined");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("alwaysTemplate");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("undefined");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+
+        await clickOnElement("automatic");
+        await driver.imageHelper.compareElement(await actionBarBasePage.actionBar);
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix} should navigate to actStyle`, async function () {
+        await actionBarBasePage.navigateToSample("actStyle");
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} should "go to cleared page"`, async function () {
+        await btnGoToClearPageTap();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} should "go to previous page"`, async function () {
+        await btnGoToPrevPageTap();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} click on "ITEM" and navigate to clean page`, async function () {
+        await (await driver.waitForElement("ITEM")).click();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} click on "ITEM" and navigate to action bar style initial page`, async function () {
+        await (await driver.waitForElement("ITEM")).click();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar, `${suite}-navigate-to-actStyle`);
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} should navigate to "actView"`, async function () {
+        await actionBarBasePage.navigateToSample("actView");
+        const result = await driver.compareElement(await actionBarBasePage.actionBar);
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} should navigate with "Green" button`, async function () {
+        await (await driver.waitForElement("Green")).click();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar, setImageName(suite, ``, `${testNamePrefix} should "go to cleared page"`));
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix} should navigate back with "BACK"`, async function () {
+        await driver.navBack();
+        const result = await driver.compareElement(await actionBarBasePage.actionBar, setImageName(suite, "", `${testNamePrefix} should navigate to "actView"`));
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(result);
+    });
+
+    it(`${testNamePrefix}"actionItemPosition",should change item position`, async function () {
+        await actionBarBasePage.navigateToSample("actionItemPosition");
+        await driver.imageHelper.compareScreen();
+
+        await btnTap();
+        await driver.imageHelper.compareScreen();
+
+        await btnTap();
+        await driver.imageHelper.compareScreen();
+
+        await btnTap();
+        await driver.imageHelper.compareScreen();
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"actTransparentBgCss", page background color as actBackground color`, async function () {
+        await actionBarBasePage.navigateToSample("actTransparentBgCss");
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("go to cleared page")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("ITEM")).click();
+        await driver.imageHelper.compareScreen();
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix} should navigate to "modalShownActBar" nav back with "Go Back"`, async function () {
+        await actionBarBasePage.navigateToSample("modalShownActBar");
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Open Modal")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Close")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Go Back")).click();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix} should navigate to "modalHiddenActBar" nav back with "Go Back"`, async function () {
+        await actionBarBasePage.navigateToSample("modalHiddenActBar");
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Open Modal")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Change text")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Close")).click();
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("Go Back")).click();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"flat", change`, async function () {
+        await actionBarBasePage.navigateToSample("flat");
+        await driver.imageHelper.compareScreen();
+
+        await (await driver.waitForElement("change flat property")).click();
+        await driver.imageHelper.compareScreen();
+
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}flat-layout"`, async function () {
+        await actionBarBasePage.navigateToSample("flat-layout");
+        await driver.imageHelper.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}flat-scrollview`, async function () {
+        await actionBarBasePage.navigateToSample("flat-scrollview");
+        await driver.imageHelper.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}"flat-tab"`, async function () {
+        await actionBarBasePage.navigateToSample("flat-tab");
+        await driver.imageHelper.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    // BUG
+    it(`${testNamePrefix}flat-opaque-bar`, async function () {
+        this.skip();
+        await actionBarBasePage.navigateToSample("flat-tab-opaque-bar");
+        await driver.imageHelper.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+
+    it(`${testNamePrefix}font-icons`, async function () {
+        await actionBarBasePage.navigateToSample("font-icons");
+        await driver.imageHelper.compareScreen();
+        await actionBarBasePage.navigateBackToSuitMainPage();
+        assert.isTrue(driver.imageHelper.hasImageComparisonPassed());
+    });
+});

e2e/ui-tests-app/e2e/suites/button/background/button-background-page.ts

@@ -8,7 +8,6 @@ export class ButtonBackgroundPage extends PageObjectBaseModel {
 
     constructor(_driver: AppiumDriver) {
         super(_driver, ["button", "background"], ElementCacheStrategy.none);
-        this._driver.imageHelper.options.toleranceType = ImageOptions.percent;
     }
 
     public viewGroupLocator() {

e2e/ui-tests-app/e2e/suites/button/background/button-background.e2e-spec.ts

@@ -17,7 +17,6 @@ describe(`${imagePrefix}-suite`, () => {
         await driver.restartApp();
         backgroundPage = new ButtonBackgroundPage(driver);
         await backgroundPage.initSuite();
-        driver.imageHelper.options.donNotAppendActualSuffixOnIntialImageCapture = true;
     });
 
     after(async function () {

e2e/ui-tests-app/e2e/suites/tab-navigation/bottom-navigation/bottom-navigation-css-properties.e2e-spec.ts

@@ -1,7 +1,6 @@
 import { nsCapabilities, createDriver, AppiumDriver, Direction } from "nativescript-dev-appium";
 import { BottomNavigationBasePage } from "./bottom-navigation-base-page";
 import { Platform } from "mobile-devices-controller";
-import { ElementCacheStrategy } from "../../../helpers/navigation-helper";
 import { setImageName } from "../../../helpers/image-helper";
 import { assert } from "chai";
 
@@ -22,6 +21,7 @@ describe(`${imagePrefix}-suite`, async function () {
     ];
 
     before(async function () {
+        this.skip();
         nsCapabilities.testReporter.context = this;
         driver = await createDriver();
         await driver.restartApp();
@@ -30,10 +30,12 @@ describe(`${imagePrefix}-suite`, async function () {
     });
 
     after(async function () {
+        this.skip();
         await bottomNavigationBasePage.endSuite();
     });
 
     afterEach(async function () {
+        this.skip();
         if (this.currentTest.state === "failed") {
             await driver.logTestArtifacts(this.currentTest.title);
             await driver.restartApp();

e2e/ui-tests-app/e2e/suites/tab-navigation/tab-navigation-base-page.ts

@@ -1,7 +1,6 @@
 import { AppiumDriver, Point, IRectangle, UIElement, logInfo, logWarn } from "nativescript-dev-appium";
 import { PageObjectBaseModel } from "../../page-object-base-model";
 import { ElementCacheStrategy } from "../../helpers/navigation-helper";
-import { ImageOptions } from "nativescript-dev-appium/lib/image-options";
 
 export abstract class TabNavigationBasePage extends PageObjectBaseModel {
     protected bottomNavigatioinTabRect: IRectangle;

e2e/ui-tests-app/e2e/suites/tab-navigation/tabs/tabs-tests.e2e-spec.ts

@@ -25,9 +25,6 @@ describe(`${imagePrefix}-suite`, async function () {
 
     beforeEach(async function () {
         driver.imageHelper.testName = setImageName(suite, spec, this.currentTest.title);
-        driver.imageHelper.options = {
-            donNotAppendActualSuffixOnIntialImageCapture: true
-        };
     });
 
     afterEach(async function () {

tns-core-modules/package.json

@@ -26,7 +26,7 @@
   "license": "Apache-2.0",
   "typings": "tns-core-modules.d.ts",
   "dependencies": {
-    "tns-core-modules-widgets": "6.0.1",
+    "tns-core-modules-widgets": "next",
     "tslib": "^1.9.3"
   },
   "devDependencies": {