1
- /**
2
- * Sample React Native App
3
- * https://github.com/facebook/react-native
4
- *
5
- * @format
6
- */
7
-
8
- import React from 'react' ;
9
- import type { PropsWithChildren } from 'react' ;
1
+ import React , { useState } from 'react' ;
10
2
import {
3
+ Button ,
11
4
SafeAreaView ,
12
5
ScrollView ,
13
6
StatusBar ,
@@ -16,52 +9,127 @@ import {
16
9
useColorScheme ,
17
10
View ,
18
11
} from 'react-native' ;
19
-
20
12
import {
21
13
Colors ,
22
- DebugInstructions ,
23
14
Header ,
24
- LearnMoreLinks ,
25
- ReloadInstructions ,
26
15
} from 'react-native/Libraries/NewAppScreen' ;
27
16
28
- type SectionProps = PropsWithChildren < {
29
- title : string ;
30
- } > ;
31
-
32
- function Section ( { children, title} : SectionProps ) : React . JSX . Element {
33
- const isDarkMode = useColorScheme ( ) === 'dark' ;
34
- return (
35
- < View style = { styles . sectionContainer } >
36
- < Text
37
- style = { [
38
- styles . sectionTitle ,
39
- {
40
- color : isDarkMode ? Colors . white : Colors . black ,
41
- } ,
42
- ] } >
43
- { title }
44
- </ Text >
45
- < Text
46
- style = { [
47
- styles . sectionDescription ,
48
- {
49
- color : isDarkMode ? Colors . light : Colors . dark ,
50
- } ,
51
- ] } >
52
- { children }
53
- </ Text >
54
- </ View >
55
- ) ;
56
- }
57
-
58
17
function App ( ) : React . JSX . Element {
59
18
const isDarkMode = useColorScheme ( ) === 'dark' ;
19
+ const [ testResult , setTestResult ] = useState ( 'No test run yet' ) ;
20
+ const [ testName , setTestName ] = useState ( '' ) ;
60
21
61
22
const backgroundStyle = {
62
23
backgroundColor : isDarkMode ? Colors . darker : Colors . lighter ,
63
24
} ;
64
25
26
+ const testConsoleLog = ( ) => {
27
+ console . log ( 'Hello from JSC' ) ;
28
+ setTestName ( 'Console Test Result' ) ;
29
+ setTestResult ( 'Hello from JSC' ) ;
30
+ } ;
31
+
32
+ const testBasicOperations = ( ) => {
33
+ const mathResult = 2 + 2 ;
34
+ const stringResult = 'Hello ' + 'World' ;
35
+ const arrayResult = [ 1 , 2 , 3 ] . map ( x => x * 2 ) ;
36
+
37
+ const result = `Math: ${ mathResult } \nString: ${ stringResult } \nArray: ${ arrayResult } ` ;
38
+ console . log ( result ) ;
39
+ setTestName ( 'Basic Operations Result' ) ;
40
+ setTestResult ( result ) ;
41
+ } ;
42
+
43
+ const testComplexOperations = ( ) => {
44
+ const obj = { a : 1 , b : 2 } ;
45
+ const square = ( x : number ) => x * x ;
46
+ const squareResult = square ( 4 ) ;
47
+
48
+ let result = `Object: ${ JSON . stringify ( obj ) } \nSquare(4): ${ squareResult } ` ;
49
+
50
+ try {
51
+ // eslint-disable-next-line no-eval
52
+ const dynamicFn = eval ( '(x) => x * 3' ) ;
53
+ const dynamicResult = dynamicFn ( 4 ) ;
54
+ result += `\nDynamic function(4): ${ dynamicResult } ` ;
55
+ } catch ( error ) {
56
+ result += `\nDynamic function error: ${ error } ` ;
57
+ }
58
+
59
+ console . log ( result ) ;
60
+ setTestName ( 'Complex Operations Result' ) ;
61
+ setTestResult ( result ) ;
62
+ } ;
63
+
64
+ const testGlobalAccess = ( ) => {
65
+ const result = `SetTimeout exists: ${ typeof global . setTimeout === 'function' } ` ;
66
+ console . log ( result ) ;
67
+ setTestName ( 'Global Access Result' ) ;
68
+ setTestResult ( result ) ;
69
+ } ;
70
+
71
+ const testErrorHandling = ( ) => {
72
+ let results : string [ ] = [ ] ;
73
+
74
+ try {
75
+ throw new Error ( 'Custom error' ) ;
76
+ } catch ( error ) {
77
+ if ( error instanceof Error ) {
78
+ results . push ( `Regular error: ${ error . message } ` ) ;
79
+ }
80
+ }
81
+
82
+ try {
83
+ const undefined1 = undefined ;
84
+ // @ts -ignore
85
+ undefined1 . someMethod ( ) ;
86
+ } catch ( error ) {
87
+ if ( error instanceof Error ) {
88
+ results . push ( `Type error: ${ error . message } ` ) ;
89
+ }
90
+ }
91
+
92
+ try {
93
+ // eslint-disable-next-line no-eval
94
+ eval ( 'syntax error{' ) ;
95
+ } catch ( error ) {
96
+ if ( error instanceof Error ) {
97
+ results . push ( `Eval error: ${ error . message } ` ) ;
98
+ }
99
+ }
100
+
101
+ const result = results . join ( '\n' ) ;
102
+ console . log ( result ) ;
103
+ setTestName ( 'Error Handling Result' ) ;
104
+ setTestResult ( result ) ;
105
+ } ;
106
+
107
+ const testAsync = async ( ) => {
108
+ try {
109
+ const result = await new Promise ( ( resolve ) => {
110
+ setTimeout ( ( ) => resolve ( 'Regular async completed' ) , 1000 ) ;
111
+ } ) ;
112
+ console . log ( 'Regular async result:' , result ) ;
113
+ setTestName ( 'Async Test Result' ) ;
114
+ setTestResult ( String ( result ) ) ;
115
+ } catch ( error ) {
116
+ setTestName ( 'Async Error' ) ;
117
+ setTestResult ( String ( error ) ) ;
118
+ }
119
+ } ;
120
+
121
+ const testMemoryAndPerformance = ( ) => {
122
+ const arr = new Array ( 1000000 ) ;
123
+ for ( let i = 0 ; i < arr . length ; i ++ ) {
124
+ arr [ i ] = i ;
125
+ }
126
+ const result = `Array length: ${ arr . length } ` ;
127
+
128
+ console . log ( result ) ;
129
+ setTestName ( 'Memory & Performance Result' ) ;
130
+ setTestResult ( result ) ;
131
+ } ;
132
+
65
133
return (
66
134
< SafeAreaView style = { backgroundStyle } >
67
135
< StatusBar
@@ -73,45 +141,47 @@ function App(): React.JSX.Element {
73
141
style = { backgroundStyle } >
74
142
< Header />
75
143
< View
76
- style = { {
77
- backgroundColor : isDarkMode ? Colors . black : Colors . white ,
78
- } } >
79
- < Section title = "Step One" >
80
- Edit < Text style = { styles . highlight } > App.tsx</ Text > to change this
81
- screen and then come back to see your edits.
82
- </ Section >
83
- < Section title = "See Your Changes" >
84
- < ReloadInstructions />
85
- </ Section >
86
- < Section title = "Debug" >
87
- < DebugInstructions />
88
- </ Section >
89
- < Section title = "Learn More" >
90
- Read the docs to discover what to do next:
91
- </ Section >
92
- < LearnMoreLinks />
144
+ style = { [
145
+ styles . container ,
146
+ { backgroundColor : isDarkMode ? Colors . black : Colors . white } ,
147
+ ] } >
148
+ < Button title = "Console Log Test" onPress = { testConsoleLog } />
149
+ < Button title = "Basic Operations" onPress = { testBasicOperations } />
150
+ < Button title = "Complex Operations" onPress = { testComplexOperations } />
151
+ < Button title = "Global Access Test" onPress = { testGlobalAccess } />
152
+ < Button title = "Error Handling Test" onPress = { testErrorHandling } />
153
+ < Button title = "Async Test" onPress = { testAsync } />
154
+ < Button title = "Memory & Performance" onPress = { testMemoryAndPerformance } />
155
+ < View style = { styles . resultContainer } >
156
+ < Text style = { styles . resultTitle } testID = "resultTitle" >
157
+ { testName || 'Test Results' }
158
+ </ Text >
159
+ < Text style = { styles . resultContent } testID = "resultContent" >
160
+ { testResult }
161
+ </ Text >
162
+ </ View >
93
163
</ View >
94
164
</ ScrollView >
95
165
</ SafeAreaView >
96
166
) ;
97
167
}
98
168
99
169
const styles = StyleSheet . create ( {
100
- sectionContainer : {
101
- marginTop : 32 ,
102
- paddingHorizontal : 24 ,
170
+ container : {
171
+ padding : 12 ,
103
172
} ,
104
- sectionTitle : {
105
- fontSize : 24 ,
106
- fontWeight : '600' ,
173
+ resultContainer : {
174
+ marginTop : 20 ,
175
+ padding : 10 ,
176
+ backgroundColor : '#f0f0f0' ,
107
177
} ,
108
- sectionDescription : {
109
- marginTop : 8 ,
110
- fontSize : 18 ,
111
- fontWeight : '400' ,
178
+ resultTitle : {
179
+ fontSize : 16 ,
180
+ fontWeight : 'bold' ,
181
+ marginBottom : 8 ,
112
182
} ,
113
- highlight : {
114
- fontWeight : '700' ,
183
+ resultContent : {
184
+ fontSize : 14 ,
115
185
} ,
116
186
} ) ;
117
187
0 commit comments