noibu-react-native 0.0.1 → 0.0.3

package/dist/utils/function.js

@@ -1,9 +1,20 @@
-import * as stackTraceParser from 'stacktrace-parser';
 import DeviceInfo from 'react-native-device-info';
-import { MAX_STRING_LENGTH, MAX_BEACON_PAYLOAD_SIZE, REQUIRED_DATA_PROCESSING_URLS, HTTP_DATA_COLLECTION_FLAG_NAME, HTTP_DATA_PAYLOAD_URL_REGEXES_FLAG_NAME, WIN_BLOCKED_SELECTOR_ATT_NAME, PII_EMAIL_PATTERN, PII_REDACTION_REPLACEMENT_STRING, PII_DIGIT_PATTERN, NOIBUJS_CONFIG, JS_STACK_FRAMES_ATT_NAME, JS_STACK_MESSAGE_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_LINE_ATT_NAME, JS_STACK_COL_ATT_NAME, MAX_FRAMES_IN_ARRAY, JS_STACK_METHOD_ATT_NAME, DEFAULT_STACK_FRAME_FIELD_VALUE } from '../constants.js';
+import { getLocales } from 'react-native-localize';
+import { parseStack } from './stacktrace-parser.js';
+import { MAX_BEACON_PAYLOAD_SIZE, MAX_STRING_LENGTH, REQUIRED_DATA_PROCESSING_URLS, HTTP_DATA_COLLECTION_FLAG_NAME, HTTP_DATA_PAYLOAD_URL_REGEXES_FLAG_NAME, WIN_BLOCKED_SELECTOR_ATT_NAME, PII_EMAIL_PATTERN, PII_REDACTION_REPLACEMENT_STRING, PII_DIGIT_PATTERN, JS_STACK_FRAMES_ATT_NAME, JS_STACK_MESSAGE_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_LINE_ATT_NAME, JS_STACK_COL_ATT_NAME, MAX_FRAMES_IN_ARRAY, NOIBUJS_CONFIG, JS_STACK_METHOD_ATT_NAME, DEFAULT_STACK_FRAME_FIELD_VALUE } from '../constants.js';
+import ClientConfig from '../api/clientConfig.js';
 
 /** @module Functions */
 
