noibu-react-native 0.2.1 → 0.2.3

package/dist/pageVisit/eventDebouncer.js

@@ -0,0 +1,110 @@
+import { PageVisit } from './pageVisit.js';
+import { LOCATION_EVENT_TYPE, TITLE_EVENT_TYPE, PAGE_TYPE_EVENT_TYPE, PAGE_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS, ERROR_EVENT_TYPE, HTTP_EVENT_TYPE, NETWORK_STATS_EVENT_TYPE, KEYBOARD_EVENT_TYPE, USERSTEP_EVENT_TYPE, ECOMMERCE_EVENT_TYPE, SEVERITY } from '../constants.js';
+import { timestampWrapper } from '../utils/date.js';
+import { addSafeEventListener } from '../utils/eventlistener.js';
+import ClientConfig from '../api/clientConfig.js';
+
+/** @module EventDebouncer */
+/**
+ * Singleton class responsible for debouncing all events
+ * that are registered
+ */
+class EventDebouncer {
+    /**
+     * Creates an instance of EventDebouncer
+     */
+    constructor() {
+        // events are stored in queues that are debounced seperatly
+        // each object in this map is
+        // type: {
+        //   timeout: timeout,
+        //   events: [...],
+        //   debouncePeriod: period at which we debounce events,
+        //   eventName: name of the event, could be different than type
+        //      (clicks and keyboards are usersteps)
+        // }
+        this.eventsToDebounce = {};
+        // setting up debouncers for all events
+        // we send clicks directly to the socket so they aren't registered here
+        // we dont wait to send location changes, they happen at most once per second.
+        this.registerInputType(LOCATION_EVENT_TYPE, 0);
+        this.registerInputType(TITLE_EVENT_TYPE, 0);
+        this.registerInputType(PAGE_TYPE_EVENT_TYPE, 0);
+        this.registerInputType(PAGE_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS);
+        this.registerInputType(ERROR_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS);
+        this.registerInputType(HTTP_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS);
+        this.registerInputType(NETWORK_STATS_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS);
+        this.registerInputType(KEYBOARD_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS, USERSTEP_EVENT_TYPE);
+        this.registerInputType(ECOMMERCE_EVENT_TYPE, MAX_TIME_FOR_UNSENT_DATA_MILLIS);
+        this._setupUnloadHandler();
+    }
+    /**
+     * gets the instance of EventDebouncer
+     */
+    static getInstance() {
+        if (!this.instance) {
+            this.instance = new EventDebouncer();
+        }
+        return this.instance;
+    }
+    /** will debounce all events that are of this type by the debounce period
+     */
+    registerInputType(type, debouncePeriod, eventName = type) {
+        if (type in this.eventsToDebounce) {
+            return;
+        }
+        // registering this event type as a debouncable
+        this.eventsToDebounce[type] = {
+            timeout: null,
+            events: [],
+            debouncePeriod,
+            eventName,
+        };
+    }
+    /**
+     * Creates an event object with the event and the time it was added then pushes
+     * that event object to the queue of events waiting to be debounced.
+     */
+    addEvent(event, type, occurredAt) {
+        if (!(type in this.eventsToDebounce)) {
+            ClientConfig.getInstance().postNoibuErrorAndOptionallyDisableClient(new Error(`Type: ${type} is not in eventsToDebounce`), false, SEVERITY.error);
+            return;
+        }
+        if (!occurredAt) {
+            occurredAt = Date.now();
+        }
+        this.eventsToDebounce[type].events.push({
+            event,
+            occurredAt: new Date(timestampWrapper(occurredAt)).toISOString(),
+        });
+        this._debouncePvEvents(type);
+    }
+    /**
+     * Adds the events from the object to the page visit and sets up a timer
+     * to send the events if no more are received without the timeout
+     */
+    _debouncePvEvents(type) {
+        /**
+         * Debounce function to be executed once the debounce period is completed
+         */
+        const later = () => {
+            this.eventsToDebounce[type].timeout = null;
+            PageVisit.getInstance().addPageVisitEvents(this.eventsToDebounce[type].events, this.eventsToDebounce[type].eventName);
+            this.eventsToDebounce[type].events = [];
+        };
+        if (this.eventsToDebounce[type].timeout !== null) {
+            clearTimeout(this.eventsToDebounce[type].timeout);
+        }
+        this.eventsToDebounce[type].timeout = setTimeout(later, this.eventsToDebounce[type].debouncePeriod);
+    }
+    /** Sets up the page hide handler to try to push remaining events in the queues */
+    _setupUnloadHandler() {
+        addSafeEventListener(window, 'pagehide', () => {
+            Object.values(this.eventsToDebounce).forEach(eventObject => {
+                PageVisit.getInstance().addPageVisitEvents(eventObject.events, eventObject.eventName);
+            });
+        });
+    }
+}
+
+export { EventDebouncer };

