@cloudcare/browser-core 2.0.4 → 2.0.6

package/esm/transport/flushController.js

@@ -0,0 +1,114 @@
+import { Observable } from '../helper/observable';
+import { clearTimeout, setTimeout } from '../helper/timer'; // type FlushReason = PageExitReason | 'duration_limit' | 'bytes_limit' | 'messages_limit' | 'session_expire'
+
+/**
+ * Returns a "flush controller", responsible of notifying when flushing a pool of pending data needs
+ * to happen. The implementation is designed to support both synchronous and asynchronous usages,
+ * but relies on invariants described in each method documentation to keep a coherent state.
+ */
+
+export function createFlushController(_ref) {
+  var {
+    messagesLimit,
+    bytesLimit,
+    durationLimit,
+    pageExitObservable,
+    sessionExpireObservable
+  } = _ref;
+  var flushObservable = new Observable();
+  pageExitObservable.subscribe(function (event) {
+    return flush(event.reason);
+  });
+  sessionExpireObservable.subscribe(function () {
+    return flush('session_expire');
+  });
+  var currentBytesCount = 0;
+  var currentMessagesCount = 0;
+
+  function flush(flushReason) {
+    if (currentMessagesCount === 0) {
+      return;
+    }
+
+    var messagesCount = currentMessagesCount;
+    var bytesCount = currentBytesCount;
+    currentMessagesCount = 0;
+    currentBytesCount = 0;
+    cancelDurationLimitTimeout();
+    flushObservable.notify({
+      reason: flushReason,
+      messagesCount: messagesCount,
+      bytesCount: bytesCount
+    });
+  }
+
+  var durationLimitTimeoutId;
+
+  function scheduleDurationLimitTimeout() {
+    if (durationLimitTimeoutId === undefined) {
+      durationLimitTimeoutId = setTimeout(function () {
+        flush('duration_limit');
+      }, durationLimit);
+    }
+  }
+
+  function cancelDurationLimitTimeout() {
+    clearTimeout(durationLimitTimeoutId);
+    durationLimitTimeoutId = undefined;
+  }
+
+  return {
+    flushObservable: flushObservable,
+    getMessagesCount: function getMessagesCount() {
+      return currentMessagesCount;
+    },
+
+    /**
+     * Notifies that a message will be added to a pool of pending messages waiting to be flushed.
+     *
+     * This function needs to be called synchronously, right before adding the message, so no flush
+     * event can happen after `notifyBeforeAddMessage` and before adding the message.
+     */
+    notifyBeforeAddMessage: function notifyBeforeAddMessage(messageBytesCount) {
+      if (currentBytesCount + messageBytesCount >= bytesLimit) {
+        flush('bytes_limit');
+      } // Consider the message to be added now rather than in `notifyAfterAddMessage`, because if no
+      // message was added yet and `notifyAfterAddMessage` is called asynchronously, we still want
+      // to notify when a flush is needed (for example on page exit).
+
+
+      currentMessagesCount += 1;
+      currentBytesCount += messageBytesCount;
+      scheduleDurationLimitTimeout();
+    },
+
+    /**
+     * Notifies that a message *was* added to a pool of pending messages waiting to be flushed.
+     *
+     * This function can be called asynchronously after the message was added, but in this case it
+     * should not be called if a flush event occurred in between.
+     */
+    notifyAfterAddMessage: function notifyAfterAddMessage() {
+      if (currentMessagesCount >= messagesLimit) {
+        flush('messages_limit');
+      } else if (currentBytesCount >= bytesLimit) {
+        flush('bytes_limit');
+      }
+    },
+
+    /**
+     * Notifies that a message was removed from a pool of pending messages waiting to be flushed.
+     *
+     * This function needs to be called synchronously, right after removing the message, so no flush
+     * event can happen after removing the message and before `notifyAfterRemoveMessage`.
+     */
+    notifyAfterRemoveMessage: function notifyAfterRemoveMessage(messageBytesCount) {
+      currentBytesCount -= messageBytesCount;
+      currentMessagesCount -= 1;
+
+      if (currentMessagesCount === 0) {
+        cancelDurationLimitTimeout();
+      }
+    }
+  };
+}

