Browse Source

Fix custom back button missing id

Id property wasn’t handled when copying back button in native
Guy Carmeli 5 years ago
parent
commit
578f6a8eea

+ 7
- 0
e2e/ScreenStack.test.js View File

110
     await elementById(testIDs.PUSH_BOTTOM_TABS_BUTTON).tap();
110
     await elementById(testIDs.PUSH_BOTTOM_TABS_BUTTON).tap();
111
     await expect(elementById(testIDs.BOTTOM_TABS_ELEMENT)).toBeVisible();
111
     await expect(elementById(testIDs.BOTTOM_TABS_ELEMENT)).toBeVisible();
112
   });
112
   });
113
+
114
+  test(':android: custom back button', async () => {
115
+    await elementById(testIDs.PUSH_BUTTON).tap();
116
+    await elementById(testIDs.PUSH_CUSTOM_BACK_BUTTON).tap();
117
+    await elementById(testIDs.CUSTOM_BACK_BUTTON).tap();
118
+    await expect(elementByLabel('back button clicked')).toBeVisible();
119
+  });
113
 });
120
 });

+ 2
- 0
lib/android/app/src/main/java/com/reactnativenavigation/parse/BackButton.java View File

40
     }
40
     }
41
 
41
 
42
     public void mergeWith(BackButton other) {
42
     public void mergeWith(BackButton other) {
43
+        if (!Constants.BACK_BUTTON_ID.equals(other.id)) id = other.id;
43
         if (other.icon.hasValue()) icon = other.icon;
44
         if (other.icon.hasValue()) icon = other.icon;
44
         if (other.visible.hasValue()) visible = other.visible;
45
         if (other.visible.hasValue()) visible = other.visible;
45
         if (other.color.hasValue()) color = other.color;
46
         if (other.color.hasValue()) color = other.color;
50
     }
51
     }
51
 
52
 
52
     void mergeWithDefault(final BackButton defaultOptions) {
53
     void mergeWithDefault(final BackButton defaultOptions) {
54
+        if (Constants.BACK_BUTTON_ID.equals(id)) id = defaultOptions.id;
53
         if (!icon.hasValue()) icon = defaultOptions.icon;
55
         if (!icon.hasValue()) icon = defaultOptions.icon;
54
         if (!visible.hasValue()) visible = defaultOptions.visible;
56
         if (!visible.hasValue()) visible = defaultOptions.visible;
55
         if (!color.hasValue()) color = defaultOptions.color;
57
         if (!color.hasValue()) color = defaultOptions.color;

+ 31
- 0
playground/src/screens/PushedScreen.js View File

31
 
31
 
32
   constructor(props) {
32
   constructor(props) {
33
     super(props);
33
     super(props);
34
+    Navigation.events().bindComponent(this);
34
     if (this.props.simulateLongRunningTask) {
35
     if (this.props.simulateLongRunningTask) {
35
       this.simulateLongRunningTask();
36
       this.simulateLongRunningTask();
36
     }
37
     }
49
     for (let i = 0; i < Math.pow(2, 25); i++);
50
     for (let i = 0; i < Math.pow(2, 25); i++);
50
   }
51
   }
51
 
52
 
53
+  navigationButtonPressed({buttonId}) {
54
+    if (buttonId === 'backPress') {
55
+      alert('back button clicked')
56
+    }
57
+  }
58
+
52
   listeners = [];
59
   listeners = [];
53
 
60
 
54
   componentDidMount() {
61
   componentDidMount() {
89
         <Button title='Pop To Root' testID={testIDs.POP_TO_ROOT} onPress={this.onClickPopToRoot} />
96
         <Button title='Pop To Root' testID={testIDs.POP_TO_ROOT} onPress={this.onClickPopToRoot} />
90
         <Button title='Set Stack Root' testID={testIDs.SET_STACK_ROOT_BUTTON} onPress={this.onClickSetStackRoot} />
97
         <Button title='Set Stack Root' testID={testIDs.SET_STACK_ROOT_BUTTON} onPress={this.onClickSetStackRoot} />
91
         <Button title='Push and Wait for Render' testID={testIDs.PUSH_BUTTON_WAIT_FOR_RENDER} onPress={this.onClickPushWaitForRender} />
98
         <Button title='Push and Wait for Render' testID={testIDs.PUSH_BUTTON_WAIT_FOR_RENDER} onPress={this.onClickPushWaitForRender} />
99
+        <Button title='Push custom back button' testID={testIDs.PUSH_CUSTOM_BACK_BUTTON} onPress={this.onClickPushCustomBackButton} />
92
         {stackPosition > 2 && <Button title='Pop To Stack Position 1' testID={testIDs.POP_STACK_POSITION_ONE_BUTTON} onPress={this.onClickPopToFirstPosition} />}
100
         {stackPosition > 2 && <Button title='Pop To Stack Position 1' testID={testIDs.POP_STACK_POSITION_ONE_BUTTON} onPress={this.onClickPopToFirstPosition} />}
93
         <Text style={styles.footer}>{`this.props.componentId = ${this.props.componentId}`}</Text>
101
         <Text style={styles.footer}>{`this.props.componentId = ${this.props.componentId}`}</Text>
94
       </View>
102
       </View>
242
     });
250
     });
