fix(tabs-ios): unable to return to tab after tab with nested frame visited (#7574)

e2e/nested-frame-navigation/app/app.ts

@@ -1,5 +1,3 @@
 import * as application from "tns-core-modules/application";
 
 application.run({ moduleName: "app-root" });
-// application.run({ moduleName: "tab-root" });
-// application.run({ moduleName: "layout-root" });

e2e/nested-frame-navigation/app/bottom-navigation-page/bottom-navigation-page.xml

@@ -1,7 +1,7 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page">
 
     <ActionBar class="action-bar">
-        <NavigationButton text="tabBottomBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
+        <NavigationButton text="bottomNavigationBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
         <Label class="action-bar-title" text="bottom navigation page" horizontalAlignment="center" />
     </ActionBar>
     
@@ -16,9 +16,9 @@
         <GridLayout row="1">
             <BottomNavigation>
                 <TabStrip>
-                    <TabStripItem title="Players"></TabStripItem>
-                    <TabStripItem title="Dummy"></TabStripItem>
-                    <TabStripItem title="Teams"></TabStripItem>
+                    <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
+                    <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+                    <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
                 </TabStrip>
 
                 <TabContentItem>

e2e/nested-frame-navigation/app/bottom-navigation-root/bottom-navigation-root.xml

@@ -1,14 +1,14 @@
 <BottomNavigation>
     <TabStrip>
-        <TabStripItem title="Players"></TabStripItem>
+        <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
         <!-- this tab serves as dummy so the actual teams tab is not loaded by default  -->
-        <TabStripItem title="Dummy"></TabStripItem>
-        <TabStripItem title="Teams"></TabStripItem>
+        <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+        <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
     </TabStrip>
 
     <TabContentItem>
         <GridLayout rows="auto, auto, *">
-            <Label text="tabs root top home" />
+            <Label text="bottom navigation root home" />
             <Button row="1" text="reset app" tap="onReset" />
             <GridLayout row="2">
                 <Frame defaultPage="players/players-items-page" />

e2e/nested-frame-navigation/app/tab-page/tab-bottom-page.xml

@@ -1,7 +1,7 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page">
 
     <ActionBar class="action-bar">
-        <NavigationButton text="tabBottomBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
+        <NavigationButton text="tabViewBottomBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
         <Label class="action-bar-title" text="tabview bottom page" horizontalAlignment="center" />
     </ActionBar>
     

e2e/nested-frame-navigation/app/tab-page/tab-top-page.xml

@@ -1,7 +1,7 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page">
 
     <ActionBar class="action-bar">
-        <NavigationButton text="tabTopBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
+        <NavigationButton text="tabViewTopBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
         <Label class="action-bar-title" text="tabview top page" horizontalAlignment="center" />
     </ActionBar>
 

e2e/nested-frame-navigation/app/tabs-page/tabs-bottom-page.xml

@@ -1,7 +1,7 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page">
 
     <ActionBar class="action-bar">
-        <NavigationButton text="tabBottomBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
+        <NavigationButton text="tabsBottomBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
         <Label class="action-bar-title" text="tabs bottom page" horizontalAlignment="center" />
     </ActionBar>
     
@@ -16,9 +16,9 @@
         <GridLayout row="1">
             <Tabs tabsPosition="bottom">
                 <TabStrip>
-                    <TabStripItem title="Players"></TabStripItem>
-                    <TabStripItem title="Dummy"></TabStripItem>
-                    <TabStripItem title="Teams"></TabStripItem>
+                    <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
+                    <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+                    <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
                 </TabStrip>
 
                 <TabContentItem>

e2e/nested-frame-navigation/app/tabs-page/tabs-top-page.xml

@@ -1,7 +1,7 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page">
 
     <ActionBar class="action-bar">
-        <NavigationButton text="tabTopBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
+        <NavigationButton text="tabsTopBack" tap="onBackButtonTap" android.systemIcon="ic_menu_back" />
         <Label class="action-bar-title" text="tabs top page" horizontalAlignment="center" />
     </ActionBar>
 
@@ -16,9 +16,9 @@
         <GridLayout row="1">
             <Tabs tabsPosition="top">
                 <TabStrip>
-                    <TabStripItem title="Players"></TabStripItem>
-                    <TabStripItem title="Dummy"></TabStripItem>
-                    <TabStripItem title="Teams"></TabStripItem>
+                    <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
+                    <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+                    <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
                 </TabStrip>
 
                 <TabContentItem>

e2e/nested-frame-navigation/app/tabs-root/tabs-bottom-root.xml

@@ -1,14 +1,14 @@
 <Tabs tabsPosition="bottom">
     <TabStrip>
-        <TabStripItem title="Players"></TabStripItem>
+        <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
         <!-- this tab serves as dummy so the actual teams tab is not loaded by default  -->
-        <TabStripItem title="Dummy"></TabStripItem>
-        <TabStripItem title="Teams"></TabStripItem>
+        <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+        <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
     </TabStrip>
 
     <TabContentItem>
         <GridLayout rows="auto, auto, *">
-            <Label text="tabs root top home" />
+            <Label text="tabs root bottom home" />
             <Button row="1" text="reset app" tap="onReset" />
             <GridLayout row="2">
                 <Frame defaultPage="players/players-items-page" />

e2e/nested-frame-navigation/app/tabs-root/tabs-top-root.xml

@@ -1,9 +1,9 @@
-<Tabs tabsPosition="top">
+<Tabs tabsPosition="top" automationText="tabNavigation">
     <TabStrip>
-        <TabStripItem title="Players"></TabStripItem>
+        <TabStripItem title="Players" automationText="playersTabNavigation"></TabStripItem>
         <!-- this tab serves as dummy so the actual teams tab is not loaded by default  -->
-        <TabStripItem title="Dummy"></TabStripItem>
-        <TabStripItem title="Teams"></TabStripItem>
+        <TabStripItem title="Dummy" automationText="dummyTabNavigation"></TabStripItem>
+        <TabStripItem title="Teams" automationText="teamsTabNavigation"></TabStripItem>
     </TabStrip>
 
     <TabContentItem>

e2e/nested-frame-navigation/e2e/bottom-navigation-root.e2e-spec.ts

@@ -0,0 +1,180 @@
+import { AppiumDriver, createDriver, logWarn, nsCapabilities } from "nativescript-dev-appium";
+
+import { Screen, playersData, teamsData } from "./screen";
+import * as shared from "./shared.e2e-spec";
+import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
+
+const roots = ["BottomNavigation"];
+
+const rootType = "bottom-navigation-root";
+describe(rootType, async function () {
+    let driver: AppiumDriver;
+    let screen: Screen;
+
+    before(async function () {
+        nsCapabilities.testReporter.context = this;
+        logWarn(`====== ${rootType} ========`);
+        driver = await createDriver();
+        screen = new Screen(driver);
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(true);
+        }
+
+        driver.defaultWaitTime = 8000;
+    });
+
+    after(async function () {
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(false);
+        }
+        await driver.quit();
+        console.log("Quit driver!");
+    });
+
+    afterEach(async function () {
+        if (this.currentTest.state === "failed") {
+            await driver.logTestArtifacts(this.currentTest.title);
+        }
+    });
+
+    for (let index = 0; index < roots.length; index++) {
+        const root = roots[index];
+        describe(`${rootType}-${root}-scenarios:`, async function () {
+
+            before(async function () {
+                nsCapabilities.testReporter.context = this;
+            });
+
+            for (let index = 0; index < transitions.length; index++) {
+                const transition = transitions[index];
+
+                const playerOne = playersData[`playerOne${transition}`];
+                const playerTwo = playersData[`playerTwo${transition}`];
+                const teamOne = teamsData[`teamOne${transition}`];
+                const teamTwo = teamsData[`teamTwo${transition}`];
+
+                describe(`${rootType}-${root}-transition-${transition}-scenarios:`, async function () {
+
+                    before(async function () {
+                        nsCapabilities.testReporter.context = this;
+
+                        if (transition === "Flip" &&
+                            driver.isAndroid && parseInt(driver.platformVersion) === 19) {
+                            // TODO: known issue https://github.com/NativeScript/NativeScript/issues/6798
+                            console.log("skipping flip transition tests on api level 19");
+                            this.skip();
+                        }
+                    });
+
+                    it("loaded home page", async function () {
+                        await screen.loadedHome();
+                    });
+
+                    it(`loaded ${root} root with frames`, async function () {
+                        await screen[`navigateTo${root}RootWithFrames`]();
+                        await screen[`loaded${root}RootWithFrames`]();
+                    });
+
+                    it("loaded players list", async function () {
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and go back twice", async function () {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared.testPlayerNavigatedBack(screen, driver);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+                        await shared.testPlayerNavigatedBack(screen, driver);
+                    });
+
+                    it("toggle teams tab", async function () {
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(teamOne.name); // wait for teams list
+                        }
+                    });
+
+                    it("loaded teams list", async function () {
+                        await screen.loadedTeamsList();
+                    });
+
+                    it("mix player and team list actions and go back", async function () {
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await screen.loadedPlayersList();
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (driver.isIOS) {
+                            if (appSuspendResume) {
+                                await driver.backgroundApp(suspendTime);
+                                await driver.waitForElement(playerTwo.name); // wait for player
+                            }
+                        }
+
+                        await screen.toggleTeamsTab();
+
+                        if (driver.isIOS) {
+                            // TODO: run in background from appium breaks the test. Investigate the issue, once with the app and with appium
+                            if (appSuspendResume) {
+                                await driver.backgroundApp(suspendTime);
+                                await driver.waitForElement(teamOne.name); // wait for teams list
+                            }
+                        }
+
+                        await screen.loadedTeamsList();
+
+                        await shared.testTeamNavigated(teamTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        await screen.goBackToTeamsList();
+                        await screen.loadedTeamsList();
+
+                        await screen.togglePlayersTab();
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded home page again", async function () {
+                        await screen.resetToHome();
+                        await screen.loadedHome();
+                    });
+                });
+            }
+        });
+    }
+});

