From 023b0990a91d31d4e4c80c48d7e0fddbbf3dbd90 Mon Sep 17 00:00:00 2001
From: Freddy Harris <freddy03h@gmail.com>
Date: Thu, 26 Oct 2017 15:59:34 +0200
Subject: [PATCH] Fix impossible to renderTitle in full width on ios (#2641)

* Fix impossible to renderTitle in full width on ios

* Fix test and add a test
---
 .../__tests__/StackNavigator-test.js          |  14 ++
 .../__snapshots__/StackNavigator-test.js.snap | 226 +++++++++++++++++-
 .../src/views/Header/Header.js                |   7 +
 3 files changed, 245 insertions(+), 2 deletions(-)

diff --git a/packages/react-navigation/src/navigators/__tests__/StackNavigator-test.js b/packages/react-navigation/src/navigators/__tests__/StackNavigator-test.js
index ca3775e1..aacfef83 100644
--- a/packages/react-navigation/src/navigators/__tests__/StackNavigator-test.js
+++ b/packages/react-navigation/src/navigators/__tests__/StackNavigator-test.js
@@ -30,4 +30,18 @@ describe('StackNavigator', () => {
 
     expect(rendered).toMatchSnapshot();
   });
+
+  it('applies correct values when headerRight is present', () => {
+    const MyStackNavigator = StackNavigator({
+      Home: {
+        screen: HomeScreen,
+        navigationOptions: {
+          headerRight: <View />,
+        },
+      },
+    });
+    const rendered = renderer.create(<MyStackNavigator />).toJSON();
+
+    expect(rendered).toMatchSnapshot();
+  });
 });
