@truewatchtech/react-native-mobile 0.3.15-alpha.1

package/src/rum/FTRumActionTracking.tsx

@@ -0,0 +1,232 @@
+import React from 'react'
+import { FTReactNativeRUM } from '../ft_rum';
+const FT_ENABLE_TRACK = 'ft-enable-track';
+const FT_EXTRA_PROPERTY = 'ft-extra-property';
+export class FTRumActionTracking {
+	private static isTracking = false
+	private static preActionTimestamp = Number.MIN_VALUE;
+	private static originalMemo = React.memo;
+    private static originalJsx = null;
+    private static originalCreateElement = React.createElement;
+
+	private static patchCreateElementFunction = (
+        originalFunction: typeof React.createElement,
+        [element, props, ...rest]: Parameters<typeof React.createElement>
+    ): ReturnType<typeof React.createElement> => {
+        if (
+            props &&
+            typeof (props as Record<string, unknown>).onPress === 'function'
+        ) {
+            const originalOnPress = (props as Record<string, unknown>) // eslint-disable-next-line @typescript-eslint/ban-types
+                .onPress as Function;
+            (props as Record<string, unknown>).onPress = (...args: any[]) => {
+                FTRumActionTracking.interceptOnPress(
+                    ...args
+                );
+                return originalOnPress(...args);
+            };
+            
+            (props as Record<
+                string,
+                unknown
+            >).__FT_INTERNAL_ORIGINAL_ON_PRESS__ = originalOnPress;
+        }
+        return originalFunction(element, props, ...rest);
+    };
+	static startTracking(): void {
+		if (FTRumActionTracking.isTracking) {
+			return
+		}
+		const original = React.createElement
+		React.createElement = (
+            ...args: Parameters<typeof React.createElement>
+        ): any => {
+            return this.patchCreateElementFunction(original, args);
+        };
+        try {
+            const jsxRuntime = getJsxRuntime();
+            const originaljsx = jsxRuntime.jsx;
+            this.originalJsx = originaljsx;
+            jsxRuntime.jsx = (
+                ...args: Parameters<typeof React.createElement>
+            ): ReturnType<typeof React.createElement> => {
+                return this.patchCreateElementFunction(originaljsx, args);
+            };
+        } catch (e) {
+           
+        }
+
+        const originalMemo = React.memo;
+        React.memo = (
+            component: any,
+            propsAreEqual?: (prevProps: any, newProps: any) => boolean
+        ) => {
+            return originalMemo(component, (prev, next) => {
+                if (!next.onPress || !prev.onPress) {
+                    return propsAreEqual
+                        ? propsAreEqual(prev, next)
+                        : areObjectShallowEqual(prev, next);
+                }
+
+				const { onPress: _prevOnPress, ...partialPrevProps } = prev;
+                const prevProps = {
+                    ...partialPrevProps,
+                    onPress: prev.__FT_INTERNAL_ORIGINAL_ON_PRESS__
+                };
+
+                const { onPress: _nextOnPress, ...partialNextProps } = next;
+                const nextProps = {
+                    ...partialNextProps,
+                    onPress: next.__FT_INTERNAL_ORIGINAL_ON_PRESS__
+                };
+
+                return propsAreEqual
+                    ? propsAreEqual(prevProps, nextProps)
+                    : areObjectShallowEqual(nextProps, prevProps);
+            });
+        };
+		FTRumActionTracking.isTracking = true
+	}
+	static stopTracking() {
+        React.createElement = this.originalCreateElement;
+        React.memo = this.originalMemo;
+        FTRumActionTracking.isTracking = false;
+        if (this.originalJsx) {
+            const jsxRuntime = getJsxRuntime();
+            jsxRuntime.jsx = this.originalJsx;
+            this.originalJsx = null;
+        }
+    }
+
+	private static interceptOnPress(...args: any[]): void {
+		if (args.length > 0 && args[0] && args[0]._targetInst) {
+			const currentTime = Date.now()
+			const timestampDifference = Math.abs(Date.now() - FTRumActionTracking.preActionTimestamp)
+			if (timestampDifference > 10) {
+				const targetNode = args[0]._targetInst
+				this.handleTargetEvent(targetNode)
+				FTRumActionTracking.preActionTimestamp = currentTime 
+			}
+		}
+	}
+
+    private static handleTargetEvent(targetNode: any | null) {
+        if (targetNode) {
+            const enable = FTRumActionTracking.findActionEnableTrack(targetNode);
+            if (enable) {
+                const extraProperty = FTRumActionTracking.findActionProperty(targetNode);
+                const elementTypeName = FTRumActionTracking.resolveActionName(targetNode);
+                if (elementTypeName) {
+                    let jsonObject = null
+                    if (extraProperty) {
+                        try {
+                            jsonObject = JSON.parse(extraProperty)
+                        } catch (error) {
+                            console.warn(`Error parsing JSON string ${extraProperty}:`,error);
+                        }
+                    }
+                    if (jsonObject){
+                        FTReactNativeRUM.startAction(elementTypeName, 'click',jsonObject);
+                    }else{
+                        FTReactNativeRUM.startAction(elementTypeName, 'click');
+                    }
+                }
+            }
+        }
+    }
+
+	private static resolveActionName(targetNode:any): string | null {
+		const accessibilityLabel = targetNode.memoizedProps?.accessibilityLabel
+		if(accessibilityLabel != null){
+			return  accessibilityLabel;
+		}
+		const accessibilityRole = targetNode.memoizedProps?.accessibilityRole;
+			let subTitle = '';
+			let children = targetNode.memoizedProps?.children;
+			while (children){
+				if(Array.isArray(children) && children.length>0 && children[0]){
+					children = children[0];
+				}else if(typeof children === 'object' && children.props && children.props.children){
+					children = children.props.children;
+				}else if(typeof children === 'string'){
+					subTitle = children;
+					children = null;
+				}else{
+					children = null;
+				}
+			}
+			let elementTypeName = accessibilityRole;
+			if(!accessibilityRole){
+				let elementType = targetNode.elementType;
+				if (typeof elementType === "string") {
+					elementTypeName = elementType
+				} else if (elementType && typeof elementType.name === "string") {
+					elementTypeName = elementType.name
+				}
+			}
+			if(elementTypeName){
+				return '['+elementTypeName+']'+subTitle;
+			}
+			return null;
+   
+	}
+    private static findActionProperty(targetNode: any): string | null {
+        let currentNode = targetNode;
+        while (currentNode) {
+            const props = currentNode.memoizedProps;
+            if (props && props[FT_EXTRA_PROPERTY]) {
+                return props[FT_EXTRA_PROPERTY];
+            }
+            currentNode = currentNode.return;
+        }
+        return null;
+    }
+    private static findActionEnableTrack(targetNode: any): boolean {
+        let currentNode = targetNode;
+        let enable = true
+        while (currentNode) {
+            const props = currentNode.memoizedProps;
+            if (props && props[FT_ENABLE_TRACK]) {
+                enable = props[FT_ENABLE_TRACK] == "true";
+                break;
+            }
+            currentNode = currentNode.return;
+        }
+        return enable;
+    }
+}
+
+const areObjectShallowEqual = (
+	objectA: Record<string, unknown> | undefined | null,
+	objectB: Record<string, unknown> | undefined | null
+): boolean => {
+	if (!objectA || !objectB) {
+		return objectA === objectB;
+	}
+
+	const keys = Object.keys(objectA);
+	if (keys.length !== Object.keys(objectB).length) {
+		return false;
+	}
+	for (const key of keys) {
+		if (objectA[key] !== objectB[key]) {
+			return false;
+		}
+	}
+	return true;
+};
+const getJsxRuntime = () => {
+    // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires
+    const [major, minor] = require('react/package.json').version.split('.');
+	// JSX Transform applies to > 16.14.0
+    if (Number(major)<=16&&Number(minor)<14) {
+         throw new Error('React version does not support new jsx transform');
+    }
+
+    // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires
+    const jsxRuntime = require('react/jsx-runtime');
+    if (!jsxRuntime.jsx) {
+        throw new Error('React jsx runtime does not export new jsx transform');
+    }
+    return jsxRuntime;
+};