e2e/nested-frame-navigation/e2e/frame-bottom-navigation-root.e2e-spec.ts

@@ -0,0 +1,264 @@
+import { AppiumDriver, createDriver, logWarn, nsCapabilities } from "nativescript-dev-appium";
+
+import { Screen, playersData, somePage, teamsData, driverDefaultWaitTime, Item } from "./screen";
+import * as shared from "./shared.e2e-spec";
+import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
+
+const roots = ["BottomNavigation"];
+
+const rootType = "frame-bottom-navigation-root";
+describe(rootType, async function () {
+    let driver: AppiumDriver;
+    let screen: Screen;
+
+    before(async () => {
+        nsCapabilities.testReporter.context = this;
+        logWarn(`====== ${rootType} ========`);
+        driver = await createDriver();
+        screen = new Screen(driver);
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(true);
+        }
+
+        driver.defaultWaitTime = driverDefaultWaitTime;
+    });
+
+    after(async () => {
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(false);
+        }
+        await driver.quit();
+        console.log("Quit driver!");
+    });
+
+    afterEach(async function () {
+        if (this.currentTest.state === "failed") {
+            await driver.logTestArtifacts(this.currentTest.title);
+        }
+    });
+
+    for (let index = 0; index < roots.length; index++) {
+        const root = roots[index];
+
+        describe(`${rootType}-${root} scenarios:`, async function () {
+            logWarn(`===== Root: ${root}`);
+            for (let trIndex = 0; trIndex < transitions.length; trIndex++) {
+                const transition = transitions[trIndex];
+                const playerOne: Item = playersData[`playerOne${transition}`];
+                const playerTwo: Item = playersData[`playerTwo${transition}`];
+                const teamOne: Item = teamsData[`teamOne${transition}`];
+                const teamTwo: Item = teamsData[`teamTwo${transition}`];
+
+                describe(`${rootType}-${root}-transition-${transition}-scenarios:`, async function () {
+
+                    before(async function () {
+                        nsCapabilities.testReporter.context = this;
+                        logWarn(`========= ${root}-${transition} =========`);
+
+                        if (transition === "Flip" &&
+                            driver.isAndroid && parseInt(driver.platformVersion) === 19) {
+                            // TODO: known issue https://github.com/NativeScript/NativeScript/issues/6798
+                            console.log("skipping flip transition tests on api level 19");
+                            this.skip();
+                        }
+                    });
+
+                    it("loaded home page", async () => {
+                        await screen.loadedHome();
+                    });
+
+                    it(`loaded frame ${root} root with nested frames`, async () => {
+                        await screen[`navigateToPage${root}WithFrames`]();
+                        await screen[`loadedPage${root}WithFrames`]();
+                    });
+
+                    it("loaded players list", async () => {
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and go back twice", async () => {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared.testPlayerNavigatedBack(screen, driver);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+                        await shared.testPlayerNavigatedBack(screen, driver);
+                    });
+
+                    it("navigate parent frame and go back", async () => {
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and navigate parent frame and go back", async () => {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("toggle teams tab", async () => {
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamOne.name); // wait for team
+                        }
+                    });
+
+                    it("loaded teams list", async () => {
+                        await screen.loadedTeamsList();
+                    });
+
+                    it("mix player and team list actions and go back", async () => {
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerOne.name); // wait for players list
+                        }
+
+                        await screen.loadedPlayersList();
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        if (appSuspendResume) {
+                            // This sleeps prevent test to fail
+                            await driver.sleep(1000);
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamOne.name); // wait for teams list
+                        }
+
+                        await screen.loadedTeamsList();
+
+                        await shared.testTeamNavigated(teamTwo, screen);
+
+                        if (appSuspendResume) {
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.loadedTeamDetails(teamTwo);
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        if (appSuspendResume) {
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.loadedTeamDetails(teamTwo);
+
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        await screen.goBackToTeamsList();
+                        await screen.loadedTeamsList();
+
+                        await screen.togglePlayersTab();
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded home page again", async () => {
+                        await screen[`goBackFrom${root}Page`]();
+                        await screen.loadedHome();
+                    });
+                });
+            }
+        });
+    }
+});

