react-native-in-app-debugger 1.0.83 → 1.0.84

package/Api/Row.jsx

@@ -68,7 +68,7 @@ export default ({ item, filter, wrap, setWrap }) => {
           </Text>
         </TouchableOpacity>
       </View>
-      <Comp horizontal>
+      <Comp horizontal style={{flex:1}}>
         {tab === tabs[0].value && hasResponse && (
           <Text style={{ color: "white" }}>
             <Highlight

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-in-app-debugger",
-  "version": "1.0.83",
+  "version": "1.0.84",
   "description": "This library's main usage is to be used by Non-Technical testers during UAT, SIT or any testing phase.",
   "main": "index.jsx",
   "scripts": {

package/postinstall.js

@@ -10,15 +10,15 @@ for (const d in read('../../package.json').dependencies) {
 fs.writeSync(parentDependencies, '}');
 fs.closeSync(parentDependencies);
 
-const isRNVersionGTE0780 = (v) => v.split('.').map(Number)[1] < 78;
+// const isRNVersionGTE0780 = (v) => v.split('.').map(Number)[1] < 78;
 
-if (isRNVersionGTE0780(read('../react-native/package.json').version)) {
-  try {
-    const filePath = './useApiInterceptor.js';
-    const regex = new RegExp('react-native/src/private/inspector/XHRInterceptor.js', 'g');
-    const fileContent = fs.readFileSync(filePath, 'utf8').replace(regex, 'react-native/Libraries/Network/XHRInterceptor.js');
-    fs.writeFileSync(filePath, fileContent, 'utf8');
-  } catch (err) {
-    console.error('Error while replacing strings in file:', err);
-  }
-}
+// if (isRNVersionGTE0780(read('../react-native/package.json').version)) {
+//   try {
+//     const filePath = './useApiInterceptor.js';
+//     const regex = new RegExp('react-native/src/private/inspector/XHRInterceptor.js', 'g');
+//     const fileContent = fs.readFileSync(filePath, 'utf8').replace(regex, 'react-native/Libraries/Network/XHRInterceptor.js');
+//     fs.writeFileSync(filePath, fileContent, 'utf8');
+//   } catch (err) {
+//     console.error('Error while replacing strings in file:', err);
+//   }
+// }

package/useApiInterceptor.js

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
-import XHRInterceptor from 'react-native/src/private/inspector/XHRInterceptor.js';
-
+// import XHRInterceptor from 'react-native/Libraries/Network/XHRInterceptor.js';
+import axios from 'axios';
+const overrideResponse = false; // Set to true to override the response with a random value
 const filterNonBusinessRelatedAPI = true;
 
 const shouldExclude = (url, method) =>
@@ -81,42 +82,106 @@ export default (maxNumOfApiToStore, blacklists, interceptResponse, blacklistRef)
   };
 
   useEffect(() => {
-    XHRInterceptor.enableInterception();
-    // console.log('API interceptor status', XHRInterceptor.isInterceptorEnabled());
-    XHRInterceptor.setSendCallback((...obj) => {
-      obj[1].responseType = 'text';
-      const data = parse(obj[0]);
-
-      const { _method: method, _url: url, _headers: headers } = obj[1];
-      if (filterNonBusinessRelatedAPI) {
-        if (shouldExclude(url, method)) return;
+    const originalFetch = global.fetch;
+    global.fetch = async function (...args) {
+      console.log('[Fetch Request]', args);
+      const [url, { headers, method, body }] = args;
+
+      try {
+        if (!shouldExclude(url, method)) {
+          const data = body ? parse(body): undefined;
+          makeRequest({
+            url,
+            headers,
+            method,
+            data,
+          });
+        }
+        const response = await originalFetch(...args);
+
+        receiveResponse({
+          config: response,
+          status: response.status,
+        });
+
+        // console.log('[Fetch Response]', args);
+
+        // if (overrideResponse) {
+        //   // Mock a random response value
+        //   const randomValue = { message: 'Random overridden fetch response' };
+
+        //   // Create a new Response object with JSON stringified randomValue
+        //   return new Response(JSON.stringify(randomValue), {
+        //     status: 200,
+        //     headers: { 'Content-Type': 'application/json' },
+        //   });
+        // }
+
+        return response;
+      } catch (error) {
+        // console.log(error);
+        // console.error('[Fetch Error]', error);
+        throw error;
       }
+    };
 
-      makeRequest({
-        url,
-        headers,
-        method,
-        data,
-      });
-    });
+    // --- Intercept Axios globally ---
+    axios.interceptors.request.use(
+      (config) => {
+        // console.log('[Axios Request]', config);
+
+        const { method, url, headers } = config;
+        if (!shouldExclude(url, method)) {
+          const data = config.data ? parse(config.data) : undefined;
+          makeRequest({
+            url,
+            headers,
+            method,
+            data,
+          });
+        }
 
-    XHRInterceptor.setResponseCallback((...obj) => {
-      interceptResponse?.(...obj);
-      const { _method: method, _url: url, _response, status } = obj[5];
-      if (filterNonBusinessRelatedAPI) {
-        if (shouldExclude(url, method)) return;
-      }
-      const data = parse(_response);
-
-      receiveResponse({
-        config: {
-          url,
-          method,
-        },
-        data,
-        status,
-      });
-    });
+        return config;
+      },
+      (error) => {
+        // alert(JSON.stringify(error));
+        console.error('[Axios Request Error]', error);
+        //  receiveResponse({
+        //   config: error.config,
+        //   status: error.response?.status,
+        // });
+        receiveResponse({
+          config: error.config,
+          status: error.response?.status,
+        });
+        return Promise.reject(error);
+      },
+    );
+
+    axios.interceptors.response.use(
+      (response) => {
+        // console.log('[Axios Response]', response);
+
+        // if (overrideResponse) {
+        //   // Replace response.data with random value
+        //   response.data = { message: 'Random overridden Axios response' };
+        // }
+        receiveResponse({
+          config: response.config,
+          data: response.data,
+          status: response.status,
+        });
+
+        return response;
+      },
+      (error) => {
+        receiveResponse({
+          config: error.config,
+          status: error.response?.status,
+        });
+        return Promise.reject(error);
+      },
+    );
   }, []);
 
   return { apis, clear: () => setApis([]), bookmarks, setBookmarks };