package/src/rum/FTRumErrorTracking.tsx

@@ -0,0 +1,110 @@
+import type { ErrorHandlerCallback } from 'react-native';
+import { FTReactNativeRUM } from '../ft_rum';
+const EMPTY_MESSAGE = 'Unknown Error';
+const CONSOLE_ERROR = "console_error";
+
+export class FTRumErrorTracking {
+  private static isTracking = false;
+
+  private static isInDefaultErrorHandler = false;
+
+  // Original error handler method
+  private static defaultErrorHandler: ErrorHandlerCallback = (_error: any, _isFatal?: boolean) => { }
+
+  // Original console error handler method
+  private static defaultConsoleError = (..._params: unknown[]) => { }
+
+  static startTracking(): void {
+    if(FTRumErrorTracking.isTracking){
+      return;
+    }
+    if (ErrorUtils) {
+      FTRumErrorTracking.defaultErrorHandler = ErrorUtils.getGlobalHandler;
+      FTRumErrorTracking.defaultConsoleError = console.error;
+      ErrorUtils.setGlobalHandler(FTRumErrorTracking.onGlobalError);
+      console.error = FTRumErrorTracking.onConsoleError;
+      FTRumErrorTracking.isTracking = true;
+    }
+  }
+  static onGlobalError(error: any, isFatal?: boolean): void {
+    const message = FTRumErrorTracking.getErrorMessage(error);
+    const stacktrace = FTRumErrorTracking.getErrorStackTrace(error);
+    FTReactNativeRUM.addError(
+      stacktrace,
+      message
+      ).then(() => {
+        try {
+          FTRumErrorTracking.isInDefaultErrorHandler = true;
+          //Call the original error handler method
+          FTRumErrorTracking.defaultErrorHandler(error, isFatal);
+        } finally {
+          FTRumErrorTracking.isInDefaultErrorHandler = false;
+        }
+      });
+    }
+
+    static onConsoleError(...params: unknown[]): void {
+      if ( FTRumErrorTracking.isInDefaultErrorHandler) {
+        return;
+      }
+
+      let stack: string = '';
+      for (let i = 0; i < params.length; i += 1) {
+        const param = params[i];
+        const paramStack = FTRumErrorTracking.getErrorStackTrace(param);
+        if (paramStack != undefined && paramStack != '') {
+          stack = paramStack;
+          break;
+        }
+      }
+
+      const message = params.map((param) => {
+        if (typeof param === 'string') { return param; }
+        else { return FTRumErrorTracking.getErrorMessage(param); }
+      }).join(' ');
+
+
+      FTReactNativeRUM.addErrorWithType(
+        CONSOLE_ERROR,
+        stack,
+        message,
+        ).then(() => {
+          FTRumErrorTracking.defaultConsoleError.apply(console, params);
+        });
+
+      }
+      private static getErrorMessage(error: any | undefined): string {
+        let message = EMPTY_MESSAGE;
+        if (error == undefined || error === null) {
+          message = EMPTY_MESSAGE;
+        } else if (typeof error === 'object' && 'message' in error){
+          message = String(error.message);
+        } else {
+          message = String(error);
+        }
+
+        return message
+      }
+
+      private static getErrorStackTrace(error: any | undefined): string {
+        let stack = '';
+
+        if (error == undefined) {
+          stack = '';
+        } else if (typeof error === 'string') {
+          stack = '';
+        } else if ('componentStack' in error) {
+          stack = String(error.componentStack);
+        } else if ('stacktrace' in error) {
+          stack = String(error.stacktrace);
+        } else if ('stack' in error) {
+          stack = String(error.stack);
+        } else if (('sourceURL' in error) && ('line' in error) && ('column' in error)) {
+          stack = `at ${error.sourceURL}:${error.line}:${error.column}`;
+        }
+
+        return stack
+      }
+    }
+
+

package/src/version.ts

@@ -0,0 +1,2 @@
+// generated by genversion
+export const version = '0.3.15-alpha.1';