e2e/nested-frame-navigation/e2e/frame-tab-root.e2e-spec.ts

@@ -4,8 +4,8 @@ import { Screen, playersData, somePage, teamsData, driverDefaultWaitTime, Item }
 import * as shared from "./shared.e2e-spec";
 import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
 
-// NOTE: TabTop is Android only scenario (for iOS we will essentially execute 2x TabBottom)
-const roots = ["TabTop", "TabBottom"];
+// NOTE: TabViewTop is Android only scenario (for iOS we will essentially execute 2x TabViewBottom)
+const roots = ["TabViewTop", "TabViewBottom"];
 
 const rootType = "frame-tab-root";
 describe(rootType, async function () {

e2e/nested-frame-navigation/e2e/frame-tabs-root.e2e-spec.ts

@@ -0,0 +1,264 @@
+import { AppiumDriver, createDriver, logWarn, nsCapabilities } from "nativescript-dev-appium";
+
+import { Screen, playersData, somePage, teamsData, driverDefaultWaitTime, Item } from "./screen";
+import * as shared from "./shared.e2e-spec";
+import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
+
+const roots = ["TabsTop", "TabsBottom"];
+
+const rootType = "frame-tabs-root";
+describe(rootType, async function () {
+    let driver: AppiumDriver;
+    let screen: Screen;
+
+    before(async () => {
+        nsCapabilities.testReporter.context = this;
+        logWarn(`====== ${rootType} ========`);
+        driver = await createDriver();
+        screen = new Screen(driver);
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(true);
+        }
+
+        driver.defaultWaitTime = driverDefaultWaitTime;
+    });
+
+    after(async () => {
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(false);
+        }
+        await driver.quit();
+        console.log("Quit driver!");
+    });
+
+    afterEach(async function () {
+        if (this.currentTest.state === "failed") {
+            await driver.logTestArtifacts(this.currentTest.title);
+        }
+    });
+
+    for (let index = 0; index < roots.length; index++) {
+        const root = roots[index];
+
+        describe(`${rootType}-${root} scenarios:`, async function () {
+            logWarn(`===== Root: ${root}`);
+            for (let trIndex = 0; trIndex < transitions.length; trIndex++) {
+                const transition = transitions[trIndex];
+                const playerOne: Item = playersData[`playerOne${transition}`];
+                const playerTwo: Item = playersData[`playerTwo${transition}`];
+                const teamOne: Item = teamsData[`teamOne${transition}`];
+                const teamTwo: Item = teamsData[`teamTwo${transition}`];
+
+                describe(`${rootType}-${root}-transition-${transition}-scenarios:`, async function () {
+
+                    before(async function () {
+                        nsCapabilities.testReporter.context = this;
+                        logWarn(`========= ${root}-${transition} =========`);
+
+                        if (transition === "Flip" &&
+                            driver.isAndroid && parseInt(driver.platformVersion) === 19) {
+                            // TODO: known issue https://github.com/NativeScript/NativeScript/issues/6798
+                            console.log("skipping flip transition tests on api level 19");
+                            this.skip();
+                        }
+                    });
+
+                    it("loaded home page", async () => {
+                        await screen.loadedHome();
+                    });
+
+                    it(`loaded frame ${root} root with nested frames`, async () => {
+                        await screen[`navigateToPage${root}WithFrames`]();
+                        await screen[`loadedPage${root}WithFrames`]();
+                    });
+
+                    it("loaded players list", async () => {
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and go back twice", async () => {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared.testPlayerNavigatedBack(screen, driver);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+                        await shared.testPlayerNavigatedBack(screen, driver);
+                    });
+
+                    it("navigate parent frame and go back", async () => {
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and navigate parent frame and go back", async () => {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("toggle teams tab", async () => {
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamOne.name); // wait for team
+                        }
+                    });
+
+                    it("loaded teams list", async () => {
+                        await screen.loadedTeamsList();
+                    });
+
+                    it("mix player and team list actions and go back", async () => {
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerOne.name); // wait for players list
+                        }
+
+                        await screen.loadedPlayersList();
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        if (appSuspendResume) {
+                            // This sleeps prevent test to fail
+                            await driver.sleep(1000);
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamOne.name); // wait for teams list
+                        }
+
+                        await screen.loadedTeamsList();
+
+                        await shared.testTeamNavigated(teamTwo, screen);
+
+                        if (appSuspendResume) {
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.loadedTeamDetails(teamTwo);
+
+                        await shared[`testSomePageNavigated${transition}`](screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(somePage); // wait for some page
+                        }
+
+                        if (driver.isAndroid) {
+                            await driver.navBack();
+                        } else {
+                            await screen.goBackFromSomePage();
+                        }
+
+                        if (appSuspendResume) {
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.loadedTeamDetails(teamTwo);
+
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await screen.loadedElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        await screen.goBackToTeamsList();
+                        await screen.loadedTeamsList();
+
+                        await screen.togglePlayersTab();
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded home page again", async () => {
+                        await screen[`goBackFrom${root}Page`]();
+                        await screen.loadedHome();
+                    });
+                });
+            }
+        });
+    }
+});

