@cloudcare/browser-core 2.0.3 → 2.0.5

package/esm/index.js

@@ -4,6 +4,7 @@ export * from './helper/deviceInfo';
 export * from './helper/enums';
 export * from './helper/instrumentMethod';
 export * from './helper/errorTools';
+export * from './helper/byteUtils';
 export * from './error/trackRuntimeError';
 export * from './console/consoleObservable';
 export * from './report/reportObservable';
@@ -17,6 +18,7 @@ export * from './helper/tools';
 export * from './helper/urlPolyfill';
 export * from './helper/mobileUtil';
 export * from './helper/getZoneJsOriginalValue';
+export * from './helper/timer';
 export * from './helper/readBytesFromStream';
 export * from './tracekit';
 export * from './configuration/configuration';
@@ -26,6 +28,8 @@ export * from './browser/fetchObservable';
 export * from './browser/xhrObservable';
 export * from './browser/pageExitObservable';
 export * from './browser/htmlDomUtils';
+export * from './browser/addEventListener';
+export * from './browser/runOnReadyState';
 export * from './dataMap';
 export * from './init';
 export * from './session/sessionManagement';
@@ -33,4 +37,9 @@ export * from './session/sessionConstants';
 export * from './session/sessionCookieStore';
 export * from './session/sessionStore';
 export * from './transport';
-export * from './synthetics/syntheticsWorkerValues';
+export * from './synthetics/syntheticsWorkerValues';
+export * from './helper/serialisation/contextManager';
+export * from './helper/serialisation/heavyCustomerDataWarning';
+export * from './helper/serialisation/jsonStringify';
+export * from './helper/serialisation/rowData';
+export * from './user';

package/esm/init.js

@@ -14,13 +14,13 @@ export function makePublicApi(stub) {
     }
   }); // Add an "hidden" property to set debug mode. We define it that way to hide it
   // as much as possible but of course it's not a real protection.
+  //   Object.defineProperty(publicApi, '_setDebug', {
+  //     get: function () {
+  //       return setDebugMode
+  //     },
+  //     enumerable: false
+  //   })
 
