@multiplayer-app/session-recorder-react-native 0.0.1-alpha.9 → 0.0.1-beta.10

package/src/otel/instrumentations/gestureInstrumentation.ts

@@ -1,141 +0,0 @@
-import { InstrumentationBase } from '@opentelemetry/instrumentation'
-import { trace, SpanStatusCode } from '@opentelemetry/api'
-
-export class GestureInstrumentation extends InstrumentationBase {
-  private _isEnabled = false
-
-  constructor() {
-    super('react-native-gesture', '1.0.0', {})
-  }
-
-  init(): void {
-    // Initialize the instrumentation
-  }
-
-  enable(): void {
-    this._isEnabled = true
-  }
-
-  disable(): void {
-    this._isEnabled = false
-  }
-
-  isEnabled(): boolean {
-    return this._isEnabled
-  }
-
-  // Manual gesture tracking methods
-  recordTap(x: number, y: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.tap', {
-      attributes: {
-        'gesture.type': 'tap',
-        'gesture.coordinates.x': x,
-        'gesture.coordinates.y': y,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordSwipe(direction: string, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.swipe', {
-      attributes: {
-        'gesture.type': 'swipe',
-        'gesture.direction': direction,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordPinch(scale: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.pinch', {
-      attributes: {
-        'gesture.type': 'pinch',
-        'gesture.scale': scale,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordPan(deltaX: number, deltaY: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.pan', {
-      attributes: {
-        'gesture.type': 'pan',
-        'gesture.delta_x': deltaX,
-        'gesture.delta_y': deltaY,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordLongPress(duration: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.longPress', {
-      attributes: {
-        'gesture.type': 'longPress',
-        'gesture.duration': duration,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  // Error tracking for gesture failures
-  recordGestureError(error: Error, gestureType: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan(`Gesture.${gestureType}.error`, {
-      attributes: {
-        'gesture.type': gestureType,
-        'gesture.error': true,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    span.setStatus({ code: SpanStatusCode.ERROR, message: error.message })
-    span.recordException(error)
-    span.end()
-  }
-}

package/src/otel/instrumentations/index.ts

@@ -1,120 +0,0 @@
-import { FetchInstrumentation } from '@opentelemetry/instrumentation-fetch'
-import { XMLHttpRequestInstrumentation } from '@opentelemetry/instrumentation-xml-http-request'
-
-import { OTEL_IGNORE_URLS } from '../../config'
-import { TracerReactNativeConfig } from '../../types'
-import { extractResponseBody, headersToObject, processHttpPayload } from '../helpers'
-import { logger } from '../../utils'
-
-export function getInstrumentations(config: TracerReactNativeConfig) {
-
-  const instrumentations = []
-
-  // Fetch instrumentation
-  try {
-    instrumentations.push(
-      new FetchInstrumentation({
-        clearTimingResources: false,
-        ignoreUrls: [
-          ...OTEL_IGNORE_URLS,
-          ...(config.ignoreUrls || []),
-        ],
-        propagateTraceHeaderCorsUrls: config.propagateTraceHeaderCorsUrls,
-        applyCustomAttributesOnSpan: async (span, request, response) => {
-          if (!config) return
-
-          const { captureBody, captureHeaders } = config
-
-          try {
-            if (!captureBody && !captureHeaders) {
-              return
-            }
-
-            const requestBody = request.body
-            const requestHeaders = headersToObject(request.headers)
-            const responseHeaders = headersToObject(response instanceof Response ? response.headers : undefined)
-
-            let responseBody: string | null = null
-            if (response instanceof Response && response.body) {
-              responseBody = await extractResponseBody(response)
-            }
-
-            const payload = {
-              requestBody,
-              responseBody,
-              requestHeaders,
-              responseHeaders,
-            }
-            processHttpPayload(payload, config, span)
-          } catch (error) {
-            // eslint-disable-next-line
-            logger.error('DEBUGGER_LIB', 'Failed to capture fetch payload', error)
-          }
-        },
-      })
-    )
-  } catch (error) {
-    logger.warn('DEBUGGER_LIB', 'Fetch instrumentation not available', error)
-  }
-
-  // XMLHttpRequest instrumentation
-  try {
-    instrumentations.push(
-      new XMLHttpRequestInstrumentation({
-        clearTimingResources: false,
-        ignoreUrls: [
-          ...OTEL_IGNORE_URLS,
-          ...(config.ignoreUrls || []),
-        ],
-        propagateTraceHeaderCorsUrls: config.propagateTraceHeaderCorsUrls,
-        applyCustomAttributesOnSpan: (span, xhr) => {
-          if (!config) return
-
-          const { captureBody, captureHeaders } = config
-
-          try {
-            if (!captureBody && !captureHeaders) {
-              return
-            }
-
-            // @ts-ignore
-            const requestBody = xhr.networkRequest.requestBody
-            // @ts-ignore
-            const responseBody = xhr.networkRequest.responseBody
-            // @ts-ignore
-            const requestHeaders = xhr.networkRequest.requestHeaders || {}
-            // @ts-ignore
-            const responseHeaders = xhr.networkRequest.responseHeaders || {}
-
-            const payload = {
-              requestBody,
-              responseBody,
-              requestHeaders,
-              responseHeaders,
-            }
-            processHttpPayload(payload, config, span)
-          } catch (error) {
-            // eslint-disable-next-line
-            logger.error('DEBUGGER_LIB', 'Failed to capture xml-http payload', error)
-          }
-        },
-      })
-    )
-  } catch (error) {
-    logger.warn('DEBUGGER_LIB', 'XMLHttpRequest instrumentation not available', error)
-  }
-
-  // Custom React Native instrumentations
-  // try {
-  //   instrumentations.push(new ReactNativeInstrumentation())
-  // } catch (error) {
-  //   console.warn('React Native instrumentation not available:', error)
-  // }
-
-  return instrumentations
-}
-
-// Export custom instrumentations for manual use
-export { ReactNativeInstrumentation } from './reactNativeInstrumentation'
-export { ReactNavigationInstrumentation } from './reactNavigationInstrumentation'
-export { GestureInstrumentation } from './gestureInstrumentation'

package/src/otel/instrumentations/reactNativeInstrumentation.ts

@@ -1,77 +0,0 @@
-import { InstrumentationBase } from '@opentelemetry/instrumentation'
-import { logger } from '../../utils'
-import { trace, SpanStatusCode } from '@opentelemetry/api'
-import AsyncStorage from '@react-native-async-storage/async-storage'
-
-export class ReactNativeInstrumentation extends InstrumentationBase {
-  constructor() {
-    super('react-native', '1.0.0', {})
-  }
-
-  init(): void {
-    // Initialize the instrumentation
-  }
-
-  enable(): void {
-    // Try to wrap AsyncStorage if it's available
-    try {
-      if (AsyncStorage) {
-        this._wrap(AsyncStorage, 'setItem', this._wrapAsyncStorage)
-      }
-    } catch (error) {
-      logger.warn('DEBUGGER_LIB', '@react-native-async-storage/async-storage is not available. AsyncStorage instrumentation will be disabled.')
-    }
-  }
-
-  disable(): void {
-    // Try to unwrap AsyncStorage if it was wrapped
-    try {
-      if (AsyncStorage) {
-        this._unwrap(AsyncStorage, 'setItem')
-      }
-    } catch (error) {
-      // AsyncStorage was not available, nothing to unwrap
-    }
-  }
-
-  private _wrapAsyncStorage(originalMethod: any) {
-    return async function (this: any, key: string, value: string) {
-      const startTime = Date.now()
-      try {
-        const result = await originalMethod.call(this, key, value)
-
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.setItem', {
-          attributes: {
-            'storage.operation': 'setItem',
-            'storage.key': key,
-            'storage.value_length': value.length,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        span.setStatus({ code: SpanStatusCode.OK })
-        span.end()
-
-        return result
-      } catch (error) {
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.setItem', {
-          attributes: {
-            'storage.operation': 'setItem',
-            'storage.key': key,
-            'storage.error': true,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        const errorMessage = error instanceof Error ? error.message : String(error)
-        span.setStatus({ code: SpanStatusCode.ERROR, message: errorMessage })
-        if (error instanceof Error) {
-          span.recordException(error)
-        }
-        span.end()
-
-        throw error
-      }
-    }
-  }
-}

package/src/otel/instrumentations/reactNavigationInstrumentation.ts

@@ -1,119 +0,0 @@
-import { InstrumentationBase } from '@opentelemetry/instrumentation'
-import { trace, SpanStatusCode } from '@opentelemetry/api'
-
-export class ReactNavigationInstrumentation extends InstrumentationBase {
-  private navigationRef: any = null
-
-  constructor() {
-    super('react-navigation', '1.0.0', {})
-  }
-
-  init(): void {
-    // Initialize the instrumentation
-  }
-
-  enable(): void {
-    // Enable the instrumentation
-    super.enable()
-  }
-
-  setNavigationRef(ref: any) {
-    this.navigationRef = ref
-    this._setupNavigationListener()
-  }
-
-  private _setupNavigationListener() {
-    if (!this.navigationRef) return
-
-    // Listen to navigation state changes
-    this.navigationRef.addListener('state', (e: any) => {
-      this._recordNavigationEvent('state_change', e.data)
-    })
-
-    // Listen to focus events
-    this.navigationRef.addListener('focus', (e: any) => {
-      this._recordNavigationEvent('focus', e.data)
-    })
-
-    // Listen to blur events
-    this.navigationRef.addListener('blur', (e: any) => {
-      this._recordNavigationEvent('blur', e.data)
-    })
-  }
-
-  private _recordNavigationEvent(eventType: string, data: any) {
-    const span = trace.getTracer('navigation').startSpan(`Navigation.${eventType}`, {
-      attributes: {
-        'navigation.system': 'ReactNavigation',
-        'navigation.operation': eventType,
-        'navigation.type': eventType,
-        'navigation.timestamp': Date.now(),
-      },
-    })
-
-    if (data) {
-      if (data.routeName) {
-        span.setAttribute('navigation.route_name', data.routeName)
-      }
-      if (data.params) {
-        span.setAttribute('navigation.params', JSON.stringify(data.params))
-      }
-      if (data.key) {
-        span.setAttribute('navigation.key', data.key)
-      }
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  // Manual navigation tracking methods
-  recordNavigate(routeName: string, params?: Record<string, any>) {
-    const span = trace.getTracer('navigation').startSpan('Navigation.navigate', {
-      attributes: {
-        'navigation.system': 'ReactNavigation',
-        'navigation.operation': 'navigate',
-        'navigation.route_name': routeName,
-        'navigation.timestamp': Date.now(),
-      },
-    })
-
-    if (params) {
-      span.setAttribute('navigation.params', JSON.stringify(params))
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordGoBack() {
-    const span = trace.getTracer('navigation').startSpan('Navigation.goBack', {
-      attributes: {
-        'navigation.system': 'ReactNavigation',
-        'navigation.operation': 'goBack',
-        'navigation.timestamp': Date.now(),
-      },
-    })
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordReset(routes: any[]) {
-    const span = trace.getTracer('navigation').startSpan('Navigation.reset', {
-      attributes: {
-        'navigation.system': 'ReactNavigation',
-        'navigation.operation': 'reset',
-        'navigation.routes_count': routes.length,
-        'navigation.timestamp': Date.now(),
-      },
-    })
-
-    if (routes.length > 0) {
-      span.setAttribute('navigation.initial_route', routes[0].name)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-}

package/src/patch/index.ts

@@ -1 +0,0 @@
-import './xhr'

package/src/patch/xhr.ts

@@ -1,142 +0,0 @@
-import {
-
-  isFormData,
-  isNullish,
-  isObject,
-  isString,
-} from '../utils/type-utils'
-import { formDataToQuery } from '../utils/request-utils'
-import { DEFAULT_MAX_HTTP_CAPTURING_PAYLOAD_SIZE } from '../config'
-
-let recordRequestHeaders = true
-let recordResponseHeaders = true
-const shouldRecordBody = true
-let maxCapturingHttpPayloadSize = DEFAULT_MAX_HTTP_CAPTURING_PAYLOAD_SIZE
-
-export const setMaxCapturingHttpPayloadSize = (_maxCapturingHttpPayloadSize: number) => {
-  maxCapturingHttpPayloadSize = _maxCapturingHttpPayloadSize
-}
-
-export const setShouldRecordHttpData = (shouldRecordBody: boolean, shouldRecordHeaders: boolean) => {
-  recordRequestHeaders = shouldRecordHeaders
-  recordResponseHeaders = shouldRecordHeaders
-  // eslint-disable-next-line
-  shouldRecordBody = shouldRecordBody
-}
-
-function _tryReadXHRBody({
-  body,
-  url,
-}: {
-  body: any | null | undefined
-  url: string | URL | RequestInfo
-}): string | null {
-  if (isNullish(body)) {
-    return null
-  }
-
-  if (isString(body)) {
-    return body
-  }
-
-
-  if (isFormData(body)) {
-    return formDataToQuery(body)
-  }
-
-  if (isObject(body)) {
-    try {
-      return JSON.stringify(body)
-    } catch {
-      return '[XHR] Failed to stringify response object'
-    }
-  }
-
-  return `[XHR] Cannot read body of type ${Object.prototype.toString.call(body)}`
-}
-
-(function (xhr) {
-  const originalOpen = XMLHttpRequest.prototype.open
-
-  xhr.open = function (
-    method: string,
-    url: string | URL,
-    async = true,
-    username?: string | null,
-    password?: string | null,
-  ) {
-    const xhr = this as XMLHttpRequest
-    const networkRequest: {
-      requestHeaders?: any,
-      requestBody?: any,
-      responseHeaders?: any,
-      responseBody?: any,
-    } = {}
-
-
-    // @ts-ignore
-    const requestHeaders: Record<string, string> = {}
-    const originalSetRequestHeader = xhr.setRequestHeader.bind(xhr)
-    xhr.setRequestHeader = (header: string, value: string) => {
-      requestHeaders[header] = value
-      return originalSetRequestHeader(header, value)
-    }
-    if (recordRequestHeaders) {
-      networkRequest.requestHeaders = requestHeaders
-    }
-
-    const originalSend = xhr.send.bind(xhr)
-    xhr.send = (body) => {
-      if (shouldRecordBody) {
-        const requestBody = _tryReadXHRBody({ body, url })
-
-        if (
-          requestBody?.length
-          && requestBody.length <= maxCapturingHttpPayloadSize
-        ) {
-          networkRequest.requestBody = requestBody
-        }
-      }
-      return originalSend(body)
-    }
-
-    xhr.addEventListener('readystatechange', () => {
-      if (xhr.readyState !== xhr.DONE) {
-        return
-      }
-
-
-      // @ts-ignore
-      const responseHeaders: Record<string, string> = {}
-      const rawHeaders = xhr.getAllResponseHeaders()
-      const headers = rawHeaders.trim().split(/[\r\n]+/)
-      headers.forEach((line) => {
-        const parts = line.split(': ')
-        const header = parts.shift()
-        const value = parts.join(': ')
-        if (header) {
-          responseHeaders[header] = value
-        }
-      })
-      if (recordResponseHeaders) {
-        networkRequest.responseHeaders = responseHeaders
-      }
-      if (shouldRecordBody) {
-        const responseBody = _tryReadXHRBody({ body: xhr.response, url })
-
-        if (
-          responseBody?.length
-          && responseBody.length <= maxCapturingHttpPayloadSize
-        ) {
-          networkRequest.responseBody = responseBody
-        }
-      }
-    })
-
-
-    // @ts-ignore
-    xhr.networkRequest = networkRequest
-
-    originalOpen.call(xhr, method, url as string, async, username, password)
-  }
-})(XMLHttpRequest.prototype)