e2e/nested-frame-navigation/e2e/screen.ts

@@ -6,18 +6,30 @@ const layoutWithMultiFrame = "Layout w/ multi frame";
 const pageWithFrame = "Page w/ frame";
 const pageWithFrameNonDefaultTransition = "Frame to NestedFrame (non-default transition)";
 const pageWithMultiFrame = "Page w/ multi frame";
-const pageTabTopWithFrames = "Page w/ tabview (top)";
-const pageTabBottomWithFrames = "Page w/ tabview (bottom)";
+const pageTabViewTopWithFrames = "Page w/ tabview (top)";
+const pageTabViewBottomWithFrames = "Page w/ tabview (bottom)";
 const tabTopRootWithFrames = "Root tabview (top)";
 const tabBottomRootWithFrames = "Root tabview (bottom)";
+const pageTabsTopWithFrames = "Page w/ tabs (top)";
+const pageTabsBottomWithFrames = "Page w/ tabs (bottom)";
+const pageBottomNavigationWithFrames = "Page w/ bottom navigation";
+const tabsTopRootWithFrames = "Root tabs (top)";
+const tabsBottomRootWithFrames = "Root tabs (bottom)";
+const bottomNavigationRootWithFrames = "Root bottom navigation";
 const layoutHome = "layout home page";
 const layoutHomeSecondary = "layout home secondary page";
 const frameHome = "frame home page";
 const frameHomeSecondary = "multi frame home page";
 const tabViewTopHome = "tabview top page";
 const tabViewBottomHome = "tabview bottom page";
