[test] Add MaterialTopTabs test

Author: IjzerenHein

test-app/src/App.tsx

@@ -3,6 +3,7 @@ import { enableScreens } from "react-native-screens";
 
 import { Tests, Test } from "./components";
 import BottomTabs from "./tests/BottomTabs";
+import MaterialTopTabs from "./tests/MaterialTopTabs";
 import ModalStack from "./tests/ModalStack";
 import NestedStack from "./tests/NestedStack";
 import NestedStack2 from "./tests/NestedStack2";
@@ -17,5 +18,6 @@ export default () => (
     <Test title="NestedStack2" Component={NestedStack2} />
     <Test title="ModalStack" Component={ModalStack} />
     <Test title="BottomTabs" Component={BottomTabs} />
+    <Test title="MaterialTopTabs" Component={MaterialTopTabs} />
   </Tests>
 );

test-app/src/screens/DetailScreen.tsx

@@ -35,10 +35,7 @@ export const DetailScreen = ({ navigation, modal }: Props) => (
         >
           <TouchableOpacity
             activeOpacity={0.5}
-            onPress={() => {
-              console.log("goBack");
-              navigation.goBack();
-            }}
+            onPress={() => navigation.goBack()}
           >
             <SharedElement id="close">
               <Icon style={styles.icon} name="ios-close" />

test-app/src/tests/MaterialTopTabs.tsx

@@ -0,0 +1,48 @@
+import { createAppContainer } from "react-navigation";
+import { createSharedElementStackNavigator } from "react-navigation-shared-element";
+import { createMaterialTopTabNavigator } from "react-navigation-tabs";
+
+import { createScreen, MasterScreen, DetailScreen } from "../screens";
+
+const StackNavigator1 = createSharedElementStackNavigator(
+  {
+    Master: createScreen(MasterScreen, "BottomStack1"),
+    Detail: DetailScreen
+  },
+  undefined,
+  {
+    name: "TopStack1",
+    debug: true
+  }
+);
+
+const StackNavigator2 = createSharedElementStackNavigator(
+  {
+    Master: createScreen(MasterScreen, "BottomStack2"),
+    Detail: DetailScreen
+  },
+  undefined,
+  {
+    name: "TopStack2",
+    debug: true
+  }
+);
+
+const TabNavigator = createMaterialTopTabNavigator({
+  Tab1: {
+    // @ts-ignore
+    screen: StackNavigator1,
+    navigationOptions: {
+      title: "Stack 1"
+    }
+  },
+  Tab2: {
+    // @ts-ignore
+    screen: StackNavigator2,
+    navigationOptions: {
+      title: "Stack 2"
+    }
+  }
+});
+
+export default createAppContainer(TabNavigator);

test-app/src/tests/NestedStack2.tsx

@@ -5,11 +5,11 @@ import { createScreen, MasterScreen, DetailScreen } from "../screens";
 
 const NestedStackNavigator = createSharedElementStackNavigator(
   {
-    Master: createScreen(MasterScreen, "NestedStack")
+    Master: createScreen(MasterScreen, "NestedStack2")
   },
   undefined,
   {
-    name: "NestedStack",
+    name: "NestedStack2",
     debug: true
   }
 );