Browse Source

Fix e2e android

Use custom alert that can be displayed multiple times in quick succession
Guy Carmeli 6 years ago
parent
commit
6139587117
3 changed files with 73 additions and 0 deletions
  1. 19
    0
      playground/src/app.js
  2. 52
    0
      playground/src/screens/Alert.js
  3. 2
    0
      playground/src/screens/index.js

+ 19
- 0
playground/src/app.js View File

@@ -1,5 +1,24 @@
1 1
 const { Navigation } = require('react-native-navigation');
2 2
 const { registerScreens } = require('./screens');
3
+const { Platform } = require('react-native');
4
+
5
+if (Platform.OS === 'android') {
6
+  alert = (title) => {
7
+    Navigation.showOverlay({
8
+      component: {
9
+        name: 'navigation.playground.alert',
10
+        passProps: {
11
+          title
12
+        },
13
+        options: {
14
+          overlay: {
15
+            interceptTouchOutside: true
16
+          }
17
+        }
18
+      }
19
+    });
20
+  }
21
+}
3 22
 
4 23
 function start() {
5 24
   registerScreens();

+ 52
- 0
playground/src/screens/Alert.js View File

@@ -0,0 +1,52 @@
1
+const React = require('react');
2
+const { PureComponent } = require('react');
3
+
4
+const { Text, Button, View, Platform } = require('react-native');
5
+const { Navigation } = require('react-native-navigation');
6
+
7
+const testIDs = require('../testIDs');
8
+
9
+class Alert extends PureComponent {
10
+
11
+  render() {
12
+    return (
13
+      <View style={styles.root} key={'overlay'}>
14
+        <View style={styles.alert}>
15
+          <Text style={styles.h1} testID={testIDs.DIALOG_HEADER}>{this.props.title}</Text>
16
+          <View style={styles.buttonContainer}>
17
+            <Button title='OK' testID={testIDs.OK_BUTTON} onPress={() => this.onCLickOk()} />
18
+          </View>
19
+        </View>
20
+      </View>
21
+    );
22
+  }
23
+
24
+  onCLickOk() {
25
+    Navigation.dismissOverlay(this.props.componentId);
26
+  }
27
+}
28
+
29
+const styles = {
30
+  root: {
31
+    justifyContent: 'center',
32
+    alignItems: 'center',
33
+    flex: 1
34
+  },
35
+  alert: {
36
+    alignItems: 'center',
37
+    backgroundColor: '#efefef',
38
+    width: 250,
39
+    height: 100,
40
+    elevation: 4
41
+  },
42
+  buttonContainer: {
43
+    width: '50%',
44
+    alignItems: 'center'
45
+  },
46
+  h1: {
47
+    fontSize: 18,
48
+    margin: 10
49
+  }
50
+};
51
+
52
+module.exports = Alert;

+ 2
- 0
playground/src/screens/index.js View File

@@ -17,6 +17,7 @@ const SideMenuScreen = require('./SideMenuScreen');
17 17
 const TopTabScreen = require('./TopTabScreen');
18 18
 const TopTabOptionsScreen = require('./TopTabOptionsScreen');
19 19
 const CustomTopBar = require('./CustomTopBar');
20
+const Alert = require('./Alert');
20 21
 
21 22
 function registerScreens() {
22 23
   Navigation.registerComponent(`navigation.playground.CustomTransitionDestination`, () => CustomTransitionDestination);
@@ -37,6 +38,7 @@ function registerScreens() {
37 38
   Navigation.registerComponent('navigation.playground.TopTabScreen', () => TopTabScreen);
38 39
   Navigation.registerComponent('navigation.playground.TopTabOptionsScreen', () => TopTabOptionsScreen);
39 40
   Navigation.registerComponent('navigation.playground.CustomTopBar', () => CustomTopBar);
41
+  Navigation.registerComponent('navigation.playground.alert', () => Alert);
40 42
 }
41 43
 
42 44
 module.exports = {