-const tabViewRootTopHome = "tabview root top home";
-const tabViewRootBottomHome = "tabview root bottom home";
+const tabViewTopRootHome = "tabview root top home";
+const tabViewBottomRootHome = "tabview root bottom home";
+const tabsTopHome = "tabs top page";
+const tabsBottomHome = "tabs bottom page";
+const tabsTopRootHome = "tabs root top home";
+const tabsBottomRootHome = "tabs root bottom home";
+const bottomNavigationHome = "bottom navigation page";
+const bottomNavigationRootHome = "bottom navigation root home";
 const navigateToStillOtherPageSlide = "navigate to still other page (slide transition)";
 const navigateToSomePageDefault = "navigate to some page (default transition)";
 const navigateToSomePageNone = "navigate to some page (no transition)";
@@ -29,14 +41,20 @@ const navigateToOtherPageSlide = "navigate to other page (slide transition)";
 const navigateToOtherPageFlip = "navigate to other page (flip transition)";
 const players = "Players";
 const teams = "Teams";
+const playersTab = "playersTabNavigation";
+const teamsTab = "teamsTabNavigation";
+const dummyTab = "dummyTabNavigation";
 const playerBack = "playerBack";
 const stillOtherPageBack = "stillOtherPageBack";
 const somePageBack = "somePageBack";
 const otherPageBack = "otherPageBack";
 const teamBack = "teamBack";
 const frameHomeBack = "frameHomeBack";
-const tabTopBack = "tabTopBack";
-const tabBottomBack = "tabBottomBack";
+const tabViewTopBack = "tabViewTopBack";
+const tabViewBottomBack = "tabViewBottomBack";
+const tabsTopBack = "tabsTopBack";
+const tabsBottomBack = "tabsBottomBack";
+const bottomNavigationBack = "bottomNavigationBack";
 const resetApp = "reset app";
 
 export const driverDefaultWaitTime = 10000;
@@ -165,22 +183,46 @@ export class Screen {
         await this.navigateToPage(pageWithMultiFrame);
     }
 
