From c50f3ffaa61b68a045e19f8a7f3776c4b392aba2 Mon Sep 17 00:00:00 2001
From: Vasil Trifonov <v.trifonov@gmail.com>
Date: Fri, 13 Mar 2020 19:23:14 +0200
Subject: [PATCH] tests: added selected-item test pages

---
 .../app/bottom-navigation/main-page.ts        |  1 +
 .../app/bottom-navigation/selected-item.css   |  7 ++++
 .../app/bottom-navigation/selected-item.xml   | 40 +++++++++++++++++++
 e2e/ui-tests-app/app/tabs/main-page.ts        |  1 +
 e2e/ui-tests-app/app/tabs/selected-item.css   | 20 ++++++++++
 e2e/ui-tests-app/app/tabs/selected-item.xml   | 40 +++++++++++++++++++
 6 files changed, 109 insertions(+)
 create mode 100644 e2e/ui-tests-app/app/bottom-navigation/selected-item.css
 create mode 100644 e2e/ui-tests-app/app/bottom-navigation/selected-item.xml
 create mode 100644 e2e/ui-tests-app/app/tabs/selected-item.css
 create mode 100644 e2e/ui-tests-app/app/tabs/selected-item.xml

diff --git a/e2e/ui-tests-app/app/bottom-navigation/main-page.ts b/e2e/ui-tests-app/app/bottom-navigation/main-page.ts
index 344d41ef8..099b5a083 100644
--- a/e2e/ui-tests-app/app/bottom-navigation/main-page.ts
+++ b/e2e/ui-tests-app/app/bottom-navigation/main-page.ts
@@ -26,6 +26,7 @@ export function loadExamples() {
     examples.set("css-text-transform", "bottom-navigation/bottom-navigation-css-page");
     examples.set("custom-tabstrip", "bottom-navigation/custom-tabstrip-page");
     examples.set("reselect", "bottom-navigation/reselect-page");
+    examples.set("selected-item", "bottom-navigation/selected-item");
 
     return examples;
 }
diff --git a/e2e/ui-tests-app/app/bottom-navigation/selected-item.css b/e2e/ui-tests-app/app/bottom-navigation/selected-item.css
new file mode 100644
index 000000000..f43139ce8
--- /dev/null
+++ b/e2e/ui-tests-app/app/bottom-navigation/selected-item.css
@@ -0,0 +1,7 @@
+.font-awesome {
+    font-family: "FontAwesome";
+}
+
+.font-size {
+    font-size: 36;
+}
\ No newline at end of file
diff --git a/e2e/ui-tests-app/app/bottom-navigation/selected-item.xml b/e2e/ui-tests-app/app/bottom-navigation/selected-item.xml
new file mode 100644
index 000000000..15d04c7fc
--- /dev/null
+++ b/e2e/ui-tests-app/app/bottom-navigation/selected-item.xml
@@ -0,0 +1,40 @@
+<Page class="page">
+
+  <ActionBar title="BottomNavigation selected-item" icon="" class="action-bar">
+  </ActionBar>
+
+  <BottomNavigation>
+    <TabStrip selectedItemColor="red" unSelectedItemColor="green">
+        <TabStripItem>
+            <Label text="First"/>
+            <Image src="res://baseline_motorcycle_black_24"/>
+        </TabStripItem>
+        <TabStripItem>
+            <Label text="Second"/>
+            <Image src="res://up"/>
+        </TabStripItem>
+        <TabStripItem>
+            <Label text="Third"/>
+            <Image src="font://&#xF10B;" class="font-awesome font-size" />
+        </TabStripItem>
+    </TabStrip>
+
+    <TabContentItem class="special">
+        <GridLayout>
+          <Label text="First View" />
+        </GridLayout>
+    </TabContentItem>
+
+    <TabContentItem>
+        <GridLayout>
+          <Label text="Second View" />
+        </GridLayout>
+    </TabContentItem>
+
+    <TabContentItem>
+        <GridLayout>
+          <Label text="Third View" />
+        </GridLayout>
+    </TabContentItem>
+  </BottomNavigation>
+</Page>
diff --git a/e2e/ui-tests-app/app/tabs/main-page.ts b/e2e/ui-tests-app/app/tabs/main-page.ts
index de21578a6..b8eda9135 100644
--- a/e2e/ui-tests-app/app/tabs/main-page.ts
+++ b/e2e/ui-tests-app/app/tabs/main-page.ts
@@ -33,6 +33,7 @@ export function loadExamples() {
     examples.set("nested-bottom-navigation", "tabs/nested-bottom-navigation-page");
     examples.set("custom-tabstrip", "tabs/custom-tabstrip-page");
     examples.set("frame-in-tabs", "tabs/frame-in-tabs");
+    examples.set("selected-item", "tabs/selected-item");
 
     return examples;
 }
diff --git a/e2e/ui-tests-app/app/tabs/selected-item.css b/e2e/ui-tests-app/app/tabs/selected-item.css
new file mode 100644
index 000000000..27a16bf77
--- /dev/null
+++ b/e2e/ui-tests-app/app/tabs/selected-item.css
@@ -0,0 +1,20 @@
+.font-awesome {
+    font-family: "FontAwesome";
+}
+
+.font-size {
+    font-size: 36;
+}
+
+
+/* TabStrip {
+    color: mediumvioletred;
+}
+
+TabStripItem {
+    color: skyblue;
+}
+
+TabStripItem:active {
+    color: darkblue;
+} */
\ No newline at end of file
diff --git a/e2e/ui-tests-app/app/tabs/selected-item.xml b/e2e/ui-tests-app/app/tabs/selected-item.xml
new file mode 100644
index 000000000..e981eeb9c
--- /dev/null
+++ b/e2e/ui-tests-app/app/tabs/selected-item.xml
@@ -0,0 +1,40 @@
+<Page class="page">
+
+  <ActionBar title="Tabs selected-item" icon="" class="action-bar">
+  </ActionBar>
+
+  <Tabs>
+    <TabStrip selectedItemColor="red" unSelectedItemColor="green">
+        <TabStripItem>
+            <Label text="First"/>
+            <Image src="res://baseline_motorcycle_black_24"/>
+        </TabStripItem>
+        <TabStripItem>
+            <Label text="Second"/>
+            <Image src="res://up"/>
+        </TabStripItem>
+        <TabStripItem>
+            <Label text="Third"/>
+            <Image src="font://&#xF10B;" class="font-awesome font-size" />
+        </TabStripItem>
+    </TabStrip>
+
+    <TabContentItem class="special">
+        <GridLayout>
+          <Label text="First View" />
+        </GridLayout>
+    </TabContentItem>
+
+    <TabContentItem>
+        <GridLayout>
+          <Label text="Second View" />
+        </GridLayout>
+    </TabContentItem>
+
+    <TabContentItem>
+        <GridLayout>
+          <Label text="Third View" />
+        </GridLayout>
+    </TabContentItem>
+  </Tabs>
+</Page>