From 26e78539bf3e8ead0ad950eef0b76766410f9118 Mon Sep 17 00:00:00 2001 From: YoussefFouadd Date: Sun, 10 Nov 2024 16:58:36 +0200 Subject: [PATCH 1/3] Adding WebViews to sample app --- examples/default/ios/Podfile.lock | 9 ++++++- examples/default/package.json | 3 ++- examples/default/src/navigation/HomeStack.tsx | 21 +++++++++++++++ .../default/src/screens/apm/APMScreen.tsx | 1 + .../apm/webViews/FullWebViewsScreen.tsx | 15 +++++++++++ .../apm/webViews/PartialWebViewsScreen.tsx | 27 +++++++++++++++++++ .../screens/apm/webViews/WebViewsScreen.tsx | 16 +++++++++++ examples/default/yarn.lock | 10 ++++++- 8 files changed, 99 insertions(+), 3 deletions(-) create mode 100644 examples/default/src/screens/apm/webViews/FullWebViewsScreen.tsx create mode 100644 examples/default/src/screens/apm/webViews/PartialWebViewsScreen.tsx create mode 100644 examples/default/src/screens/apm/webViews/WebViewsScreen.tsx diff --git a/examples/default/ios/Podfile.lock b/examples/default/ios/Podfile.lock index e59615769..1099c14ad 100644 --- a/examples/default/ios/Podfile.lock +++ b/examples/default/ios/Podfile.lock @@ -360,6 +360,9 @@ PODS: - React-Core - react-native-slider (4.4.3): - React-Core + - react-native-webview (13.12.3): + - RCT-Folly (= 2021.07.22.00) + - React-Core - React-NativeModulesApple (0.72.3): - hermes-engine - React-callinvoker @@ -549,6 +552,7 @@ DEPENDENCIES: - react-native-maps (from `../node_modules/react-native-maps`) - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`) - "react-native-slider (from `../node_modules/@react-native-community/slider`)" + - react-native-webview (from `../node_modules/react-native-webview`) - React-NativeModulesApple (from `../node_modules/react-native/ReactCommon/react/nativemodule/core/platform/ios`) - React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`) - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`) @@ -643,6 +647,8 @@ EXTERNAL SOURCES: :path: "../node_modules/react-native-safe-area-context" react-native-slider: :path: "../node_modules/@react-native-community/slider" + react-native-webview: + :path: "../node_modules/react-native-webview" React-NativeModulesApple: :path: "../node_modules/react-native/ReactCommon/react/nativemodule/core/platform/ios" React-perflogger: @@ -729,6 +735,7 @@ SPEC CHECKSUMS: react-native-maps: 72a8a903f8a1b53e2c777ba79102078ab502e0bf react-native-safe-area-context: 9697629f7b2cda43cf52169bb7e0767d330648c2 react-native-slider: 1cdd6ba29675df21f30544253bf7351d3c2d68c4 + react-native-webview: 849250e66239f661c802a879c59e019da8a08736 React-NativeModulesApple: c57f3efe0df288a6532b726ad2d0322a9bf38472 React-perflogger: 6bd153e776e6beed54c56b0847e1220a3ff92ba5 React-RCTActionSheet: c0b62af44e610e69d9a2049a682f5dba4e9dff17 @@ -758,4 +765,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 281036e04bd4b9e7c2cc03a503b3245d3f1dd0dd -COCOAPODS: 1.12.0 +COCOAPODS: 1.15.2 diff --git a/examples/default/package.json b/examples/default/package.json index a618c2811..f8d22d120 100644 --- a/examples/default/package.json +++ b/examples/default/package.json @@ -15,8 +15,8 @@ "@react-navigation/bottom-tabs": "^6.5.7", "@react-navigation/native": "^6.1.6", "@react-navigation/native-stack": "^6.9.12", - "graphql": "^16.8.1", "axios": "^1.7.4", + "graphql": "^16.8.1", "graphql-request": "^6.1.0", "instabug-reactnative": "link:../..", "instabug-reactnative-ndk": "github:https://github.com/Instabug/Instabug-React-Native-NDK", @@ -32,6 +32,7 @@ "react-native-screens": "^3.20.0", "react-native-svg": "^13.9.0", "react-native-vector-icons": "^10.0.0", + "react-native-webview": "^13.12.3", "react-query": "^3.39.3" }, "devDependencies": { diff --git a/examples/default/src/navigation/HomeStack.tsx b/examples/default/src/navigation/HomeStack.tsx index 716ea05d9..090aa6587 100644 --- a/examples/default/src/navigation/HomeStack.tsx +++ b/examples/default/src/navigation/HomeStack.tsx @@ -28,6 +28,9 @@ import { FlowsScreen } from '../screens/apm/FlowsScreen'; import { SessionReplayScreen } from '../screens/SessionReplayScreen'; import { LegacyModeScreen } from '../screens/LegacyModeScreen'; import { HttpScreen } from '../screens/apm/HttpScreen'; +import { WebViewsScreen } from '../screens/apm/webViews/WebViewsScreen'; +import { FullWebViewsScreen } from '../screens/apm/webViews/FullWebViewsScreen'; +import { PartialWebViewsScreen } from '../screens/apm/webViews/PartialWebViewsScreen'; export type HomeStackParamList = { Home: undefined; @@ -55,6 +58,9 @@ export type HomeStackParamList = { NetworkTraces: undefined; ExecutionTraces: undefined; AppFlows: undefined; + WebViews: undefined; + FullWebViews: undefined; + PartialWebViews: undefined; }; const HomeStack = createNativeStackNavigator(); @@ -142,6 +148,21 @@ export const HomeStackNavigator: React.FC = () => { options={{ title: 'LegacyMode' }} /> + + + ); }; diff --git a/examples/default/src/screens/apm/APMScreen.tsx b/examples/default/src/screens/apm/APMScreen.tsx index 0b04e6191..d63ee65f4 100644 --- a/examples/default/src/screens/apm/APMScreen.tsx +++ b/examples/default/src/screens/apm/APMScreen.tsx @@ -26,6 +26,7 @@ export const APMScreen: React.FC navigation.navigate('NetworkTraces')} /> navigation.navigate('ExecutionTraces')} /> navigation.navigate('AppFlows')} /> + navigation.navigate('WebViews')} /> ); }; diff --git a/examples/default/src/screens/apm/webViews/FullWebViewsScreen.tsx b/examples/default/src/screens/apm/webViews/FullWebViewsScreen.tsx new file mode 100644 index 000000000..fbee5c028 --- /dev/null +++ b/examples/default/src/screens/apm/webViews/FullWebViewsScreen.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { Screen } from '../../../components/Screen'; +import { WebView } from 'react-native-webview'; + +export const FullWebViewsScreen: React.FC = () => { + return ( + + + + ); +}; diff --git a/examples/default/src/screens/apm/webViews/PartialWebViewsScreen.tsx b/examples/default/src/screens/apm/webViews/PartialWebViewsScreen.tsx new file mode 100644 index 000000000..6cb4a6263 --- /dev/null +++ b/examples/default/src/screens/apm/webViews/PartialWebViewsScreen.tsx @@ -0,0 +1,27 @@ +import React from 'react'; +import { Screen } from '../../../components/Screen'; +import { WebView } from 'react-native-webview'; +import { StyleSheet } from 'react-native'; + +export const PartialWebViewsScreen: React.FC = () => { + return ( + + + + + ); +}; +const styles = StyleSheet.create({ + webView: { + marginBottom: 20, + }, +}); diff --git a/examples/default/src/screens/apm/webViews/WebViewsScreen.tsx b/examples/default/src/screens/apm/webViews/WebViewsScreen.tsx new file mode 100644 index 000000000..0c3309dfe --- /dev/null +++ b/examples/default/src/screens/apm/webViews/WebViewsScreen.tsx @@ -0,0 +1,16 @@ +import type { NativeStackScreenProps } from '@react-navigation/native-stack'; +import type { HomeStackParamList } from '../../../navigation/HomeStack'; +import React from 'react'; +import { Screen } from '../../../components/Screen'; +import { ListTile } from '../../../components/ListTile'; + +export const WebViewsScreen: React.FC> = ({ + navigation, +}) => { + return ( + + navigation.navigate('FullWebViews')} /> + navigation.navigate('PartialWebViews')} /> + + ); +}; diff --git a/examples/default/yarn.lock b/examples/default/yarn.lock index 10aaed1cd..2969963d4 100644 --- a/examples/default/yarn.lock +++ b/examples/default/yarn.lock @@ -4703,7 +4703,7 @@ intl-messageformat@^10.1.0: "@formatjs/icu-messageformat-parser" "2.6.0" tslib "^2.4.0" -invariant@*, invariant@^2.2.4: +invariant@*, invariant@2.2.4, invariant@^2.2.4: version "2.2.4" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA== @@ -6842,6 +6842,14 @@ react-native-vector-icons@^10.0.0: prop-types "^15.7.2" yargs "^16.1.1" +react-native-webview@^13.12.3: + version "13.12.3" + resolved "https://registry.yarnpkg.com/react-native-webview/-/react-native-webview-13.12.3.tgz#3aa9d2fc982ba2681e56d3e96e22b63a0d929270" + integrity sha512-Y1I5YyDYyE7NC96RHLhd2nxh7ymLYOYLTefgx5ixxw2OToQK0ow3OJ+o77QcI1Tuevj5PCxwqC/14ceS/7yPJQ== + dependencies: + escape-string-regexp "^4.0.0" + invariant "2.2.4" + react-native@0.72.3: version "0.72.3" resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.72.3.tgz#f8d85ec81c9f3592d091ec8e9ac1694956a72765" From b40472b95614af7d4ed654da57ca30b8ff494ec5 Mon Sep 17 00:00:00 2001 From: YoussefFouadd Date: Mon, 11 Nov 2024 11:53:02 +0200 Subject: [PATCH 2/3] Fixing Pods issue --- examples/default/ios/Podfile.lock | 25 +++++++++++++++++++++---- examples/default/yarn.lock | 2 +- 2 files changed, 22 insertions(+), 5 deletions(-) diff --git a/examples/default/ios/Podfile.lock b/examples/default/ios/Podfile.lock index 7c179ef9a..17f854952 100644 --- a/examples/default/ios/Podfile.lock +++ b/examples/default/ios/Podfile.lock @@ -1306,10 +1306,27 @@ PODS: - RCTRequired - RCTTypeSafety - React-Core + - React-debug + - React-Fabric + - React-featureflags + - React-graphics + - React-ImageManager + - React-NativeModulesApple + - React-RCTFabric + - React-rendererdebug + - React-utils + - ReactCodegen + - ReactCommon/turbomodule/bridging + - ReactCommon/turbomodule/core + - Yoga - react-native-webview (13.12.3): - - RCT-Folly (= 2021.07.22.00) + - DoubleConversion + - glog + - hermes-engine + - RCT-Folly (= 2024.01.01.00) + - RCTRequired + - RCTTypeSafety - React-Core - - React-NativeModulesApple (0.72.3): - React-debug - React-Fabric - React-featureflags @@ -2038,7 +2055,7 @@ SPEC CHECKSUMS: react-native-maps: 72a8a903f8a1b53e2c777ba79102078ab502e0bf react-native-safe-area-context: 142fade490cbebbe428640b8cbdb09daf17e8191 react-native-slider: 4a0f3386a38fc3d2d955efc515aef7096f7d1ee4 - react-native-webview: 849250e66239f661c802a879c59e019da8a0873 + react-native-webview: 926d2665cf3196e39c4449a72d136d0a53b9df8a React-nativeconfig: 8c83d992b9cc7d75b5abe262069eaeea4349f794 React-NativeModulesApple: 9f7920224a3b0c7d04d77990067ded14cee3c614 React-perflogger: 59e1a3182dca2cee7b9f1f7aab204018d46d1914 @@ -2077,4 +2094,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 9116afa418638f45a5fba99099befb7da0049828 -COCOAPODS: 1.14.0 +COCOAPODS: 1.15.2 diff --git a/examples/default/yarn.lock b/examples/default/yarn.lock index 4be0153df..3e1f047c3 100644 --- a/examples/default/yarn.lock +++ b/examples/default/yarn.lock @@ -4427,7 +4427,7 @@ intl-messageformat@^10.1.0: "@formatjs/icu-messageformat-parser" "2.9.1" tslib "2" -invariant@^2.2.4: +invariant@2.2.4, invariant@^2.2.4: version "2.2.4" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA== From 15bc288359f890846f2541c68c4f2fb3488dc4d5 Mon Sep 17 00:00:00 2001 From: YoussefFouadd Date: Mon, 11 Nov 2024 15:35:01 +0200 Subject: [PATCH 3/3] Fixing CI --- examples/default/ios/Podfile.lock | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/default/ios/Podfile.lock b/examples/default/ios/Podfile.lock index 17f854952..7ea0faa2a 100644 --- a/examples/default/ios/Podfile.lock +++ b/examples/default/ios/Podfile.lock @@ -2094,4 +2094,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 9116afa418638f45a5fba99099befb7da0049828 -COCOAPODS: 1.15.2 +COCOAPODS: 1.14.0