package/esm/transport/httpRequest.js

@@ -1,4 +1,5 @@
 import { newRetryState, sendWithRetryStrategy } from './sendWithRetryStrategy';
+import { addEventListener } from '../browser/addEventListener';
 /**
  * Use POST request without content type to:
  * - avoid CORS preflight requests
@@ -95,12 +96,14 @@ function isKeepAliveSupported() {
 function sendXHR(url, data, onResponse) {
   var request = new XMLHttpRequest();
   request.open('POST', url, true);
-  request.send(data);
-  request.addEventListener('loadend', function () {
+  addEventListener(request, 'loadend', function () {
     if (typeof onResponse === 'function') {
       onResponse({
         status: request.status
       });
     }
+  }, {
+    once: true
   });
+  request.send(data);
 }

package/esm/transport/index.js

@@ -1,3 +1,4 @@
 export { createHttpRequest } from './httpRequest';
 export { Batch } from './batch';
-export { startBatchWithReplica } from './startBatchWithReplica';
+export { startBatchWithReplica } from './startBatchWithReplica';
+export { createFlushController } from './flushController';

package/esm/transport/sendWithRetryStrategy.js

@@ -1,5 +1,7 @@
-import { clocksNow, ONE_KIBI_BYTE, ONE_MEBI_BYTE, ONE_SECOND } from '../helper/tools';
+import { clocksNow, ONE_SECOND } from '../helper/tools';
+import { ONE_MEBI_BYTE, ONE_KIBI_BYTE } from '../helper/byteUtils';
 import { ErrorSource } from '../helper/errorTools';
+import { setTimeout } from '../helper/timer';
 export var MAX_ONGOING_BYTES_COUNT = 80 * ONE_KIBI_BYTE;
 export var MAX_ONGOING_REQUESTS = 32;
 export var MAX_QUEUE_BYTES_COUNT = 3 * ONE_MEBI_BYTE;

package/esm/transport/startBatchWithReplica.js

@@ -1,10 +1,17 @@
 import { Batch } from './batch';
 import { createHttpRequest } from './httpRequest';
-export function startBatchWithReplica(configuration, endpointUrl, reportError, pageExitObservable) {
+import { createFlushController } from './flushController';
+export function startBatchWithReplica(configuration, endpointUrl, reportError, pageExitObservable, sessionExpireObservable) {
   var primaryBatch = createBatch(endpointUrl);
 
   function createBatch(endpointUrl) {
-    return new Batch(createHttpRequest(endpointUrl, configuration.batchBytesLimit, reportError), configuration.batchMessagesLimit, configuration.batchBytesLimit, configuration.messageBytesLimit, configuration.flushTimeout, pageExitObservable);
+    return new Batch(createHttpRequest(endpointUrl, configuration.batchBytesLimit, reportError), createFlushController({
+      messagesLimit: configuration.batchMessagesLimit,
+      bytesLimit: configuration.batchBytesLimit,
+      durationLimit: configuration.flushTimeout,
+      pageExitObservable: pageExitObservable,
+      sessionExpireObservable: sessionExpireObservable
+    }), configuration.messageBytesLimit);
   }
 
   return {

package/esm/user/index.js

@@ -0,0 +1 @@
+export * from './user';

package/esm/user/user.js

@@ -0,0 +1,32 @@
+import { display } from '../helper/display';
+import { assign, getType, each } from '../helper/tools';
+/**
+ * Clone input data and ensure known user properties (id, name, email)
+ * are strings, as defined here:
+ * https://docs.datadoghq.com/logs/log_configuration/attributes_naming_convention/#user-related-attributes
+ */
+
+export function sanitizeUser(newUser) {
+  // We shallow clone only to prevent mutation of user data.
+  var user = assign({}, newUser);
+  var keys = ['id', 'name', 'email'];
+  each(keys, function (key) {
+    if (key in user) {
+      user[key] = String(user[key]);
+    }
+  });
+  return user;
+}
+/**
+ * Simple check to ensure user is valid
+ */
+
+export function checkUser(newUser) {
+  var isValid = getType(newUser) === 'object';
+
+  if (!isValid) {
+    display.error('Unsupported user:', newUser);
+  }
+
+  return isValid;
+}