-    navigateToPageTabTopWithFrames = async () => {
-        await this.navigateToPage(pageTabTopWithFrames);
+    navigateToPageTabViewTopWithFrames = async () => {
+        await this.navigateToPage(pageTabViewTopWithFrames);
     }
 
-    navigateToPageTabBottomWithFrames = async () => {
-        await this.navigateToPage(pageTabBottomWithFrames);
+    navigateToPageTabViewBottomWithFrames = async () => {
+        await this.navigateToPage(pageTabViewBottomWithFrames);
     }
 
-    navigateToTabTopRootWithFrames = async () => {
+    navigateToTabViewTopRootWithFrames = async () => {
         await this.navigateToPage(tabTopRootWithFrames);
     }
 
-    navigateToTabBottomRootWithFrames = async () => {
+    navigateToTabViewBottomRootWithFrames = async () => {
         await this.navigateToPage(tabBottomRootWithFrames);
     }
 
+    navigateToPageTabsTopWithFrames = async () => {
+        await this.navigateToPage(pageTabsTopWithFrames);
+    }
+
+    navigateToPageTabsBottomWithFrames = async () => {
+        await this.navigateToPage(pageTabsBottomWithFrames);
+    }
+
+    navigateToPageBottomNavigationWithFrames = async () => {
+        await this.navigateToPage(pageBottomNavigationWithFrames);
+    }
+
+    navigateToTabsTopRootWithFrames = async () => {
+        await this.navigateToPage(tabsTopRootWithFrames);
+    }
+
+    navigateToTabsBottomRootWithFrames = async () => {
+        await this.navigateToPage(tabsBottomRootWithFrames);
+    }
+
+    navigateToBottomNavigationRootWithFrames = async () => {
+        await this.navigateToPage(bottomNavigationRootWithFrames);
+    }
+
     navigateToStillOtherPageSlide = async () => {
         await this.navigateToPage(navigateToStillOtherPageSlide);
     }
@@ -256,22 +298,34 @@ export class Screen {
         await this.goBack(frameHomeBack);
     }
 
-    goBackFromTabTopPage = async () => {
-        await this.goBack(tabTopBack);
+    goBackFromTabViewTopPage = async () => {
+        await this.goBack(tabViewTopBack);
     }
 
-    goBackFromTabBottomPage = async () => {
-        await this.goBack(tabBottomBack);
+    goBackFromTabViewBottomPage = async () => {
+        await this.goBack(tabViewBottomBack);
+    }
+
+    goBackFromTabsTopPage = async () => {
+        await this.goBack(tabsTopBack);
+    }
+
+    goBackFromTabsBottomPage = async () => {
+        await this.goBack(tabsBottomBack);
+    }
+
+    goBackFromBottomNavigationPage = async () => {
+        await this.goBack(bottomNavigationBack);
     }
 
     togglePlayersTab = async () => {
-        const lblPlayers = await this._driver.waitForElement(players);
+        const lblPlayers = await this._driver.waitForElement(playersTab);
         logInfo(`====== Navigate to "${players}"`);
         await lblPlayers.tap();
     }
 
     toggleTeamsTab = async () => {
-        const lblTeams = await this._driver.waitForElement(teams);
+        const lblTeams = await this._driver.waitForElement(teamsTab);
         logInfo(`====== Navigate to "${teams}"`);
         await lblTeams.tap();
     }
@@ -299,20 +353,44 @@ export class Screen {
         await this.loadedPage(frameHomeSecondary);
     }
 
-    loadedPageTabTopWithFrames = async () => {
+    loadedPageTabViewTopWithFrames = async () => {
         await this.loadedPage(tabViewTopHome);
     }
 
-    loadedPageTabBottomWithFrames = async () => {
+    loadedPageTabViewBottomWithFrames = async () => {
         await this.loadedPage(tabViewBottomHome);
     }
 
-    loadedTabTopRootWithFrames = async () => {
-        await this.loadedPage(tabViewRootTopHome);
+    loadedTabViewTopRootWithFrames = async () => {
+        await this.loadedPage(tabViewTopRootHome);
     }
 
-    loadedTabBottomRootWithFrames = async () => {
-        await this.loadedPage(tabViewRootBottomHome);
+    loadedTabViewBottomRootWithFrames = async () => {
+        await this.loadedPage(tabViewBottomRootHome);
+    }
+
+    loadedPageTabsTopWithFrames = async () => {
+        await this.loadedPage(tabsTopHome);
+    }
+
+    loadedPageTabsBottomWithFrames = async () => {
+        await this.loadedPage(tabsBottomHome);
+    }
+
+    loadedPageBottomNavigationWithFrames = async () => {
+        await this.loadedPage(bottomNavigationHome);
+    }
+
+    loadedTabsTopRootWithFrames = async () => {
+        await this.loadedPage(tabsTopRootHome);
+    }
+
+    loadedTabsBottomRootWithFrames = async () => {
+        await this.loadedPage(tabsBottomRootHome);
+    }
+
+    loadedBottomNavigationRootWithFrames = async () => {
+        await this.loadedPage(bottomNavigationRootHome);
     }
     
     loadedStillOtherPage = async () => {

e2e/nested-frame-navigation/e2e/tab-root.e2e-spec.ts

@@ -4,8 +4,8 @@ import { Screen, playersData, teamsData } from "./screen";
 import * as shared from "./shared.e2e-spec";
 import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
 
-// NOTE: TabTop is Android only scenario (for iOS we will essentially execute 2x TabBottom)
-const roots = ["TabTop", "TabBottom"];
+// NOTE: TabViewTop is Android only scenario (for iOS we will essentially execute 2x TabViewBottom)
+const roots = ["TabViewTop", "TabViewBottom"];
 
 const rootType = "tab-root";
 describe(rootType, async function () {

e2e/nested-frame-navigation/e2e/tabs-root.e2e-spec.ts

@@ -0,0 +1,180 @@
+import { AppiumDriver, createDriver, logWarn, nsCapabilities } from "nativescript-dev-appium";
+
+import { Screen, playersData, teamsData } from "./screen";
+import * as shared from "./shared.e2e-spec";
+import { suspendTime, appSuspendResume, dontKeepActivities, transitions } from "./config";
+
+const roots = ["TabsTop", "TabsBottom"];
+
+const rootType = "tabs-root";
+describe(rootType, async function () {
+    let driver: AppiumDriver;
+    let screen: Screen;
+
+    before(async function () {
+        nsCapabilities.testReporter.context = this;
+        logWarn(`====== ${rootType} ========`);
+        driver = await createDriver();
+        screen = new Screen(driver);
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(true);
+        }
+
+        driver.defaultWaitTime = 8000;
+    });
+
+    after(async function () {
+        if (dontKeepActivities) {
+            await driver.setDontKeepActivities(false);
+        }
+        await driver.quit();
+        console.log("Quit driver!");
+    });
+
+    afterEach(async function () {
+        if (this.currentTest.state === "failed") {
+            await driver.logTestArtifacts(this.currentTest.title);
+        }
+    });
+
+    for (let index = 0; index < roots.length; index++) {
+        const root = roots[index];
+        describe(`${rootType}-${root}-scenarios:`, async function () {
+
+            before(async function () {
+                nsCapabilities.testReporter.context = this;
+            });
+
+            for (let index = 0; index < transitions.length; index++) {
+                const transition = transitions[index];
+
+                const playerOne = playersData[`playerOne${transition}`];
+                const playerTwo = playersData[`playerTwo${transition}`];
+                const teamOne = teamsData[`teamOne${transition}`];
+                const teamTwo = teamsData[`teamTwo${transition}`];
+
+                describe(`${rootType}-${root}-transition-${transition}-scenarios:`, async function () {
+
+                    before(async function () {
+                        nsCapabilities.testReporter.context = this;
+
+                        if (transition === "Flip" &&
+                            driver.isAndroid && parseInt(driver.platformVersion) === 19) {
+                            // TODO: known issue https://github.com/NativeScript/NativeScript/issues/6798
+                            console.log("skipping flip transition tests on api level 19");
+                            this.skip();
+                        }
+                    });
+
+                    it("loaded home page", async function () {
+                        await screen.loadedHome();
+                    });
+
+                    it(`loaded ${root} root with frames`, async function () {
+                        await screen[`navigateTo${root}RootWithFrames`]();
+                        await screen[`loaded${root}RootWithFrames`]();
+                    });
+
+                    it("loaded players list", async function () {
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded player details and go back twice", async function () {
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerTwo.name); // wait for player
+                        }
+
+                        await shared.testPlayerNavigatedBack(screen, driver);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+                        await shared.testPlayerNavigatedBack(screen, driver);
+                    });
+
+                    it("toggle teams tab", async function () {
+                        await screen.toggleTeamsTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(teamOne.name); // wait for teams list
+                        }
+                    });
+
+                    it("loaded teams list", async function () {
+                        await screen.loadedTeamsList();
+                    });
+
+                    it("mix player and team list actions and go back", async function () {
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerOne.name); // wait for players list
+                        }
+
+                        await screen.loadedPlayersList();
+
+                        await shared.testPlayerNavigated(playerTwo, screen);
+
+                        if (driver.isIOS) {
+                            if (appSuspendResume) {
+                                await driver.backgroundApp(suspendTime);
+                                await driver.waitForElement(playerTwo.name); // wait for player
+                            }
+                        }
+
+                        await screen.toggleTeamsTab();
+
+                        if (driver.isIOS) {
+                            // TODO: run in background from appium breaks the test. Investigate the issue, once with the app and with appium
+                            if (appSuspendResume) {
+                                await driver.backgroundApp(suspendTime);
+                                await driver.waitForElement(teamOne.name); // wait for teams list
+                            }
+                        }
+
+                        await screen.loadedTeamsList();
+
+                        await shared.testTeamNavigated(teamTwo, screen);
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(teamTwo.name); // wait for team
+                        }
+
+                        await screen.togglePlayersTab();
+
+                        if (appSuspendResume) {
+                            await driver.backgroundApp(suspendTime);
+                            await driver.waitForElement(playerTwo.name); // wait for player
+                        }
+
+                        await screen.loadedPlayerDetails(playerTwo);
+
+                        await screen.toggleTeamsTab();
+
+                        await screen.goBackToTeamsList();
+                        await screen.loadedTeamsList();
+
+                        await screen.togglePlayersTab();
+
+                        await screen.goBackToPlayersList();
+                        await screen.loadedPlayersList();
+                    });
+
+                    it("loaded home page again", async function () {
+                        await screen.resetToHome();
+                        await screen.loadedHome();
+                    });
+                });
+            }
+        });
+    }
+});

tests/app/ui/tabs/tabs-navigation-tests.ts

@@ -10,7 +10,7 @@ import { Button } from "tns-core-modules/ui/button";
 
 var ASYNC = 2;
 
-function _createBottomNavigation(): Tabs {
+function _createTabsNavigation(): Tabs {
     var tabView = new Tabs();
     tabView.id = "BottomNavigation";
 
@@ -97,7 +97,7 @@ export function testBackNavigationToTabViewWithNestedFramesShouldWork() {
     let tabView: Tabs;
 
     const pageFactory = function (): Page {
-        tabView = _createBottomNavigation();
+        tabView = _createTabsNavigation();
         let items = Array<TabContentItem>();
         let tabViewitem = new TabContentItem();
         // tabViewitem.title = "Item1";
@@ -141,7 +141,7 @@ export function testWhenNavigatingBackToANonCachedPageContainingATabViewWithALis
     let tabView: Tabs;
 
     let pageFactory = function (): Page {
-        tabView = _createBottomNavigation();
+        tabView = _createTabsNavigation();
         let items = Array<TabContentItem>();
         let tabViewitem = new TabContentItem();
         // tabViewitem.title = "List";
@@ -215,7 +215,7 @@ export function testLoadedAndUnloadedAreFired_WhenNavigatingAwayAndBack() {
     let loadedEventsCount = [0, 0];
     let unloadedEventsCount = [0, 0];
 
-    const tabView = _createBottomNavigation();
+    const tabView = _createTabsNavigation();
     tabView.items = _createContentItems(itemCount);
     tabView.tabStrip = _createTabStrip(itemCount);
 

tns-core-modules/ui/tabs/tabs.ios.ts

@@ -269,7 +269,8 @@ class UIPageViewControllerDataSourceImpl extends NSObject implements UIPageViewC
         //     prevViewController = owner.getViewController(prevItem);
         // }
 
-        (<TabContentItem>prevItem).canBeLoaded = true;
+        owner._setCanBeLoaded(selectedIndex);
+        owner._loadUnloadTabItems(selectedIndex);
 
         return prevViewController;
     }
@@ -295,7 +296,8 @@ class UIPageViewControllerDataSourceImpl extends NSObject implements UIPageViewC
         //     nextViewController = owner.getViewController(nextItem);
         // }
 
-        (<TabContentItem>nextItem).canBeLoaded = true;
+        owner._setCanBeLoaded(selectedIndex);
+        owner._loadUnloadTabItems(selectedIndex);
         // nextItem.loadView(nextItem.view);
 
         return nextViewController;
@@ -675,7 +677,6 @@ export class Tabs extends TabsBase {
         toLoad.forEach(index => {
             const item = items[index];
             if (this.isLoaded && items[index]) {
-                (<any>item).canBeLoaded = true;
                 item.loadView(item.view);
             }
         });
@@ -775,6 +776,18 @@ export class Tabs extends TabsBase {
         return newController;
     }
 
+    public _setCanBeLoaded(index: number) {
+        const items = this.items;
+        const lastIndex = items.length - 1;
+        const offsideItems = this.offscreenTabLimit;
+
+        iterateIndexRange(index, offsideItems, lastIndex, (i) => {
+            if (items[i]) {
+                (<TabContentItem>items[i]).canBeLoaded = true;
+            }
+        });
+    }
+
     private setViewControllers(items: TabContentItem[]) {
         const length = items ? items.length : 0;
         if (length === 0) {
@@ -1033,7 +1046,6 @@ export class Tabs extends TabsBase {
         // if (traceEnabled()) {
         //     traceWrite("TabView._onSelectedIndexPropertyChangedSetNativeValue(" + value + ")", traceCategories.Debug);
         // }
-        const that = this;
 
         if (value > -1) {
             const item = this.items[value];
@@ -1056,7 +1068,9 @@ export class Tabs extends TabsBase {
             this._currentNativeSelectedIndex = value;
             this.viewController.setViewControllersDirectionAnimatedCompletion(controllers, navigationDirection, true, (finished: boolean) => {
                 if (finished) {
-                    that._canSelectItem = true;
+                    this._canSelectItem = true;
+                    this._setCanBeLoaded(value);
+                    this._loadUnloadTabItems(value);
                 }
             });