@cloudcare/browser-core 3.1.18 → 3.1.22

package/src/browser/xhrObservable.js

@@ -1,18 +1,10 @@
-import { instrumentMethodAndCallOriginal } from '../helper/instrumentMethod'
+import { instrumentMethod } from '../helper/instrumentMethod'
 import { Observable } from '../helper/observable'
 import { normalizeUrl } from '../helper/urlPolyfill'
-import {
-  shallowClone,
-  elapsed,
-  relativeNow,
-  clocksNow,
-  timeStampNow,
-  UUID
-} from '../helper/tools'
+import { shallowClone, elapsed, clocksNow, timeStampNow } from '../helper/tools'
 import { addEventListener } from '../browser/addEventListener'
 var xhrObservable
-var xhrContexts = {}
-var DATA_FLUX_REQUEST_ID_KEY = '_DATAFLUX_REQUEST_UUID'
+var xhrContexts = new WeakMap()
 export function initXhrObservable() {
   if (!xhrObservable) {
     xhrObservable = createXhrObservable()
@@ -22,30 +14,25 @@ export function initXhrObservable() {
 
 function createXhrObservable() {
   return new Observable(function (observable) {
-    var openInstrumentMethod = instrumentMethodAndCallOriginal(
+    var openInstrumentMethod = instrumentMethod(
       XMLHttpRequest.prototype,
       'open',
-      {
-        before: openXhr
-      }
+      openXhr
     )
 
-    var sendInstrumentMethod = instrumentMethodAndCallOriginal(
+    var sendInstrumentMethod = instrumentMethod(
       XMLHttpRequest.prototype,
       'send',
-      {
-        before: function () {
-          sendXhr.call(this, observable)
-        }
-      }
+      function (call) {
+        sendXhr(call, observable)
+      },
+      { computeHandlingStack: true }
     )
 
-    var abortInstrumentMethod = instrumentMethodAndCallOriginal(
+    var abortInstrumentMethod = instrumentMethod(
       XMLHttpRequest.prototype,
       'abort',
-      {
-        before: abortXhr
-      }
+      abortXhr
     )
 
     return function () {
@@ -56,40 +43,41 @@ function createXhrObservable() {
   })
 }
 
-function openXhr(method, url) {
-  var requestUUID = this[DATA_FLUX_REQUEST_ID_KEY] || UUID()
-  this[DATA_FLUX_REQUEST_ID_KEY] = requestUUID
-  xhrContexts[requestUUID] = {
+function openXhr(params) {
+  var xhr = params.target
+  var method = params.parameters[0]
+  var url = params.parameters[1]
+  xhrContexts.set(xhr, {
     state: 'open',
     method: String(method).toUpperCase(),
     url: normalizeUrl(String(url))
-  }
+  })
 }
 
-function sendXhr(observable) {
-  var context = xhrContexts[this[DATA_FLUX_REQUEST_ID_KEY]]
+function sendXhr(params, observable) {
+  var xhr = params.target
+  var handlingStack = params.handlingStack
+  var context = xhrContexts.get(xhr)
   if (!context) {
     return
   }
   var startContext = context
   startContext.state = 'start'
-  startContext.startTime = relativeNow()
   startContext.startClocks = clocksNow()
   startContext.isAborted = false
-  startContext.xhr = this
+  startContext.xhr = xhr
+  startContext.handlingStack = handlingStack
   var hasBeenReported = false
-  var stopInstrumentingOnReadyStateChange = instrumentMethodAndCallOriginal(
-    this,
+  var stopInstrumentingOnReadyStateChange = instrumentMethod(
+    xhr,
     'onreadystatechange',
-    {
-      before: function () {
-        if (this.readyState === XMLHttpRequest.DONE) {
-          // Try to report the XHR as soon as possible, because the XHR may be mutated by the
-          // application during a future event. For example, Angular is calling .abort() on
-          // completed requests during a onreadystatechange event, so the status becomes '0'
-          // before the request is collected.
-          onEnd.call(this)
-        }
+    function () {
+      if (xhr.readyState === XMLHttpRequest.DONE) {
+        // Try to report the XHR as soon as possible, because the XHR may be mutated by the
+        // application during a future event. For example, Angular is calling .abort() on
+        // completed requests during a onreadystatechange event, so the status becomes '0'
+        // before the request is collected.
+        onEnd()
       }
     }
   ).stop
@@ -107,19 +95,16 @@ function sendXhr(observable) {
       startContext.startClocks.timeStamp,
       timeStampNow()
     )
-    completeContext.status = this.status
+    completeContext.status = xhr.status
     observable.notify(shallowClone(completeContext))
-    clearRequestId.call(this)
   }
-  var unsubscribeLoadEndListener = addEventListener(this, 'loadend', onEnd).stop
+  var unsubscribeLoadEndListener = addEventListener(xhr, 'loadend', onEnd).stop
   observable.notify(startContext)
 }
-function clearRequestId() {
-  delete xhrContexts[this[DATA_FLUX_REQUEST_ID_KEY]]
-  delete this[DATA_FLUX_REQUEST_ID_KEY]
-}
-function abortXhr() {
-  var context = xhrContexts[this[DATA_FLUX_REQUEST_ID_KEY]]
+
+function abortXhr(params) {
+  var xhr = params.target
+  var context = xhrContexts.get(xhr)
   if (context) {
     context.isAborted = true
   }

package/src/dataMap.js

@@ -67,6 +67,7 @@ export var dataMap = {
       largest_contentful_paint_element_selector:
         'view.largest_contentful_paint_element_selector',
       cumulative_layout_shift: 'view.cumulative_layout_shift',
+      cumulative_layout_shift_time: 'view.cumulative_layout_shift_time',
       cumulative_layout_shift_target_selector:
         'view.cumulative_layout_shift_target_selector',
       first_input_delay: 'view.first_input_delay',

package/src/helper/deviceInfo.js

@@ -612,7 +612,6 @@ var _deviceInfo = {}
 if (typeof window !== 'undefined') {
   _deviceInfo = {
     os: MethodLibrary.getOS(),
-    MethodLibrary,
     osVersion: MethodLibrary.getOSVersion().version,
     osVersionMajor: MethodLibrary.getOSVersion().osMajor,
     browser: MethodLibrary.getBrowserInfo().browser,
@@ -620,7 +619,7 @@ if (typeof window !== 'undefined') {
     browserVersionMajor: MethodLibrary.getBrowserInfo().browserMajor,
     screenSize: window.screen.width + '*' + window.screen.height,
     networkType: MethodLibrary.getNetwork(),
-    divice: MethodLibrary.getDeviceType()
+    device: MethodLibrary.getDeviceType()
   }
 }
 export var deviceInfo = _deviceInfo

package/src/helper/enums.js

@@ -64,7 +64,10 @@ export var RumEventType = {
   RESOURCE: 'resource',
   LOGGER: 'logger'
 }
-
+export var RumLongTaskEntryType = {
+  LONG_TASK: 'long-task',
+  LONG_ANIMATION_FRAME: 'long-animation-frame'
+}
 export var ViewLoadingType = {
   INITIAL_LOAD: 'initial_load',
   ROUTE_CHANGE: 'route_change'

package/src/helper/instrumentMethod.js

@@ -1,53 +1,70 @@
-import { noop } from './tools'
+import { noop, arrayFrom, startsWith } from './tools'
 import { setTimeout } from './timer'
 import { callMonitored } from './monitor'
-export function instrumentMethod(object, method, instrumentationFactory) {
-  var original = object[method]
+import { createHandlingStack } from './errorTools'
+export function instrumentMethod(targetPrototype, method, onPreCall, opts) {
+  var computeHandlingStack = opts && opts.computeHandlingStack
+  var original = targetPrototype[method]
 
-  var instrumentation = instrumentationFactory(original)
+  if (typeof original !== 'function') {
+    if (startsWith(method, 'on')) {
+      original = noop
+    } else {
+      return { stop: noop }
+    }
+  }
+
+  var stopped = false
 
-  var instrumentationWrapper = function () {
-    if (typeof instrumentation !== 'function') {
-      return undefined
+  var instrumentation = function () {
+    if (stopped) {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-call
+      return original.apply(this, arguments)
     }
+
+    var parameters = arrayFrom(arguments)
+
+    var postCallCallback
+
+    callMonitored(onPreCall, null, [
+      {
+        target: this,
+        parameters: parameters,
+        onPostCall: function (callback) {
+          postCallCallback = callback
+        },
+        handlingStack: computeHandlingStack ? createHandlingStack() : undefined
+      }
+    ])
+
+    var result = original.apply(this, parameters)
+
+    if (postCallCallback) {
+      callMonitored(postCallCallback, null, [result])
+    }
+
     // eslint-disable-next-line @typescript-eslint/no-unsafe-return
-    return instrumentation.apply(this, arguments)
+    return result
   }
-  object[method] = instrumentationWrapper
+
+  targetPrototype[method] = instrumentation
+
   return {
     stop: function () {
-      if (object[method] === instrumentationWrapper) {
-        object[method] = original
-      } else {
-        instrumentation = original
+      stopped = true
+      // If the instrumentation has been removed by a third party, keep the last one
+      if (targetPrototype[method] === instrumentation) {
+        targetPrototype[method] = original
       }
     }
   }
 }
 
-export function instrumentMethodAndCallOriginal(object, method, aliasOption) {
-  return instrumentMethod(object, method, function (original) {
-    return function () {
-      var result
-      if (aliasOption && aliasOption.before) {
-        callMonitored(aliasOption.before, this, arguments)
-        // aliasOption.before.apply(this, arguments)
-      }
-      if (typeof original === 'function') {
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-        result = original.apply(this, arguments)
-      }
-      if (aliasOption && aliasOption.after) {
-        callMonitored(aliasOption.after, this, arguments)
-        // aliasOption.after.apply(this, arguments)
-      }
-      return result
-    }
-  })
-}
-
-export function instrumentSetter(object, property, after) {
-  var originalDescriptor = Object.getOwnPropertyDescriptor(object, property)
+export function instrumentSetter(targetPrototype, property, after) {
+  var originalDescriptor = Object.getOwnPropertyDescriptor(
+    targetPrototype,
+    property
+  )
   if (
     !originalDescriptor ||
     !originalDescriptor.set ||
@@ -55,12 +72,13 @@ export function instrumentSetter(object, property, after) {
   ) {
     return { stop: noop }
   }
+
   var stoppedInstrumentation = noop
-  var instrumentation = function (thisObject, value) {
+  var instrumentation = function (target, value) {
     // put hooked setter into event loop to avoid of set latency
     setTimeout(function () {
       if (instrumentation !== stoppedInstrumentation) {
-        after(thisObject, value)
+        after(target, value)
       }
     }, 0)
   }
@@ -70,21 +88,20 @@ export function instrumentSetter(object, property, after) {
     instrumentation(this, value)
   }
 
-  Object.defineProperty(object, property, {
+  Object.defineProperty(targetPrototype, property, {
     set: instrumentationWrapper
   })
 
   return {
     stop: function () {
       if (
-        Object.getOwnPropertyDescriptor(object, property) &&
-        Object.getOwnPropertyDescriptor(object, property).set ===
+        Object.getOwnPropertyDescriptor(targetPrototype, property) &&
+        Object.getOwnPropertyDescriptor(targetPrototype, property).set ===
           instrumentationWrapper
       ) {
-        Object.defineProperty(object, property, originalDescriptor)
-      } else {
-        instrumentation = stoppedInstrumentation
+        Object.defineProperty(targetPrototype, property, originalDescriptor)
       }
+      instrumentation = stoppedInstrumentation
     }
   }
 }

package/src/helper/observable.js

@@ -6,10 +6,10 @@ var _Observable = function (onFirstSubscribe) {
 }
 _Observable.prototype = {
   subscribe: function (f) {
-    if (!this.observers.length && this.onFirstSubscribe) {
+    this.observers.push(f)
+    if (!this.observers.length === 1 && this.onFirstSubscribe) {
       this.onLastUnsubscribe = this.onFirstSubscribe(this) || undefined
     }
-    this.observers.push(f)
     var _this = this
     return {
       unsubscribe: function () {

package/src/helper/timer.js

@@ -13,9 +13,12 @@ export function clearTimeout(timeoutId) {
 }
 
 export function setInterval(callback, delay) {
-  return getZoneJsOriginalValue(window, 'setInterval')(monitor(callback), delay)
+  return getZoneJsOriginalValue(getGlobalObject(), 'setInterval')(
+    monitor(callback),
+    delay
+  )
 }
 
 export function clearInterval(timeoutId) {
-  getZoneJsOriginalValue(window, 'clearInterval')(timeoutId)
+  getZoneJsOriginalValue(getGlobalObject(), 'clearInterval')(timeoutId)
 }

package/src/helper/tools.js

@@ -1729,7 +1729,20 @@ export function startsWith(candidate, search) {
 export function endsWith(candidate, search) {
   return candidate.slice(-search.length) === search
 }
+export function removeDuplicates(array) {
+  var set = new Set()
+  array.forEach(function (item) {
+    set.add(item)
+  })
+  return arrayFrom(set)
+}
 
+export function removeItem(array, item) {
+  var index = array.indexOf(item)
+  if (index >= 0) {
+    array.splice(index, 1)
+  }
+}
 export function tryToClone(response) {
   try {
     return response.clone()

package/src/helper/valueHistory.js

@@ -0,0 +1,116 @@
+import { relativeNow, ONE_MINUTE, removeItem, addDuration } from './tools'
+import { setInterval, clearInterval } from './timer'
+var END_OF_TIMES = Infinity
+
+export var CLEAR_OLD_VALUES_INTERVAL = ONE_MINUTE
+
+/**
+ *
+ * @param {expireDelay,maxEntries } params
+ * @returns
+ */
+export function createValueHistory(params) {
+  var expireDelay = params.expireDelay
+  var maxEntries = params.maxEntries
+
+  var entries = []
+  var clearOldValuesInterval = setInterval(function () {
+    return clearOldValues()
+  }, CLEAR_OLD_VALUES_INTERVAL)
+
+  function clearOldValues() {
+    var oldTimeThreshold = relativeNow() - expireDelay
+    while (
+      entries.length > 0 &&
+      entries[entries.length - 1].endTime < oldTimeThreshold
+    ) {
+      entries.pop()
+    }
+  }
+
+  function add(value, startTime) {
+    var entry = {
+      value: value,
+      startTime: startTime,
+      endTime: END_OF_TIMES,
+      remove: function () {
+        removeItem(entries, entry)
+      },
+      close: function (endTime) {
+        entry.endTime = endTime
+      }
+    }
+
+    if (maxEntries && entries.length >= maxEntries) {
+      entries.pop()
+    }
+
+    entries.unshift(entry)
+
+    return entry
+  }
+
+  function find(startTime, options) {
+    if (typeof startTime === 'undefined') {
+      startTime = END_OF_TIMES
+    }
+    if (typeof options === 'undefined') {
+      options = { returnInactive: false }
+    }
+    for (var entry of entries) {
+      if (entry.startTime <= startTime) {
+        if (options.returnInactive || startTime <= entry.endTime) {
+          return entry.value
+        }
+        break
+      }
+    }
+  }
+
+  function closeActive(endTime) {
+    var latestEntry = entries[0]
+    if (latestEntry && latestEntry.endTime === END_OF_TIMES) {
+      latestEntry.close(endTime)
+    }
+  }
+
+  function findAll(startTime, duration) {
+    if (startTime === undefined) {
+      startTime = END_OF_TIMES
+    }
+    if (duration === undefined) {
+      duration = 0
+    }
+    var endTime = addDuration(startTime, duration)
+    return entries
+      .filter(function (entry) {
+        return entry.startTime <= endTime && startTime <= entry.endTime
+      })
+      .map(function (entry) {
+        return entry.value
+      })
+  }
+
+  /**
+   * Remove all entries from this collection.
+   */
+  function reset() {
+    entries = []
+  }
+
+  /**
+   * Stop internal garbage collection of past entries.
+   */
+  function stop() {
+    clearInterval(clearOldValuesInterval)
+  }
+
+  return {
+    add: add,
+    find: find,
+    closeActive: closeActive,
+    findAll: findAll,
+    reset: reset,
+    stop: stop
+  }
+}

package/src/index.js

@@ -1,5 +1,5 @@
 export * from './helper/boundedBuffer'
-export * from './helper/contextHistory'
+export * from './helper/valueHistory'
 export * from './helper/deviceInfo'
 export * from './helper/enums'
 export * from './helper/instrumentMethod'

package/src/session/sessionManagement.js

@@ -3,7 +3,7 @@ import {
   addEventListeners,
   addEventListener
 } from '../browser/addEventListener'
-import { ContextHistory } from '../helper/contextHistory'
+import { createValueHistory } from '../helper/valueHistory'
 import { startSessionStore } from './sessionStore'
 import { SESSION_TIME_OUT_DELAY } from './sessionConstants'
 import { DOM_EVENT } from '../helper/enums'
@@ -25,7 +25,9 @@ export var startSessionManager = function (
     return sessionStore.stop()
   })
 
-  var sessionContextHistory = new ContextHistory(SESSION_CONTEXT_TIMEOUT_DELAY)
+  var sessionContextHistory = createValueHistory({
+    expireDelay: SESSION_CONTEXT_TIMEOUT_DELAY
+  })
   stopCallbacks.push(function () {
     return sessionContextHistory.stop()
   })

package/src/tracekit/tracekit.js

@@ -1,4 +1,4 @@
-import { instrumentMethodAndCallOriginal } from '../helper/instrumentMethod'
+import { instrumentMethod } from '../helper/instrumentMethod'
 import { isNullUndefinedDefaultValue } from '../helper/tools'
 import { computeStackTrace } from './computeStackTrace'
 
@@ -52,27 +52,31 @@ export function startUnhandledErrorCollection(callback) {
  * Install a global onerror handler
  */
 function instrumentOnError(callback) {
-  return instrumentMethodAndCallOriginal(window, 'onerror', {
-    before: function (messageObj, url, line, column, errorObj) {
-      var stackTrace
-      if (errorObj instanceof Error) {
-        stackTrace = computeStackTrace(errorObj)
-      } else {
-        var location = {
-          url: url,
-          column: column,
-          line: line
-        }
-        var parse = tryToParseMessage(messageObj)
+  return instrumentMethod(window, 'onerror', function (params) {
+    var parameters = params.parameters
+    var messageObj = parameters[0]
+    var url = parameters[1]
+    var line = parameters[2]
+    var column = parameters[3]
+    var errorObj = parameters[4]
+    var stackTrace
+    if (errorObj instanceof Error) {
+      stackTrace = computeStackTrace(errorObj)
+    } else {
+      var location = {
+        url: url,
+        column: column,
+        line: line
+      }
+      var parse = tryToParseMessage(messageObj)
 
-        stackTrace = {
-          name: parse.name,
-          message: parse.message,
-          stack: [location]
-        }
+      stackTrace = {
+        name: parse.name,
+        message: parse.message,
+        stack: [location]
       }
-      callback(stackTrace, isNullUndefinedDefaultValue(errorObj, messageObj))
     }
+    callback(stackTrace, isNullUndefinedDefaultValue(errorObj, messageObj))
   })
 }
 function tryToParseMessage(messageObj) {
@@ -91,11 +95,11 @@ function tryToParseMessage(messageObj) {
  * Install a global onunhandledrejection handler
  */
 function instrumentUnhandledRejection(callback) {
-  return instrumentMethodAndCallOriginal(window, 'onunhandledrejection', {
-    before: function (e) {
-      var reason = e.reason || 'Empty reason'
-      var stack = computeStackTrace(reason)
-      callback(stack, reason)
-    }
+  return instrumentMethod(window, 'onunhandledrejection', function (params) {
+    var parameters = params.parameters
+    var e = parameters[0]
+    var reason = e.reason || 'Empty reason'
+    var stack = computeStackTrace(reason)
+    callback(stack, reason)
   })
 }