243
   }
251
   }
244
 
252
 
253
+  onClickPushCustomBackButton = async () => {
254
+    Navigation.push(this.props.componentId, {
255
+      component: {
256
+        name: 'navigation.playground.PushedScreen',
257
+        passProps: {
258
+          stackPosition: this.getStackPosition() + 1,
259
+          previousScreenIds: _.concat([], this.props.previousScreenIds || [], this.props.componentId),
260
+        },
261
+        options: {
262
+          topBar: {
263
+            backButton: {
264
+              id: 'backPress',
265
+              icon: require('../../img/navicon_add.png'),
266
+              visible: true,
267
+              color: 'black',
268
+              testID: testIDs.CUSTOM_BACK_BUTTON
269
+            }
270
+          }
271
+        }
272
+      }
273
+    });
274
+  }
275
+
245
   async onClickPushBottomTabs() {
276
   async onClickPushBottomTabs() {
246
     await Navigation.push(this.props.componentId, {
277
     await Navigation.push(this.props.componentId, {
247
       bottomTabs: {
278
       bottomTabs: {

+ 2
- 0
playground/src/testIDs.js View File

16
   PUSH_DEFAULT_OPTIONS_BUTTON: `PUSH_DEFAULT_OPTIONS_BUTTON`,
16
   PUSH_DEFAULT_OPTIONS_BUTTON: `PUSH_DEFAULT_OPTIONS_BUTTON`,
17
   SHOW_TOPBAR_REACT_VIEW: `SHOW_TOPBAR_REACT_VIEW`,
17
   SHOW_TOPBAR_REACT_VIEW: `SHOW_TOPBAR_REACT_VIEW`,
18
   BACK_HANDLER_BUTTON: `BACK_HANDLER_BUTTON`,
18
   BACK_HANDLER_BUTTON: `BACK_HANDLER_BUTTON`,
19
+  CUSTOM_BACK_BUTTON: `CUSTOM_BACK_BUTTON`,
19
   SHOW_MODAL_BUTTON: `SHOW_MODAL_BUTTON`,
20
   SHOW_MODAL_BUTTON: `SHOW_MODAL_BUTTON`,
20
   SHOW_REDBOX_BUTTON: `SHOW_REDBOX_BUTTON`,
21
   SHOW_REDBOX_BUTTON: `SHOW_REDBOX_BUTTON`,
21
   ORIENTATION_BUTTON: `ORIENTATION_BUTTON`,
22
   ORIENTATION_BUTTON: `ORIENTATION_BUTTON`,
49
   SET_TAB_BADGE_BUTTON_NULL: `SET_TAB_BADGE_BUTTON_NULL`,
50
   SET_TAB_BADGE_BUTTON_NULL: `SET_TAB_BADGE_BUTTON_NULL`,
50
   PUSH_TO_TEST_DID_DISAPPEAR_BUTTON: `PUSH_TO_TEST_DID_DISAPPEAR_BUTTON`,
51
   PUSH_TO_TEST_DID_DISAPPEAR_BUTTON: `PUSH_TO_TEST_DID_DISAPPEAR_BUTTON`,
51
   PUSH_BUTTON_WAIT_FOR_RENDER: `PUSH_AND_WAIT_FOR_RENDER`,
52
   PUSH_BUTTON_WAIT_FOR_RENDER: `PUSH_AND_WAIT_FOR_RENDER`,
53
+  PUSH_CUSTOM_BACK_BUTTON: `PUSH_CUSTOM_BACK_BUTTON`,
52
   SHOW_LEFT_SIDE_MENU_BUTTON: `SHOW_LEFT_SIDE_MENU_BUTTON`,
54
   SHOW_LEFT_SIDE_MENU_BUTTON: `SHOW_LEFT_SIDE_MENU_BUTTON`,
53
   SHOW_RIGHT_SIDE_MENU_BUTTON: `SHOW_RIGHT_SIDE_MENU_BUTTON`,
55
   SHOW_RIGHT_SIDE_MENU_BUTTON: `SHOW_RIGHT_SIDE_MENU_BUTTON`,
54
   HIDE_LEFT_SIDE_MENU_BUTTON: `HIDE_LEFT_SIDE_MENU_BUTTON`,
56
   HIDE_LEFT_SIDE_MENU_BUTTON: `HIDE_LEFT_SIDE_MENU_BUTTON`,