package/dist/pageVisit/pageVisitEventError.js

@@ -1,5 +1,5 @@
 import { isValidURL, getJSStack, stringifyJSON, getMaxSubstringAllowed, asString } from '../utils/function.js';
-import { EVENT_ERROR_TYPE, URL_ATT_NAME, BLOCKLISTED_DOMAINS, ERROR_EVENT_TYPE, ERROR_EVENT_ERROR_TYPE, CUSTOM_ERROR_EVENT_TYPE, ERROR_EVENT_UNHANDLED_REJECTION_TYPE, ERROR_LOG_EVENT_ERROR_TYPE, FETCH_EXCEPTION_ERROR_TYPE, WRAPPED_EXCEPTION_ERROR_TYPE, GQL_ERROR_TYPE, RESPONSE_ERROR_TYPE, XML_HTTP_REQUEST_ERROR_TYPE, ERROR_SOURCE_ATT_NAME, TYPE_ATT_NAME, JS_EVENT_TYPE, JS_ERROR_ATT_NAME, JS_STACK_FRAMES_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_METHOD_ATT_NAME, SEVERITY, JS_STACK_MESSAGE_ATT_NAME, HTTP_EVENT_TYPE, NOIBU_INPUT_URLS, HTTP_CODE_ATT_NAME, PV_SEQ_ATT_NAME, GQL_EVENT_TYPE, GQL_ERROR_ATT_NAME } from '../constants.js';
+import { EVENT_ERROR_TYPE, URL_ATT_NAME, BLOCKLISTED_DOMAINS, ERROR_EVENT_TYPE, ERROR_EVENT_ERROR_TYPE, CUSTOM_ERROR_EVENT_TYPE, ERROR_EVENT_UNHANDLED_REJECTION_TYPE, ERROR_LOG_EVENT_ERROR_TYPE, FETCH_EXCEPTION_ERROR_TYPE, WRAPPED_EXCEPTION_ERROR_TYPE, GQL_ERROR_TYPE, RESPONSE_ERROR_TYPE, XML_HTTP_REQUEST_ERROR_TYPE, ERROR_SOURCE_ATT_NAME, TYPE_ATT_NAME, JS_EVENT_TYPE, JS_ERROR_ATT_NAME, JS_STACK_FRAMES_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_METHOD_ATT_NAME, SEVERITY, JS_STACK_MESSAGE_ATT_NAME, HTTP_EVENT_TYPE, NOIBU_INPUT_URLS, HTTP_CODE_ATT_NAME, GQL_EVENT_TYPE, GQL_ERROR_ATT_NAME, PV_SEQ_ATT_NAME } from '../constants.js';
 import ClientConfig from '../api/clientConfig.js';
 import { InputMonitor } from '../monitors/inputMonitor.js';
 import StoredMetrics from '../api/storedMetrics.js';

package/dist/pageVisit/pageVisitEventHTTP.js

@@ -1,112 +1,97 @@
-import { getMaxSubstringAllowed, asString } from '../utils/function.js';
 import { timestampWrapper } from '../utils/date.js';