+/**
+ * Returns a stack trace frame with default filed values
+ */
+const getDefaultFrame = () => ({
+  [JS_STACK_LINE_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
+  [JS_STACK_METHOD_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
+  [JS_STACK_FILE_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
+});
+
 /**
  *
  * returns a string that satisfies a max length
@@ -25,61 +36,54 @@ function getMaxSubstringAllowed(
 
 /**
  *
+ * todo implement navigation
  * getProperGlobalUrl gets the proper global url from the window
+ * @returns {string}
  */
 function getProperGlobalUrl() {
-  let globalUrl =
-    (window.location && window.location.href) || 'http://localhost';
-  // first we try to get the location
-  // if it does not follow the http protocol,
-  // then we check the parent frame and if that
-  // fails then we return what we have without
-  // trying anything else
-  if (
-    (
-      (window.location && window.location.href) ||
-      'http://localhost'
-    ).startsWith('http')
-  ) {
-    globalUrl = (window.location && window.location.href) || 'http://localhost';
-  } else if (
-    window.parent &&
-    window.parent.location &&
-    window.parent.location.href.startsWith('http')
-  ) {
-    globalUrl = window.parent.location.href;
-  }
-
-  return getMaxSubstringAllowed(globalUrl);
+  const globalUrl = new URL('https://localhost');
+  globalUrl.hostname = ClientConfig.getInstance().customerDomain;
+  return getMaxSubstringAllowed(globalUrl.toString());
 }
 
 /**
  * Processes the raw stack frames and creates a readable stack in a safe manner
- * @param rawFrames
+ * @param {StackFrame[]} rawFrames
  */
 function processFrames(rawFrames) {
   return rawFrames.map(frame => {
-    const processedFrame = {
-      [JS_STACK_LINE_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
-      [JS_STACK_METHOD_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
-      [JS_STACK_FILE_ATT_NAME]: DEFAULT_STACK_FRAME_FIELD_VALUE,
-    };
+    const processedFrame = getDefaultFrame();
 
-    // stringification
-    if (frame.lineNumber && frame.lineNumber !== '<unknown>') {
-      processedFrame[JS_STACK_LINE_ATT_NAME] = String(frame.lineNumber);
+    if (frame[JS_STACK_LINE_ATT_NAME]) {
+      if (Number.isInteger(frame[JS_STACK_LINE_ATT_NAME])) {
+        processedFrame[JS_STACK_LINE_ATT_NAME] = String(
+          frame[JS_STACK_LINE_ATT_NAME],
+        );
+      }
     }
 
-    if (frame.methodName && frame.methodName !== '<unknown>') {
-      processedFrame[JS_STACK_METHOD_ATT_NAME] = String(frame.methodName);
+    if (
+      frame[JS_STACK_METHOD_ATT_NAME] &&
+      frame[JS_STACK_METHOD_ATT_NAME] !== '<unknown>'
+    ) {
+      processedFrame[JS_STACK_METHOD_ATT_NAME] = String(
+        frame[JS_STACK_METHOD_ATT_NAME],
+      );
     }
 
-    if (frame.file && frame.file !== '<unknown>') {
-      processedFrame[JS_STACK_FILE_ATT_NAME] = String(frame.file);
+    if (
+      frame[JS_STACK_FILE_ATT_NAME] &&
+      frame[JS_STACK_FILE_ATT_NAME] !== '<unknown>'
+    ) {
+      processedFrame[JS_STACK_FILE_ATT_NAME] = String(
+        frame[JS_STACK_FILE_ATT_NAME],
+      );
     }
 
-    if (frame.column && typeof frame.column === 'number') {
-      processedFrame[JS_STACK_COL_ATT_NAME] = frame.column;
+    if (frame[JS_STACK_COL_ATT_NAME]) {
+      if (Number.isInteger(frame[JS_STACK_COL_ATT_NAME])) {
+        processedFrame[JS_STACK_COL_ATT_NAME] = frame[JS_STACK_COL_ATT_NAME];
+      }
     }
 
     return processedFrame;
@@ -120,7 +124,7 @@ function getJSStack(errObj) {
       frames[0][JS_STACK_COL_ATT_NAME] = errObj.columnNumber;
     }
   } else {
-    frames = processFrames(stackTraceParser.parse(errObj.stack));
+    frames = processFrames(parseStack(errObj.stack));
   }
 
   if (frames.length >= MAX_FRAMES_IN_ARRAY) {
@@ -134,6 +138,18 @@ function getJSStack(errObj) {
   };
 }
 
+/**
+ * @param {string} possiblyStacktrace
+ * @returns {boolean}
+ */
+function isStackTrace(possiblyStacktrace) {
+  try {
+    return parseStack(possiblyStacktrace).length > 0;
+  } catch (e) {
+    return false;
+  }
+}
+
 /**
  * safely stringifies an object
  * @param jsonObject
@@ -166,7 +182,7 @@ function stringifyJSON(jsonObject) {
  * @param timeout
  * @param sendAndForget
  */
-function makeRequest(
+async function makeRequest(
   method,
   url,
   data,
@@ -174,12 +190,20 @@ function makeRequest(
   timeout,
   sendAndForget,
 ) {
-  // a send and forget request is made by using the beacon API (fetch + keepalive)
+  const ua = Object.keys(headers).findLast(
+    k => k.toLowerCase() === 'user-agent',
+  );
+  const headersWithUa = { ...headers };
+  if (!headers[ua]) {
+    headersWithUa['User-Agent'] = await getUserAgent();
+  }
+
+  // a send-and-forget request is made by using the beacon API (fetch + keepalive)
   if (sendAndForget) {
     const stringData = stringifyJSON(data);
     const currentPayloadSize = new Blob([stringData]).size;
     // if we have a large object or fetch is not available, we skip sending the message
-    if (!window.fetch || currentPayloadSize > MAX_BEACON_PAYLOAD_SIZE) {
+    if (!global.fetch || currentPayloadSize > MAX_BEACON_PAYLOAD_SIZE) {
       return new Promise(resolve => {
         resolve();
       });
@@ -187,7 +211,7 @@ function makeRequest(
 
     return fetch(url, {
       method: 'POST',
-      headers,
+      headers: headersWithUa,
       body: stringifyJSON(data),
       // keep alive outlives the current page, its the same as beacon
       keepalive: true,
@@ -195,10 +219,10 @@ function makeRequest(
   }
 
   return new Promise((resolve, reject) => {
-    const xhr = new XMLHttpRequest();
+    const xhr = new global.XMLHttpRequest();
     xhr.open(method, url);
     xhr.timeout = timeout;
-    Object.keys(headers).forEach(header => {
+    Object.keys(headersWithUa).forEach(header => {
       xhr.setRequestHeader(header, headers[header]);
     });
 
@@ -302,7 +326,7 @@ async function getUserAgent() {
 /**
  * isInvalidURLConfig will verify that Collect is being initializes with
  * the correct env vars.
- * @param  {} urlConfig
+ * @param  {Noibu.UrlConfig} urlConfig
  */
 function isInvalidURLConfig(urlConfig) {
   for (let i = 0; i < REQUIRED_DATA_PROCESSING_URLS.length; i += 1) {
@@ -359,9 +383,8 @@ function maskTextInput(text) {
  * @param  {} realOnURL
  */
 function getOnURL(realOnURL) {
-  let onURL = getMaxSubstringAllowed(
-    (window.location && window.location.href) || 'http://localhost',
-  );
+  let onURL = getProperGlobalUrl();
+
   if (realOnURL && realOnURL.trim() !== '' && realOnURL !== 'undefined') {
     onURL = asString(getMaxSubstringAllowed(realOnURL));
   }
@@ -371,7 +394,11 @@ function getOnURL(realOnURL) {
 
 /** gets the user language from the browser */
 function getUserLanguage() {
-  const lang = window.navigator.userLanguage || window.navigator.language;
+  const locales = getLocales();
+  if (!locales.length) {
+    return null;
+  }
+  const lang = locales[0].languageCode;
 
   if (lang === '' || !lang) {
     return null;
@@ -395,4 +422,4 @@ function isInstanceOf(instance, type) {
   }
 }
 
-export { asString, checkHttpDataCollectionEnabled, getBlockedCSSForCurrentDomain, getHttpPayloadAllowedURLs, getJSStack, getMaxSubstringAllowed, getOnURL, getProperGlobalUrl, getUserAgent, getUserLanguage, isInstanceOf, isInvalidURLConfig, isNoibuJSAlreadyLoaded, isValidURL, makeRequest, maskTextInput, processFrames, stringifyJSON };
+export { asString, checkHttpDataCollectionEnabled, getBlockedCSSForCurrentDomain, getHttpPayloadAllowedURLs, getJSStack, getMaxSubstringAllowed, getOnURL, getProperGlobalUrl, getUserAgent, getUserLanguage, isInstanceOf, isInvalidURLConfig, isNoibuJSAlreadyLoaded, isStackTrace, isValidURL, makeRequest, maskTextInput, processFrames, stringifyJSON };

package/dist/utils/performance.js

@@ -8,13 +8,6 @@ import { timestampWrapper } from './date.js';
  * we return Date.now() instead.
  */
 function safePerformanceNow() {
-  if (window.performance && window.performance.now) {
-    // There is a 70% hit with using this
-    // https://jsperf.com/perf-vs-date/1
-    // performance.now is for relative time measurement
-    // cannot be used instead of Date.getTime() on it's own
-    return window.performance.now();
-  }
   return timestampWrapper(Date.now());
 }
 

package/dist/utils/stacktrace-parser.d.ts

@@ -0,0 +1,9 @@
+import { JS_STACK_COL_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_LINE_ATT_NAME, JS_STACK_METHOD_ATT_NAME } from '../constants';
+declare interface StackFrame {
+    [JS_STACK_FILE_ATT_NAME]: string;
+    [JS_STACK_LINE_ATT_NAME]?: number;
+    [JS_STACK_COL_ATT_NAME]?: number;
+    [JS_STACK_METHOD_ATT_NAME]: string;
+}
+export declare function parseStack(stackString: string): StackFrame[];
+export {};

package/dist/utils/stacktrace-parser.js

@@ -0,0 +1,156 @@
+import { MAX_FRAMES_IN_ARRAY, MAX_STRING_LENGTH, JS_STACK_LINE_ATT_NAME, JS_STACK_COL_ATT_NAME, JS_STACK_FILE_ATT_NAME, JS_STACK_METHOD_ATT_NAME } from '../constants.js';
+
+/* eslint-disable require-jsdoc,prefer-destructuring,camelcase */
+// This is a loose copy of ravenjs code
+// Copyright (c) 2013 Onur Can Cakmak onur.cakmak@gmail.com and all TraceKit contributors.
+//
+// Permission is hereby granted, free of charge, to any person obtaining a copy of this
+// software and associated documentation files(the 'Software'), to deal in the Software
+// without restriction, including without limitation the rights to use, copy, modify,
+// merge, publish, distribute, sublicense, and / or sell copies of the Software, and to
+// permit persons to whom the Software is furnished to do so, subject to the following
+// conditions:
+//
+// The above copyright notice and this permission notice shall be included in all copies
+// or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
+// INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
+// PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+// HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+// CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE
+// OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+// global reference to slice
+const UNKNOWN_FUNCTION = '<unknown>';
+/**
+ * Safari web extensions, starting version unknown, can produce "frames-only" stacktraces.
+ * What it means, is that instead of format like:
+ *
+ * Error: wat
+ *   at function@url:row:col
+ *   at function@url:row:col
+ *   at function@url:row:col
+ *
+ * it produces something like:
+ *
+ *   function@url:row:col
+ *   function@url:row:col
+ *   function@url:row:col
+ *
+ * Because of that, it won't be captured by `chrome` RegExp and will fall into `Gecko` branch.
+ * This function is extracted so that we can use it in both places without duplicating the logic.
+ * Unfortunately "just" changing RegExp is too complicated now and making it pass all tests
+ * and fix this case seems like an impossible, or at least way too time-consuming task.
+ */
+const extractSafariExtensionDetails = (func, filename) => {
+    const isSafariExtension = func.indexOf('safari-extension') !== -1;
+    const isSafariWebExtension = func.indexOf('safari-web-extension') !== -1;
+    return isSafariExtension || isSafariWebExtension
+        ? [
+            func.indexOf('@') !== -1 ? func.split('@')[0] : UNKNOWN_FUNCTION,
+            isSafariExtension
+                ? `safari-extension:${filename}`
+                : `safari-web-extension:${filename}`,
+        ]
+        : [func, filename];
+};
+function createFrame(filename, func, lineno, colno) {
+    const frame = {
+        [JS_STACK_FILE_ATT_NAME]: filename,
+        [JS_STACK_METHOD_ATT_NAME]: func,
+    };
+    if (lineno !== undefined) {
+        frame[JS_STACK_LINE_ATT_NAME] = lineno;
+    }
+    if (colno !== undefined) {
+        frame[JS_STACK_COL_ATT_NAME] = colno;
+    }
+    return frame;
+}
+// Chromium based browsers: Chrome, Brave, new Opera, new Edge
+const chromeRegex = /^\s*at (?:(.+?\)(?: \[.+\])?|.*?) ?\((?:address at )?)?(?:async )?((?:<anonymous>|[-a-z]+:|.*bundle|\/)?.*?)(?::(\d+))?(?::(\d+))?\)?\s*$/i;
+const chromeEvalRegex = /\((\S*)(?::(\d+))(?::(\d+))\)/;
+const chrome = (line) => {
+    const parts = chromeRegex.exec(line);
+    if (parts) {
+        const isEval = parts[2] && parts[2].indexOf('eval') === 0; // start of line
+        if (isEval) {
+            const subMatch = chromeEvalRegex.exec(parts[2]);
+            if (subMatch) {
+                // throw out eval line/column and use top-most line/column number
+                parts[2] = subMatch[1]; // url
+                parts[3] = subMatch[2]; // line
+                parts[4] = subMatch[3]; // column
+            }
+        }
+        const [func, filename] = extractSafariExtensionDetails(parts[1] || UNKNOWN_FUNCTION, parts[2]);
+        return createFrame(filename, func, parts[3] ? +parts[3] : undefined, parts[4] ? +parts[4] : undefined);
+    }
+    return undefined;
+};
+const geckoREgex = /^\s*(.*?)(?:\((.*?)\))?(?:^|@)?((?:[-a-z]+)?:\/.*?|\[native code\]|[^@]*(?:bundle|\d+\.js)|\/[\w\-. /=]+)(?::(\d+))?(?::(\d+))?\s*$/i;
+const geckoEvalRegex = /(\S+) line (\d+)(?: > eval line \d+)* > eval/i;
+const gecko = (line) => {
+    const parts = geckoREgex.exec(line);
+    if (parts) {
+        const isEval = parts[3] && parts[3].indexOf(' > eval') > -1;
+        if (isEval) {
+            const subMatch = geckoEvalRegex.exec(parts[3]);
+            if (subMatch) {
+                // throw out eval line/column and use top-most line number
+                parts[1] = parts[1] || 'eval';
+                parts[3] = subMatch[1];
+                parts[4] = subMatch[2];
+                parts[5] = ''; // no column when eval
+            }
+        }
+        let filename = parts[3];
+        let func = parts[1] || UNKNOWN_FUNCTION;
+        [func, filename] = extractSafariExtensionDetails(func, filename);
+        return createFrame(filename, func, parts[4] ? +parts[4] : undefined, parts[5] ? +parts[5] : undefined);
+    }
+    return undefined;
+};
+const winjsRegex = /^\s*at (?:((?:\[object object\])?.+) )?\(?((?:[-a-z]+):.*?):(\d+)(?::(\d+))?\)?\s*$/i;
+const winjs = (line) => {
+    const parts = winjsRegex.exec(line);
+    return parts
+        ? createFrame(parts[2], parts[1] || UNKNOWN_FUNCTION, +parts[3], parts[4] ? +parts[4] : undefined)
+        : undefined;
+};
+const opera10Regex = / line (\d+).*script (?:in )?(\S+)(?:: in function (\S+))?$/i;
+const opera10 = (line) => {
+    const parts = opera10Regex.exec(line);
+    return parts
+        ? createFrame(parts[2], parts[3] || UNKNOWN_FUNCTION, +parts[1])
+        : undefined;
+};
+const opera11Regex = / line (\d+), column (\d+)\s*(?:in (?:<anonymous function: ([^>]+)>|([^)]+))\(.*\))? in (.*):\s*$/i;
+const opera11 = (line) => {
+    const parts = opera11Regex.exec(line);
+    return parts
+        ? createFrame(parts[5], parts[3] || parts[4] || UNKNOWN_FUNCTION, +parts[1], +parts[2])
+        : undefined;
+};
+function parseStack(stackString) {
+    const lines = stackString.split('\n');
+    if (lines.length > MAX_FRAMES_IN_ARRAY) {
+        return [];
+    }
+    return lines.reduce((stack, line) => {
+        if (line.length > MAX_STRING_LENGTH) {
+            return stack;
+        }
+        const parseResult = gecko(line) ||
+            chrome(line) ||
+            winjs(line) ||
+            opera11(line) ||
+            opera10(line);
+        if (parseResult) {
+            stack.push(parseResult);
+        }
+        return stack;
+    }, []);
+}
+
+export { parseStack };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "noibu-react-native",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "React-Native SDK for NoibuJS to collect errors in React-Native applications",
   "main": "dist/entry/index.js",
   "types": "dist/entry/index.d.ts",
@@ -10,7 +10,6 @@
   ],
   "author": "Noibu Inc",
   "license": "ISC",
-
   "scripts": {
     "clean": "rimraf ./dist/*",
     "build": "node ./build.js",
@@ -21,13 +20,14 @@
     "lint_output": "eslint src -c .eslintrc.json --ext js,ts,jsx,tsx -f json > eslint_report.json",
     "codecov": "codecov"
   },
-  "peerDependencies": {
+  "dependencies": {
     "react": ">=16.11.0",
     "react-native": ">=0.63.0",
+    "@react-native-async-storage/async-storage": "^1.19.0",
     "react-native-device-info": "^10.6.0",
     "react-native-url-polyfill": "^1.3.0",
     "react-native-uuid": "^2.0.1",
-    "stacktrace-parser": "^0.1.10"
+    "react-native-localize": "^3.0.1"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^25.0.0",

package/dist/storage/localStorageProvider.js

@@ -1,23 +0,0 @@
-import StorageProvider from './storageProvider.js';
-
-/**
- * Local storage provider implementation
- */
-class LocalStorageProvider extends StorageProvider {
-  /**
-   * Creates new instance
-   */
-  constructor() {
-    super(window.localStorage);
-  }
-
-  /**
-   * Checks if storage is available
-   * @returns {Object}
-   */
-  static isAvailable() {
-    return StorageProvider.isAvailable(() => window.localStorage);
-  }
-}
-
-export { LocalStorageProvider as default };

package/dist/storage/sessionStorageProvider.js

@@ -1,23 +0,0 @@
-import StorageProvider from './storageProvider.js';
-
-/**
- * Session storage provider implementation
- */
-class SessionStorageProvider extends StorageProvider {
-  /**
-   * Creates new instance
-   */
-  constructor() {
-    super(window.sessionStorage);
-  }
-
-  /**
-   * Checks if storage is available
-   * @returns {Object}
-   */
-  static isAvailable() {
-    return StorageProvider.isAvailable(() => window.sessionStorage);
-  }
-}
-
-export { SessionStorageProvider as default };