package/package.json

@@ -1,24 +1,24 @@
 {
-  "name": "@cloudcare/browser-core",
-  "version": "2.0.4",
-  "main": "cjs/index.js",
-  "module": "esm/index.js",
-  "scripts": {
-    "build": "run-p build:cjs build:esm",
-    "build:cjs": "rm -rf cjs && babel --config-file ./babel.cjs.json --out-dir cjs ./src",
-    "build:esm": "rm -rf esm && babel --config-file ./babel.esm.json --out-dir esm ./src "
-  },
-  "keywords": [
-    "dataflux",
-    "logs",
-    "sdk"
-  ],
-  "repository": {
-    "url": "https://github.com/DataFlux-cn/datakit-js",
-    "type": "git"
-  },
-  "author": "dataflux",
-  "license": "MIT",
-  "description": "DataFlux RUM Web 端数据指标监控",
-  "gitHead": "c8c2e9dfd59732cdadc5c7869eba9d7ddf6abeb2"
+    "name": "@cloudcare/browser-core",
+    "version": "2.0.6",
+    "main": "cjs/index.js",
+    "module": "esm/index.js",
+    "scripts": {
+        "build": "run-p build:cjs build:esm",
+        "build:cjs": "rm -rf cjs && babel --config-file ./babel.cjs.json --out-dir cjs ./src",
+        "build:esm": "rm -rf esm && babel --config-file ./babel.esm.json --out-dir esm ./src "
+    },
+    "keywords": [
+        "dataflux",
+        "logs",
+        "sdk"
+    ],
+    "repository": {
+        "url": "https://github.com/DataFlux-cn/datakit-js",
+        "type": "git"
+    },
+    "author": "dataflux",
+    "license": "MIT",
+    "description": "DataFlux RUM Web 端数据指标监控",
+    "gitHead": "ffbab227685c4ea3bf9b26e6e5e9c00233e64bb2"
 }

package/src/browser/addEventListener.js

@@ -0,0 +1,50 @@
+import { each } from '../helper/tools'
+import { getZoneJsOriginalValue } from '../helper/getZoneJsOriginalValue'
+export function addEventListener(eventTarget, event, listener, options) {
+  return addEventListeners(eventTarget, [event], listener, options)
+}
+
+/**
+ * Add event listeners to an event emitter object (Window, Element, mock object...).  This provides
+ * a few conveniences compared to using `element.addEventListener` directly:
+ *
+ * * supports IE11 by:
+ *   * using an option object only if needed
+ *   * emulating the `once` option
+ *
+ * * wraps the listener with a `monitor` function
+ *
+ * * returns a `stop` function to remove the listener
+ *
+ * * with `once: true`, the listener will be called at most once, even if different events are
+ *   listened
+ */
+
+export function addEventListeners(eventTarget, events, listener, options) {
+  var wrappedListener =
+    options && options.once
+      ? function (event) {
+          stop()
+          listener(event)
+        }
+      : listener
+
+  options =
+    options && options.passive
+      ? { capture: options.capture, passive: options.passive }
+      : options && options.capture
+  var add = getZoneJsOriginalValue(eventTarget, 'addEventListener')
+
+  each(events, function (event) {
+    add.call(eventTarget, event, wrappedListener, options)
+  })
+  var stop = function () {
+    var remove = getZoneJsOriginalValue(eventTarget, 'removeEventListener')
+    each(events, function (event) {
+      remove.call(eventTarget, event, wrappedListener, options)
+    })
+  }
+  return {
+    stop: stop
+  }
+}