diff --git a/packages/react-navigation/src/navigators/__tests__/__snapshots__/StackNavigator-test.js.snap b/packages/react-navigation/src/navigators/__tests__/__snapshots__/StackNavigator-test.js.snap
index ee5782fe..7375570d 100644
--- a/packages/react-navigation/src/navigators/__tests__/__snapshots__/StackNavigator-test.js.snap
+++ b/packages/react-navigation/src/navigators/__tests__/__snapshots__/StackNavigator-test.js.snap
@@ -1,5 +1,227 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`StackNavigator applies correct values when headerRight is present 1`] = `
+<View
+  onLayout={[Function]}
+  style={
+    Array [
+      Object {
+        "flex": 1,
+      },
+      undefined,
+    ]
+  }
+>
+  <View
+    onMoveShouldSetResponder={[Function]}
+    onMoveShouldSetResponderCapture={[Function]}
+    onResponderEnd={[Function]}
+    onResponderGrant={[Function]}
+    onResponderMove={[Function]}
+    onResponderReject={[Function]}
+    onResponderRelease={[Function]}
+    onResponderStart={[Function]}
+    onResponderTerminate={[Function]}
+    onResponderTerminationRequest={[Function]}
+    onStartShouldSetResponder={[Function]}
+    onStartShouldSetResponderCapture={[Function]}
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "flexDirection": "column-reverse",
+        },
+        Object {
+          "backgroundColor": "#000",
+        },
+      ]
+    }
+  >
+    <View
+      style={
+        Object {
+          "flex": 1,
+        }
+      }
+    >
+      <View
+        collapsable={undefined}
+        pointerEvents="auto"
+        style={
+          Object {
+            "backgroundColor": "#E9E9EF",
+            "bottom": 0,
+            "left": 0,
+            "opacity": 1,
+            "position": "absolute",
+            "right": 0,
+            "shadowColor": "black",
+            "shadowOffset": Object {
+              "height": 0,
+              "width": 0,
+            },
+            "shadowOpacity": 0.2,
+            "shadowRadius": 5,
+            "top": 0,
+            "transform": Array [
+              Object {
+                "translateX": 0,
+              },
+              Object {
+                "translateY": 0,
+              },
+            ],
+          }
+        }
+      />
+    </View>
+    <View
+      cardStyle={undefined}
+      collapsable={undefined}
+      getScreenDetails={[Function]}
+      headerMode={undefined}
+      index={0}
+      layout={
+        Object {
+          "height": 0,
+          "initHeight": 0,
+          "initWidth": 0,
+          "isMeasured": false,
+          "width": 0,
+        }
+      }
+      mode="float"
+      navigation={
+        Object {
+          "dispatch": [Function],
+          "goBack": [Function],
+          "navigate": [Function],
+          "setParams": [Function],
+          "state": Object {
+            "index": 0,
+            "routes": Array [
+              Object {
+                "key": "Init-id-0-1",
+                "routeName": "Home",
+              },
+            ],
+          },
+        }
+      }
+      router={
+        Object {
+          "getActionForPathAndParams": [Function],
+          "getComponentForRouteName": [Function],
+          "getComponentForState": [Function],
+          "getPathAndParamsForState": [Function],
+          "getScreenConfig": [Function],
+          "getScreenOptions": [Function],
+          "getStateForAction": [Function],
+        }
+      }
+      style={
+        Object {
+          "backgroundColor": "#F7F7F7",
+          "borderBottomColor": "rgba(0, 0, 0, .3)",
+          "borderBottomWidth": 0.5,
+          "height": 64,
+          "paddingTop": 20,
+        }
+      }
+      transitionConfig={undefined}
+    >
+      <View
+        style={
+          Object {
+            "flex": 1,
+          }
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+              Object {
+                "flexDirection": "row",
+              },
+            ]
+          }
+        >
+          <View
+            collapsable={undefined}
+            pointerEvents="box-none"
+            style={
+              Object {
+                "alignItems": "center",
+                "backgroundColor": "transparent",
+                "bottom": 0,
+                "justifyContent": "center",
+                "left": 70,
+                "opacity": 1,
+                "position": "absolute",
+                "right": 70,
+                "top": 0,
+                "transform": Array [
+                  Object {
+                    "translateX": 0,
+                  },
+                ],
+              }
+            }
+          >
+            <Text
+              accessibilityTraits="header"
+              accessible={true}
+              allowFontScaling={true}
+              collapsable={undefined}
+              disabled={false}
+              ellipsizeMode="tail"
+              numberOfLines={1}
+              onLayout={[Function]}
+              style={
+                Object {
+                  "color": "rgba(0, 0, 0, .9)",
+                  "fontSize": 17,
+                  "fontWeight": "600",
+                  "marginHorizontal": 16,
+                  "textAlign": "center",
+                }
+              }
+            >
+              Welcome anonymous
+            </Text>
+          </View>
+          <View
+            collapsable={undefined}
+            pointerEvents="box-none"
+            style={
+              Object {
+                "alignItems": "center",
+                "backgroundColor": "transparent",
+                "bottom": 0,
+                "justifyContent": "center",
+                "opacity": 1,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              }
+            }
+          >
+            <View />
+          </View>
+        </View>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
 exports[`StackNavigator renders successfully 1`] = `
 <View
   onLayout={[Function]}
@@ -162,10 +384,10 @@ exports[`StackNavigator renders successfully 1`] = `
                 "backgroundColor": "transparent",
                 "bottom": 0,
                 "justifyContent": "center",
-                "left": 70,
+                "left": 0,
                 "opacity": 1,
                 "position": "absolute",
-                "right": 70,
+                "right": 0,
                 "top": 0,
                 "transform": Array [
                   Object {
diff --git a/packages/react-navigation/src/views/Header/Header.js b/packages/react-navigation/src/views/Header/Header.js
index 3d33b866..f39fe8a3 100644
--- a/packages/react-navigation/src/views/Header/Header.js
+++ b/packages/react-navigation/src/views/Header/Header.js
@@ -172,6 +172,13 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
       if (!options.hasRightComponent) {
         style.right = 0;
       }
+    } else if (
+      Platform.OS === 'ios' &&
+      !options.hasLeftComponent &&
+      !options.hasRightComponent
+    ) {
+      style.left = 0;
+      style.right = 0;
     }
 
     return this._renderSubView(