-import { InputMonitor } from '../monitors/inputMonitor.js';
-import { HTTP_METHOD_ATT_NAME, MAX_HTTP_DATA_EVENT_COUNT, PV_SEQ_ATT_NAME, HTTP_DATA_METROPLEX_TYPE, HTTP_EVENT_TYPE, PAGE_VISIT_HTTP_DATA_ATT_NAME } from '../constants.js';
+import { HTTP_RESP_CODE_ATT_NAME, HTTP_RESP_TIME_ATT_NAME, HTTP_METHOD_ATT_NAME, URL_ATT_NAME, PV_SEQ_ATT_NAME, HTTP_DATA_METROPLEX_TYPE, HTTP_EVENT_TYPE, MAX_HTTP_DATA_EVENT_COUNT, MAX_HTTP_DATA_IF_ERROR_EVENT_COUNT, PAGE_VISIT_HTTP_DATA_ATT_NAME } from '../constants.js';
 import { PageVisit } from './pageVisit.js';
 import StoredMetrics from '../api/storedMetrics.js';
 import MetroplexSocket from '../api/metroplexSocket.js';
-import { noibuLog } from '../utils/log.js';
+import { getMaxSubstringAllowed, asString, safeTrim } from '../utils/function.js';
+import { EventDebouncer } from './eventDebouncer.js';
 
 /** @module PageVisitEventHTTP */
-
 /**
  * Determines if a response is a failure
- * @param  {number} code
  */
 function isHttpCodeFailure(code) {
-  if (typeof code !== 'number') {
-    return true;
-  }
-
-  return code >= 400 || code <= 0;
+    if (typeof code !== 'number') {
+        return true;
+    }
+    return code >= 400 || code <= 0;
 }