-  Object.defineProperty(publicApi, '_setDebug', {
-    get: function get() {
-      return setDebugMode;
-    },
-    enumerable: false
-  });
   return publicApi;
 }
 export function defineGlobal(global, name, api) {

package/esm/report/reportObservable.js

@@ -1,6 +1,7 @@
 import { toStackTraceString } from '../helper/errorTools';
 import { mergeObservables, Observable } from '../helper/observable';
-import { includes, addEventListener, safeTruncate, filter, each } from '../helper/tools';
+import { includes, safeTruncate, filter, each } from '../helper/tools';
+import { addEventListener } from '../browser/addEventListener';
 import { DOM_EVENT } from '../helper/enums';
 export var RawReportType = {
   intervention: 'intervention',
@@ -75,7 +76,7 @@ function buildRawReportFromReport(report) {
 
 function buildRawReportFromCspViolation(event) {
   var type = RawReportType.cspViolation;
-  var message = '\'' + event.blockedURI + '\' blocked by \'' + event.effectiveDirective + '\' directive';
+  var message = "'" + event.blockedURI + "' blocked by '" + event.effectiveDirective + "' directive";
   return {
     type: RawReportType.cspViolation,
     subtype: event.effectiveDirective,

package/esm/session/sessionCookieStore.js

@@ -1,6 +1,7 @@
 import { getCookie, setCookie } from '../browser/cookie';
 import { isChromium, dateNow, isEmptyObject, UUID, objectEntries, map, each } from '../helper/tools';
 import { SESSION_EXPIRATION_DELAY } from './sessionConstants';
+import { setTimeout } from '../helper/timer';
 var SESSION_ENTRY_REGEXP = /^([a-z]+)=([a-z0-9-]+)$/;
 var SESSION_ENTRY_SEPARATOR = '&';
 export var SESSION_COOKIE_NAME = '_dataflux_s'; // arbitrary values

package/esm/session/sessionManagement.js

@@ -1,8 +1,10 @@
-import { relativeNow, clocksOrigin, ONE_MINUTE, each, addEventListeners, addEventListener } from '../helper/tools';
+import { relativeNow, clocksOrigin, ONE_MINUTE, each } from '../helper/tools';
+import { addEventListeners, addEventListener } from '../browser/addEventListener';
 import { ContextHistory } from '../helper/contextHistory';
 import { startSessionStore } from './sessionStore';
 import { SESSION_TIME_OUT_DELAY } from './sessionConstants';
 import { DOM_EVENT } from '../helper/enums';
+import { clearInterval, setInterval } from '../helper/timer';
 export var VISIBILITY_CHECK_DELAY = ONE_MINUTE;
 var SESSION_CONTEXT_TIMEOUT_DELAY = SESSION_TIME_OUT_DELAY;
 var stopCallbacks = [];
@@ -42,7 +44,8 @@ export var startSessionManager = function startSessionManager(options, productKe
       return sessionContextHistory.find(startTime);
     },
     renewObservable: sessionStore.renewObservable,
-    expireObservable: sessionStore.expireObservable
+    expireObservable: sessionStore.expireObservable,
+    expire: sessionStore.expire
   };
 };
 export function stopSessionManager() {

package/esm/session/sessionStore.js

@@ -3,6 +3,7 @@ import { Observable } from '../helper/observable';
 import { dateNow, UUID, throttle } from '../helper/tools';
 import { SESSION_TIME_OUT_DELAY } from './sessionConstants';
 import { retrieveSession, withCookieLockAccess } from './sessionCookieStore';
+import { clearInterval, setInterval } from '../helper/timer';
 /**
  * Different session concepts:
  * - tracked, the session has an id and is updated along the user navigation
@@ -67,7 +68,7 @@ export function startSessionStore(options, productKey, computeSessionState) {
 
     if (hasSessionInCache()) {
       if (isSessionInCacheOutdated(cookieSession)) {
-        expireSession();
+        expireSessionInCache();
       } else {
         sessionCache = cookieSession;
       }
@@ -98,7 +99,7 @@ export function startSessionStore(options, productKey, computeSessionState) {
     return sessionCache.id !== cookieSession.id || sessionCache[productKey] !== cookieSession[productKey];
   }
 
-  function expireSession() {
+  function expireSessionInCache() {
     sessionCache = {};
     expireObservable.notify();
   }
@@ -132,6 +133,10 @@ export function startSessionStore(options, productKey, computeSessionState) {
     },
     renewObservable: renewObservable,
     expireObservable: expireObservable,
+    expire: function expire() {
+      deleteSessionCookie(options);
+      synchronizeSession({});
+    },
     stop: function stop() {
       clearInterval(watchSessionTimeoutId);
     }

package/esm/transport/batch.js

@@ -1,7 +1,10 @@
 import { display } from '../helper/display';
-import { addEventListener, noop, values, findByPath, escapeRowData, each, isNumber, isArray, extend, isString, toServerDuration, isBoolean, isEmptyObject, isObject, escapeJsonValue, escapeRowField } from '../helper/tools';
+import { values, findByPath, each, isNumber, isArray, extend, isString, toServerDuration, isBoolean, isEmptyObject, isObject } from '../helper/tools';
+import { escapeJsonValue, escapeRowField, escapeRowData } from '../helper/serialisation/rowData';
 import { commonTags, dataMap, commonFields } from '../dataMap';
-import { DOM_EVENT, RumEventType } from '../helper/enums'; // https://en.wikipedia.org/wiki/UTF-8
+import { RumEventType } from '../helper/enums';
+import { computeBytesCount } from '../helper/byteUtils';
+import { isPageExitReason } from '../browser/pageExitObservable'; // https://en.wikipedia.org/wiki/UTF-8
 // eslint-disable-next-line no-control-regex
 
 var HAS_MULTI_BYTES_CHARACTERS = /[^\u0000-\u007F]/;
@@ -124,23 +127,18 @@ export var processedMessageByDataMap = function processedMessageByDataMap(messag
   };
 };
 
-var batch = function batch(request, batchMessagesLimit, batchBytesLimit, messageBytesLimit, flushTimeout, pageExitObservable) {
+var batch = function batch(request, flushController, messageBytesLimit) {
   this.pushOnlyBuffer = [];
   this.upsertBuffer = {};
-  this.bufferBytesCount = 0;
-  this.bufferMessagesCount = 0;
   this.request = request;
-  this.batchMessagesLimit = batchMessagesLimit;
-  this.batchBytesLimit = batchBytesLimit;
+  this.flushController = flushController;
   this.messageBytesLimit = messageBytesLimit;
-  this.flushTimeout = flushTimeout;
 
   var _this = this;
 
-  pageExitObservable.subscribe(function () {
-    _this.flush(_this.request.sendOnExit);
+  this.flushController.flushObservable.subscribe(function (event) {
+    _this.flush(event);
   });
-  this.flushPeriodically();
 };
 
 batch.prototype.add = function (message) {
@@ -151,45 +149,26 @@ batch.prototype.upsert = function (message, key) {
   this.addOrUpdate(message, key);
 };
 
-batch.prototype.flush = function (sendFn) {
-  if (typeof sendFn !== 'function') {
-    sendFn = this.request.send;
-  }
+batch.prototype.flush = function (event) {
+  var messages = this.pushOnlyBuffer.concat(values(this.upsertBuffer));
+  this.pushOnlyBuffer = [];
+  this.upsertBuffer = {};
 
-  if (this.bufferMessagesCount !== 0) {
-    var messages = this.pushOnlyBuffer.concat(values(this.upsertBuffer));
-    var bytesCount = this.bufferBytesCount;
-    this.pushOnlyBuffer = [];
-    this.upsertBuffer = {};
-    this.bufferBytesCount = 0;
-    this.bufferMessagesCount = 0;
-
-    if (messages.length > 0) {
-      sendFn({
-        data: messages.join('\n'),
-        bytesCount: bytesCount
-      });
+  if (messages.length > 0) {
+    var payload = {
+      data: messages.join('\n'),
+      bytesCount: event.bytesCount,
+      flushReason: event.reason
+    };
+
+    if (isPageExitReason(event.reason)) {
+      this.request.sendOnExit(payload);
+    } else {
+      this.request.send(payload);
     }
   }
 };
 
-batch.prototype.flushOnExit = function () {
-  this.flush(this.request.sendOnExit);
-};
-
-batch.prototype.computeBytesCount = function (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;
-};
-
 batch.prototype.addOrUpdate = function (message, key) {
   var _process = this.process(message);
 
@@ -205,20 +184,12 @@ batch.prototype.addOrUpdate = function (message, key) {
     this.remove(key);
   }
 
-  if (this.willReachedBytesLimitWith(messageBytesCount)) {
-    this.flush();
-  }
-
   this.push(processedMessage, messageBytesCount, key);
-
-  if (this.isFull()) {
-    this.flush();
-  }
 };
 
 batch.prototype.process = function (message) {
   var processedMessage = processedMessageByDataMap(message).rowStr;
-  var messageBytesCount = this.computeBytesCount(processedMessage);
+  var messageBytesCount = computeBytesCount(processedMessage);
   return {
     processedMessage: processedMessage,
     messageBytesCount: messageBytesCount
@@ -226,10 +197,8 @@ batch.prototype.process = function (message) {
 };
 
 batch.prototype.push = function (processedMessage, messageBytesCount, key) {
-  if (this.bufferMessagesCount > 0) {
-    // \n separator at serialization
-    this.bufferBytesCount += 1;
-  }
+  var separatorBytesCount = this.flushController.getMessagesCount() > 0 ? 1 : 0;
+  this.flushController.notifyBeforeAddMessage(messageBytesCount + separatorBytesCount);
 
   if (key !== undefined) {
     this.upsertBuffer[key] = processedMessage;
@@ -237,43 +206,20 @@ batch.prototype.push = function (processedMessage, messageBytesCount, key) {
     this.pushOnlyBuffer.push(processedMessage);
   }
 
-  this.bufferBytesCount += messageBytesCount;
-  this.bufferMessagesCount += 1;
+  this.flushController.notifyAfterAddMessage();
 };
 
 batch.prototype.remove = function (key) {
   var removedMessage = this.upsertBuffer[key];
   delete this.upsertBuffer[key];
-  var messageBytesCount = this.computeBytesCount(removedMessage);
-  this.bufferBytesCount -= messageBytesCount;
-  this.bufferMessagesCount -= 1;
+  var messageBytesCount = computeBytesCount(removedMessage); // If there are other messages, a '\n' will be added at serialization
 
-  if (this.bufferMessagesCount > 0) {
-    this.bufferBytesCount -= 1;
-  }
+  var separatorBytesCount = this.flushController.getMessagesCount() > 1 ? 1 : 0;
+  this.flushController.notifyAfterRemoveMessage(messageBytesCount + separatorBytesCount);
 };
 
 batch.prototype.hasMessageFor = function (key) {
   return key !== undefined && this.upsertBuffer[key] !== undefined;
 };
 
-batch.prototype.willReachedBytesLimitWith = function (messageBytesCount) {
-  // byte of the separator at the end of the message
-  return this.bufferBytesCount + messageBytesCount + 1 >= this.batchBytesLimit;
-};
-
-batch.prototype.isFull = function () {
-  return this.bufferMessagesCount === this.batchMessagesLimit || this.bufferBytesCount >= this.batchBytesLimit;
-};
-
-batch.prototype.flushPeriodically = function () {
-  var _this = this;
-
-  setTimeout(function () {
-    _this.flush();
-
-    _this.flushPeriodically();
-  }, this.flushTimeout);
-};
-
 export var Batch = batch;

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.3",
-  "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": "b82105ba8e15d80ecd65492d071988f4b20ef78a"
+    "name": "@cloudcare/browser-core",
+    "version": "2.0.5",
+    "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": "d73a29f283e62c5b13fe0b0f710b7e1e186267bc"
 }

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/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',