package/src/browser/fetchObservable.js

@@ -47,10 +47,9 @@ function createFetchObservable() {
 
 function beforeSend(observable, input, init) {
   var method =
-    (init && init.method) ||
-    (typeof input === 'object' && input.method) ||
-    'GET'
-  var url = normalizeUrl((typeof input === 'object' && input.url) || input)
+    (init && init.method) || (input instanceof Request && input.method) || 'GET'
+  var url = input instanceof Request ? input.url : normalizeUrl(String(input))
+
   var startClocks = clocksNow()
 
   var context = {
@@ -80,7 +79,8 @@ function afterSend(observable, responsePromise, startContext) {
       context.error = response
     } else if ('status' in response) {
       context.response = response
-      context.responseType = response.type
+      context.responseType =
+        (response instanceof Response && response.type) || '' // issue The Response type getter can only be used on instances of Response
       context.status = response.status
       context.isAborted = false
     }

package/src/browser/pageExitObservable.js

@@ -1,11 +1,10 @@
 import { Observable } from '../helper/observable'
+import { includes, values } from '../helper/tools'
+import { DOM_EVENT } from '../helper/enums'
 import {
   addEventListener,
-  addEventListeners,
-  includes,
-  values
-} from '../helper/tools'
-import { DOM_EVENT } from '../helper/enums'
+  addEventListeners
+} from '../browser/addEventListener'
 export var PageExitReason = {
   HIDDEN: 'visibility_hidden',
   UNLOADING: 'before_unload',

package/src/browser/runOnReadyState.js

@@ -0,0 +1,16 @@
+import { addEventListener } from './addEventListener'
+import { DOM_EVENT } from '../helper/enums'
+export function runOnReadyState(expectedReadyState, callback) {
+  if (
+    document.readyState === expectedReadyState ||
+    document.readyState === 'complete'
+  ) {
+    callback()
+  } else {
+    var eventName =
+      expectedReadyState === 'complete'
+        ? DOM_EVENT.LOAD
+        : DOM_EVENT.DOM_CONTENT_LOADED
+    addEventListener(window, eventName, callback, { once: true })
+  }
+}

package/src/browser/xhrObservable.js

@@ -1,8 +1,15 @@
 import { instrumentMethodAndCallOriginal } 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,
+  relativeNow,
+  clocksNow,
+  timeStampNow,
+  UUID
+} from '../helper/tools'
+import { addEventListener } from '../browser/addEventListener'
 var xhrObservable
 var xhrContexts = {}
 var DATA_FLUX_REQUEST_ID_KEY = '_DATAFLUX_REQUEST_UUID'
@@ -14,22 +21,34 @@ export function initXhrObservable() {
 }
 
 function createXhrObservable() {
-  var observable = new Observable(function(){
-    var openInstrumentMethod = instrumentMethodAndCallOriginal(XMLHttpRequest.prototype, 'open', {
-      before: openXhr,
-    })
+  var observable = new Observable(function () {
+    var openInstrumentMethod = instrumentMethodAndCallOriginal(
+      XMLHttpRequest.prototype,
+      'open',
+      {
+        before: openXhr
+      }
+    )
 
-    var sendInstrumentMethod = instrumentMethodAndCallOriginal(XMLHttpRequest.prototype, 'send', {
-      before: function() {
-        sendXhr.call(this, observable)
-      },
-    })
+    var sendInstrumentMethod = instrumentMethodAndCallOriginal(
+      XMLHttpRequest.prototype,
+      'send',
+      {
+        before: function () {
+          sendXhr.call(this, observable)
+        }
+      }
+    )
 
-    var abortInstrumentMethod = instrumentMethodAndCallOriginal(XMLHttpRequest.prototype, 'abort', {
-      before:abortXhr,
-    })
+    var abortInstrumentMethod = instrumentMethodAndCallOriginal(
+      XMLHttpRequest.prototype,
+      'abort',
+      {
+        before: abortXhr
+      }
+    )
 
-    return function() {
+    return function () {
       openInstrumentMethod.stop()
       sendInstrumentMethod.stop()
       abortInstrumentMethod.stop()
@@ -44,7 +63,7 @@ function openXhr(method, url) {
   xhrContexts[requestUUID] = {
     state: 'open',
     method: method,
-    url: normalizeUrl(String(url)),
+    url: normalizeUrl(String(url))
   }
 }
 
@@ -60,34 +79,40 @@ function sendXhr(observable) {
   startContext.isAborted = false
   startContext.xhr = this
   var hasBeenReported = false
-  var onreadyStateChangeInstrumentMethod = instrumentMethodAndCallOriginal(this, '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)
-        
+  var stopInstrumentingOnReadyStateChange = instrumentMethodAndCallOriginal(
+    this,
+    '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)
+        }
       }
-    },
-  })
+    }
+  ).stop
 
-  var onEnd = function() {
-    this.removeEventListener('loadend', onEnd)
-    onreadyStateChangeInstrumentMethod.stop()
+  var onEnd = function () {
+    unsubscribeLoadEndListener()
+    stopInstrumentingOnReadyStateChange()
     if (hasBeenReported) {
       return
     }
     hasBeenReported = true
     var completeContext = context
     completeContext.state = 'complete'
-    completeContext.duration = elapsed(startContext.startClocks.timeStamp, timeStampNow())
+    completeContext.duration = elapsed(
+      startContext.startClocks.timeStamp,
+      timeStampNow()
+    )
     completeContext.status = this.status
     observable.notify(shallowClone(completeContext))
     clearRequestId.call(this)
   }
-  this.addEventListener('loadend', onEnd)
+  var unsubscribeLoadEndListener = addEventListener(this, 'loadend', onEnd).stop
   observable.notify(startContext)
 }
 function clearRequestId() {

package/src/configuration/configuration.js

@@ -4,10 +4,10 @@ import { display } from '../helper/display'
 import {
   assign,
   isPercentage,
-  ONE_KIBI_BYTE,
   ONE_SECOND,
   isNullUndefinedDefaultValue
 } from '../helper/tools'
+import { ONE_KIBI_BYTE } from '../helper/byteUtils'
 import { computeTransportConfiguration } from './transportConfiguration'
 
 export var DefaultPrivacyLevel = {

package/src/console/consoleObservable.js

@@ -1,14 +1,18 @@
 import { computeStackTrace } from '../tracekit'
-import { createHandlingStack, formatErrorMessage, toStackTraceString } from '../helper/errorTools'
+import {
+  createHandlingStack,
+  formatErrorMessage,
+  toStackTraceString
+} from '../helper/errorTools'
 import { mergeObservables, Observable } from '../helper/observable'
-import { find, jsonStringify, map } from '../helper/tools'
+import { find, map } from '../helper/tools'
+import { jsonStringify } from '../helper/serialisation/jsonStringify'
 import { ConsoleApiName } from '../helper/display'
 
-
 var consoleObservablesByApi = {}
 
 export function initConsoleObservable(apis) {
-  var consoleObservables = map(apis, function(api) {
+  var consoleObservables = map(apis, function (api) {
     if (!consoleObservablesByApi[api]) {
       consoleObservablesByApi[api] = createConsoleObservable(api)
     }
@@ -20,15 +24,15 @@ export function initConsoleObservable(apis) {
 
 /* eslint-disable no-console */
 function createConsoleObservable(api) {
-  var observable = new Observable(function(){
+  var observable = new Observable(function () {
     var originalConsoleApi = console[api]
-    console[api] = function() {
+    console[api] = function () {
       var params = [].slice.call(arguments)
       originalConsoleApi.apply(console, arguments)
       var handlingStack = createHandlingStack()
       observable.notify(buildConsoleLog(params, api, handlingStack))
     }
-    return function() {
+    return function () {
       console[api] = originalConsoleApi
     }
   })
@@ -37,20 +41,26 @@ function createConsoleObservable(api) {
 
 function buildConsoleLog(params, api, handlingStack) {
   // Todo: remove console error prefix in the next major version
-  var message = map(params, function(param) { return formatConsoleParameters(param) }).join(' ')
+  var message = map(params, function (param) {
+    return formatConsoleParameters(param)
+  }).join(' ')
   var stack
 
   if (api === ConsoleApiName.error) {
-    var firstErrorParam = find(params, function(param) { return param instanceof Error })
-    stack = firstErrorParam ? toStackTraceString(computeStackTrace(firstErrorParam)) : undefined
-    message = 'console error: '+ message
+    var firstErrorParam = find(params, function (param) {
+      return param instanceof Error
+    })
+    stack = firstErrorParam
+      ? toStackTraceString(computeStackTrace(firstErrorParam))
+      : undefined
+    message = 'console error: ' + message
   }
 
   return {
     api: api,
     message: message,
     stack: stack,
-    handlingStack: handlingStack,
+    handlingStack: handlingStack
   }
 }
 

package/src/dataMap.js

@@ -47,6 +47,7 @@ export var dataMap = {
     },
     fields: {
       session_replay_stats: '_dd.replay_stats',
+      session_is_active: 'session.is_active',
       view_error_count: 'view.error.count',
       view_resource_count: 'view.resource.count',
       view_long_task_count: 'view.long_task.count',

package/src/helper/byteUtils.js

@@ -0,0 +1,17 @@
+export var ONE_KIBI_BYTE = 1024
+export var ONE_MEBI_BYTE = 1024 * ONE_KIBI_BYTE
+// eslint-disable-next-line no-control-regex
+var HAS_MULTI_BYTES_CHARACTERS = /[^\u0000-\u007F]/
+
+export function computeBytesCount(candidate) {
+  // Accurate bytes count computations can degrade performances when there is a lot of events to process
+  if (!HAS_MULTI_BYTES_CHARACTERS.test(candidate)) {
+    return candidate.length
+  }
+
+  if (window.TextEncoder !== undefined) {
+    return new TextEncoder().encode(candidate).length
+  }
+
+  return new Blob([candidate]).size
+}

package/src/helper/contextHistory.js

@@ -1,5 +1,5 @@
 import { relativeNow, ONE_MINUTE, filter, map } from './tools'
-
+import { setInterval, clearInterval } from './timer'
 var END_OF_TIMES = Infinity
 
 export var CLEAR_OLD_CONTEXTS_INTERVAL = ONE_MINUTE

package/src/helper/createEventRateLimiter.js

@@ -1,16 +1,13 @@
 import { ErrorSource } from './errorTools'
 import { clocksNow, ONE_MINUTE } from './tools'
-export function createEventRateLimiter(
-  eventType,
-  limit,
-  onLimitReached
-) {
+import { setTimeout } from './timer'
+export function createEventRateLimiter(eventType, limit, onLimitReached) {
   var eventCount = 0
   var allowNextEvent = false
   return {
-    isLimitReached: function() {
+    isLimitReached: function () {
       if (eventCount === 0) {
-        setTimeout(function(){
+        setTimeout(function () {
           eventCount = 0
         }, ONE_MINUTE)
       }
@@ -23,9 +20,10 @@ export function createEventRateLimiter(
         allowNextEvent = true
         try {
           onLimitReached({
-            message: 'Reached max number of ' + eventType +'s by minute: ' + limit,
+            message:
+              'Reached max number of ' + eventType + 's by minute: ' + limit,
             source: ErrorSource.AGENT,
-            startClocks: clocksNow(),
+            startClocks: clocksNow()
           })
         } finally {
           allowNextEvent = false

package/src/helper/errorTools.js

@@ -1,4 +1,5 @@
-import { each, noop, jsonStringify } from './tools'
+import { each, noop } from './tools'
+import { jsonStringify } from '../helper/serialisation/jsonStringify'
 import { computeStackTrace } from '../tracekit'
 
 export var ErrorSource = {