-
 /** Class representing a PageVisitEventHTTP */
 class PageVisitEventHTTP {
-  /**
-   * Creates an instance of the http event for the pv
-   * @param  {} httpEvent
-   * @param  {} httpData
-   */
-  constructor(httpEvent, httpData) {
-    const mutatedHttpEvent = httpEvent;
-    // TODO: implement attribute checking in this function
-    // we force the response time to at least be 0 if it is negative or if its not present
-    if (!mutatedHttpEvent.resp_time || mutatedHttpEvent.resp_time < 0) {
-      mutatedHttpEvent.resp_time = 0;
-    }
-
-    // setting the method to be upper case
-    mutatedHttpEvent[HTTP_METHOD_ATT_NAME] =
-      httpEvent[HTTP_METHOD_ATT_NAME].toUpperCase();
-
-    mutatedHttpEvent.url = getMaxSubstringAllowed(
-      asString(mutatedHttpEvent.url),
-    );
-
-    this.httpEvent = mutatedHttpEvent;
-    this.httpData = httpData;
-  }
-
-  /** Saves the HTTP event to the pageVisit Queue */
-  saveHTTPEvent() {
-    noibuLog('saveHTTPEvent');
-    // we do not store http events that have empty urls
-    if (
-      !this.httpEvent ||
-      !this.httpEvent.url ||
-      this.httpEvent.url.trim() === ''
-    ) {
-      noibuLog('saveHTTPEvent dropped due to empty url');
-      return;
+    /**
+     * Creates an instance of the http event for the pv
+     */
+    constructor(httpEvent, httpData, isGqlError = false) {
+        /** if no value or it's less than 0, fallback to 0 */
+        const validate = (value) => (!value || value < 0 ? 0 : value);
+        this.httpEvent = {
+            [HTTP_RESP_CODE_ATT_NAME]: validate(httpEvent[HTTP_RESP_CODE_ATT_NAME]),
+            [HTTP_RESP_TIME_ATT_NAME]: validate(httpEvent[HTTP_RESP_TIME_ATT_NAME]),
+            [HTTP_METHOD_ATT_NAME]: (httpEvent[HTTP_METHOD_ATT_NAME] || 'get').toUpperCase(),
+            [URL_ATT_NAME]: getMaxSubstringAllowed(asString(httpEvent[URL_ATT_NAME])),
+        };
+        this.httpData = httpData;
+        this.isGqlError = isGqlError;
     }
-    // we register an http event
-    StoredMetrics.getInstance().addHttpEvent();
-
-    // send http data down to metroplex
-    if (this.httpData) {
-      noibuLog('saveHTTPEvent got httpData, working');
-      // add the sequence number to both events
-      const sequenceNumber = StoredMetrics.getInstance().httpSequenceNumber;
-      // restrict total number of events collected per page visit to ensure we don't
-      // blow up memory and storage usage
-      if (sequenceNumber < MAX_HTTP_DATA_EVENT_COUNT) {
-        this.httpData[PV_SEQ_ATT_NAME] = sequenceNumber;
-        this.httpEvent[PV_SEQ_ATT_NAME] = sequenceNumber;
-        // increment the count
-        StoredMetrics.getInstance().addHttpData();
-
-        const metroplexMsg = {};
-        metroplexMsg[PAGE_VISIT_HTTP_DATA_ATT_NAME] = this.httpData;
-        MetroplexSocket.getInstance().sendMessage(
-          HTTP_DATA_METROPLEX_TYPE,
-          metroplexMsg,
-        );
-      } else {
-        noibuLog(
-          'saveHTTPEvent have collected more than the max number of http requests for this page visit, so increment the over request limit count',
-        );
-        // have collected more than the max number of http requests for this
-        // page visit, so increment the over request limit count
-        StoredMetrics.getInstance().addHttpDataOverLimit();
-      }
+    /** Saves the HTTP event to the pageVisit Queue */
+    saveHTTPEvent() {
+        // we do not store http events that have empty urls
+        if (!this.httpEvent || !safeTrim(this.httpEvent[URL_ATT_NAME])) {
+            return;
+        }
+        // we register an http event
+        StoredMetrics.getInstance().addHttpEvent();
+        const status = this.httpEvent[HTTP_RESP_CODE_ATT_NAME];
+        // send http data down to metroplex
+        if (this.httpData) {
+            // add the sequence number to both events
+            const sequenceNumber = StoredMetrics.getInstance().httpSequenceNumber;
+            const isSendAllowed = PageVisitEventHTTP.isSendAllowed(status, sequenceNumber, this.isGqlError);
+            // restrict total number of events collected per page visit to ensure we don't
+            // blow up memory and storage usage
+            if (isSendAllowed) {
+                this.httpData[PV_SEQ_ATT_NAME] = sequenceNumber;
+                this.httpEvent[PV_SEQ_ATT_NAME] = sequenceNumber;
+                // increment the count
+                StoredMetrics.getInstance().addHttpData();
+                const metroplexMsg = {};
+                metroplexMsg[PAGE_VISIT_HTTP_DATA_ATT_NAME] = this.httpData;
+                MetroplexSocket.getInstance().sendMessage(HTTP_DATA_METROPLEX_TYPE, metroplexMsg);
+            }
+            else {
+                // have collected more than the max number of http requests for this
+                // page visit, so increment the over request limit count
+                StoredMetrics.getInstance().addHttpDataOverLimit();
+            }
+        }
+        // if this was an error, send immediately so we don't lose it
+        if (isHttpCodeFailure(status)) {
+            PageVisit.getInstance().addPageVisitEvent({
+                event: this.httpEvent,
+                occurredAt: new Date(timestampWrapper(Date.now())).toISOString(),
+            }, HTTP_EVENT_TYPE);
+            return;
+        }
+        // debounce event
+        EventDebouncer.getInstance().addEvent(this.httpEvent, HTTP_EVENT_TYPE);
     }
-    // if this was an error, send immediately so we don't lose it
-    if (isHttpCodeFailure(this.httpEvent.code)) {
-      noibuLog('saveHTTPEvent is an error, sending immediately');
-      PageVisit.getInstance().addPageVisitEvent(
-        {
-          event: this.httpEvent,
-          occurredAt: new Date(timestampWrapper(Date.now())).toISOString(),
-        },
-        HTTP_EVENT_TYPE,
-      );
-      return;
+    /**
+     * Checks if sending data is allowed based on the HTTP status code and count.
+     * status - The HTTP status code to evaluate.
+     * count - The count of events to consider.
+     * isGqlError - Whether the context is considered as a GQL error.
+     * Returns `true` if sending data is allowed, `false` otherwise.
+     */
+    static isSendAllowed(status, count, isGqlError = false) {
+        const isFailure = isHttpCodeFailure(status) || isGqlError;
+        const isSuccess = !isFailure;
+        if (isSuccess) {
+            if (count < MAX_HTTP_DATA_EVENT_COUNT) {
+                return true;
+            }
+        }
+        return isFailure && count < MAX_HTTP_DATA_IF_ERROR_EVENT_COUNT;
     }
-
-    // debounce event
-    InputMonitor.getInstance().addEvent(this.httpEvent, HTTP_EVENT_TYPE);
-  }
 }
 
 export { PageVisitEventHTTP, isHttpCodeFailure };

package/dist/react/ErrorBoundary.js

@@ -13,7 +13,24 @@ const INITIAL_STATE = {
  * @extends {Component<ErrorBoundaryProps, ErrorBoundaryState>}
  */
 class ErrorBoundary extends React.Component {
-    state = INITIAL_STATE;
+    constructor() {
+        super(...arguments);
+        this.state = INITIAL_STATE;
+        /**
+         * Callback from fallback to reset the error boundary
+         * @param  {} =>void=(
+         */
+        this.resetErrorBoundary = () => {
+            const { onReset } = this.props;
+            const { error, componentStack, eventId } = this.state;
+            if (onReset) {
+                if (typeof componentStack === 'string') {
+                    onReset(error, componentStack, eventId);
+                }
+            }
+            this.setState(INITIAL_STATE);
+        };
+    }
     /**
      * Lifecycle hook on mount
      * @returns void
@@ -57,20 +74,6 @@ class ErrorBoundary extends React.Component {
             }
         }
     }
-    /**
-     * Callback from fallback to reset the error boundary
-     * @param  {} =>void=(
-     */
-    resetErrorBoundary = () => {
-        const { onReset } = this.props;
-        const { error, componentStack, eventId } = this.state;
-        if (onReset) {
-            if (typeof componentStack === 'string') {
-                onReset(error, componentStack, eventId);
-            }
-        }
-        this.setState(INITIAL_STATE);
-    };
     /**
      *
      * Renders the fallback ui

package/dist/sessionRecorder/nativeSessionRecorderSubscription.js

@@ -32,7 +32,7 @@ function initialize(projectId, config) {
     }
     nativeModuleEmitter = new NativeEventEmitter(NativeSessionRecorder);
     // applying default values
-    const { userId = null, logLevel = LogLevel.None, allowMeteredNetworkUsage = false, enableWebViewCapture = true, allowedDomains = ['*'], disableOnLowEndDevices = false, maximumDailyNetworkUsageInMB = null, } = config ?? {};
+    const { userId = null, logLevel = LogLevel.None, allowMeteredNetworkUsage = false, enableWebViewCapture = true, allowedDomains = ['*'], disableOnLowEndDevices = false, maximumDailyNetworkUsageInMB = null, } = config !== null && config !== void 0 ? config : {};
     if (!SupportedPlatforms.includes(Platform.OS)) {
         noibuLog(`Noibu - Session recording supports ${SupportedPlatforms.join(', ')} only for now.`);
         return;
@@ -43,13 +43,14 @@ function initialize(projectId, config) {
     }
     // We use two parameters because the react method parameters do not accept nullable primitive types.
     const enableDailyNetworkUsageLimit = maximumDailyNetworkUsageInMB != null;
-    const refinedMaximumDailyNetworkUsageInMB = maximumDailyNetworkUsageInMB ?? 0;
+    const refinedMaximumDailyNetworkUsageInMB = maximumDailyNetworkUsageInMB !== null && maximumDailyNetworkUsageInMB !== void 0 ? maximumDailyNetworkUsageInMB : 0;
     NativeSessionRecorder.initialize(projectId, userId, logLevel, allowMeteredNetworkUsage, enableWebViewCapture, allowedDomains, disableOnLowEndDevices, enableDailyNetworkUsageLimit, refinedMaximumDailyNetworkUsageInMB);
 }
 function subscribeToNativeEvent(callback) {
     if (!nativeModuleEmitter) {
         throw new Error('You have to initialize Noibu Session Recorder first');
     }
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     nativeModuleEmitter.addListener('noibuRecordingEvent', callback);
     // return () => subscription.remove();
     return () => { };