@microsoft/applicationinsights-react-js 3.2.2-nightly.2111-08 → 3.2.2-nightly.2111-09

package/dist/applicationinsights-react-js.rollup.d.ts

@@ -1,5 +1,5 @@
 /*
- * Microsoft Application Insights react plugin, 3.2.2-nightly.2111-08
+ * Microsoft Application Insights react plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  *
  * 

package/dist-esm/AppInsightsContext.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 import { createContext, useContext } from "react";

package/dist-esm/AppInsightsErrorBoundary.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 

package/dist-esm/Interfaces/IReactExtensionConfig.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 

package/dist-esm/ReactPlugin.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 /**
@@ -98,10 +98,19 @@ var ReactPlugin = /** @class */ (function (_super) {
     };
     ReactPlugin.prototype.addHistoryListener = function (history) {
         var _this = this;
-        var locationListener = function (location, action) {
+        var locationListener = function (arg) {
+            // v4 of the history API passes "location" as the first argument, while v5 passes an object that contains location and action 
+            var locn = null;
+            if ("location" in arg) {
+                // Looks like v5
+                locn = arg["location"];
+            }
+            else {
+                locn = arg;
+            }
             // Timeout to ensure any changes to the DOM made by route changes get included in pageView telemetry
             setTimeout(function () {
-                var pageViewTelemetry = { uri: location.pathname };
+                var pageViewTelemetry = { uri: locn.pathname };
                 _this.trackPageView(pageViewTelemetry);
             }, 500);
         };

package/dist-esm/ReactPlugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactPlugin.js.map","sources":["ReactPlugin.js"],"sourcesContent":["/**\r\n * ReactPlugin.ts\r\n * @copyright Microsoft 2019\r\n */\r\nimport { __extends } from \"tslib\";\r\nimport { BaseTelemetryPlugin, _InternalMessageId, LoggingSeverity, safeGetCookieMgr, arrForEach } from \"@microsoft/applicationinsights-core-js\";\r\nvar ReactPlugin = /** @class */ (function (_super) {\r\n    __extends(ReactPlugin, _super);\r\n    function ReactPlugin() {\r\n        var _this = _super !== null && _super.apply(this, arguments) || this;\r\n        _this.priority = 185;\r\n        _this.identifier = 'ReactPlugin';\r\n        return _this;\r\n    }\r\n    ReactPlugin.prototype.initialize = function (config, core, extensions, pluginChain) {\r\n        var _this = this;\r\n        _super.prototype.initialize.call(this, config, core, extensions, pluginChain);\r\n        this._extensionConfig =\r\n            config.extensionConfig && config.extensionConfig[this.identifier]\r\n                ? config.extensionConfig[this.identifier]\r\n                : { history: null };\r\n        arrForEach(extensions, function (ext) {\r\n            var identifier = ext.identifier;\r\n            if (identifier === 'ApplicationInsightsAnalytics') {\r\n                _this._analyticsPlugin = ext;\r\n            }\r\n        });\r\n        if (this._extensionConfig.history) {\r\n            this.addHistoryListener(this._extensionConfig.history);\r\n            var pageViewTelemetry = {\r\n                uri: this._extensionConfig.history.location.pathname\r\n            };\r\n            this.trackPageView(pageViewTelemetry);\r\n        }\r\n    };\r\n    /**\r\n     * Get the current cookie manager for this instance\r\n     */\r\n    ReactPlugin.prototype.getCookieMgr = function () {\r\n        return safeGetCookieMgr(this.core);\r\n    };\r\n    /**\r\n     * Get application insights instance.\r\n     */\r\n    ReactPlugin.prototype.getAppInsights = function () {\r\n        return this._analyticsPlugin;\r\n    };\r\n    /**\r\n     * Add Part A fields to the event\r\n     * @param event The event that needs to be processed\r\n     */\r\n    ReactPlugin.prototype.processTelemetry = function (event, itemCtx) {\r\n        this.processNext(event, itemCtx);\r\n    };\r\n    ReactPlugin.prototype.trackMetric = function (metric, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackMetric(metric, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackPageView = function (pageView) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackPageView(pageView);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackEvent = function (event, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackEvent(event, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackException = function (exception, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackException(exception, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackTrace = function (trace, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackTrace(trace, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.addHistoryListener = function (history) {\r\n        var _this = this;\r\n        var locationListener = function (location, action) {\r\n            // Timeout to ensure any changes to the DOM made by route changes get included in pageView telemetry\r\n            setTimeout(function () {\r\n                var pageViewTelemetry = { uri: location.pathname };\r\n                _this.trackPageView(pageViewTelemetry);\r\n            }, 500);\r\n        };\r\n        history.listen(locationListener);\r\n    };\r\n    return ReactPlugin;\r\n}(BaseTelemetryPlugin));\r\nexport default ReactPlugin;\r\n//# sourceMappingURL=ReactPlugin.js.map"],"names":[],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA,gFAAkC;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
+{"version":3,"file":"ReactPlugin.js.map","sources":["ReactPlugin.js"],"sourcesContent":["/**\r\n * ReactPlugin.ts\r\n * @copyright Microsoft 2019\r\n */\r\nimport { __extends } from \"tslib\";\r\nimport { BaseTelemetryPlugin, _InternalMessageId, LoggingSeverity, safeGetCookieMgr, arrForEach } from \"@microsoft/applicationinsights-core-js\";\r\nvar ReactPlugin = /** @class */ (function (_super) {\r\n    __extends(ReactPlugin, _super);\r\n    function ReactPlugin() {\r\n        var _this = _super !== null && _super.apply(this, arguments) || this;\r\n        _this.priority = 185;\r\n        _this.identifier = 'ReactPlugin';\r\n        return _this;\r\n    }\r\n    ReactPlugin.prototype.initialize = function (config, core, extensions, pluginChain) {\r\n        var _this = this;\r\n        _super.prototype.initialize.call(this, config, core, extensions, pluginChain);\r\n        this._extensionConfig =\r\n            config.extensionConfig && config.extensionConfig[this.identifier]\r\n                ? config.extensionConfig[this.identifier]\r\n                : { history: null };\r\n        arrForEach(extensions, function (ext) {\r\n            var identifier = ext.identifier;\r\n            if (identifier === 'ApplicationInsightsAnalytics') {\r\n                _this._analyticsPlugin = ext;\r\n            }\r\n        });\r\n        if (this._extensionConfig.history) {\r\n            this.addHistoryListener(this._extensionConfig.history);\r\n            var pageViewTelemetry = {\r\n                uri: this._extensionConfig.history.location.pathname\r\n            };\r\n            this.trackPageView(pageViewTelemetry);\r\n        }\r\n    };\r\n    /**\r\n     * Get the current cookie manager for this instance\r\n     */\r\n    ReactPlugin.prototype.getCookieMgr = function () {\r\n        return safeGetCookieMgr(this.core);\r\n    };\r\n    /**\r\n     * Get application insights instance.\r\n     */\r\n    ReactPlugin.prototype.getAppInsights = function () {\r\n        return this._analyticsPlugin;\r\n    };\r\n    /**\r\n     * Add Part A fields to the event\r\n     * @param event The event that needs to be processed\r\n     */\r\n    ReactPlugin.prototype.processTelemetry = function (event, itemCtx) {\r\n        this.processNext(event, itemCtx);\r\n    };\r\n    ReactPlugin.prototype.trackMetric = function (metric, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackMetric(metric, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackPageView = function (pageView) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackPageView(pageView);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackEvent = function (event, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackEvent(event, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackException = function (exception, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackException(exception, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.trackTrace = function (trace, customProperties) {\r\n        if (this._analyticsPlugin) {\r\n            this._analyticsPlugin.trackTrace(trace, customProperties);\r\n        }\r\n        else {\r\n            this.diagLog().throwInternal(LoggingSeverity.CRITICAL, _InternalMessageId.TelemetryInitializerFailed, \"Analytics plugin is not available, React plugin telemetry will not be sent: \");\r\n        }\r\n    };\r\n    ReactPlugin.prototype.addHistoryListener = function (history) {\r\n        var _this = this;\r\n        var locationListener = function (arg) {\r\n            // v4 of the history API passes \"location\" as the first argument, while v5 passes an object that contains location and action \r\n            var locn = null;\r\n            if (\"location\" in arg) {\r\n                // Looks like v5\r\n                locn = arg[\"location\"];\r\n            }\r\n            else {\r\n                locn = arg;\r\n            }\r\n            // Timeout to ensure any changes to the DOM made by route changes get included in pageView telemetry\r\n            setTimeout(function () {\r\n                var pageViewTelemetry = { uri: locn.pathname };\r\n                _this.trackPageView(pageViewTelemetry);\r\n            }, 500);\r\n        };\r\n        history.listen(locationListener);\r\n    };\r\n    return ReactPlugin;\r\n}(BaseTelemetryPlugin));\r\nexport default ReactPlugin;\r\n//# sourceMappingURL=ReactPlugin.js.map"],"names":[],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA,gFAAkC;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}

package/dist-esm/applicationinsights-react-js.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 

package/dist-esm/useTrackEvent.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 /**

package/dist-esm/useTrackMetric.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 import { useEffect, useRef } from "react";

package/dist-esm/withAITracking.js

@@ -1,5 +1,5 @@
 /*
- * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-08
+ * Application Insights JavaScript SDK - React Plugin, 3.2.2-nightly.2111-09
  * Copyright (c) Microsoft and contributors. All rights reserved.
  */
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@microsoft/applicationinsights-react-js",
-    "version": "3.2.2-nightly.2111-08",
+    "version": "3.2.2-nightly.2111-09",
     "description": "Microsoft Application Insights React plugin",
     "main": "dist/applicationinsights-react-js.js",
     "module": "dist-esm/applicationinsights-react-js.js",
@@ -30,8 +30,8 @@
         "@testing-library/react": "^11.2.5",
         "@testing-library/user-event": "^12.8.1",
         "@types/cheerio": "0.22.13",
-        "@types/history": "4.7.2",
-        "@types/jest": "^24.0.11",
+        "@types/history": "^4.7.9",
+        "@types/jest": "^27.0.2",
         "@types/node": "11.13.2",
         "@types/prop-types": "^15.7.3",
         "@types/react": "^16.9.11",
@@ -39,9 +39,9 @@
         "csstype": "~2.6.7",
         "grunt": "^1.4.1",
         "grunt-cli": "^1.4.3",
-        "jest": "^24.7.1",
-        "react": "^17.0.1",
-        "react-dom": "^17.0.1",
+        "jest": "^27.3.1",
+        "react": "^17.0.2",
+        "react-dom": "^17.0.2",
         "globby": "^11.0.0",
         "magic-string": "^0.25.7",
         "@rollup/plugin-commonjs": "^18.0.0",
@@ -50,21 +50,22 @@
         "rollup-plugin-cleanup": "3.2.1",
         "rollup-plugin-peer-deps-external": "^2.2.4",
         "rollup": "^2.32.0",
-        "ts-jest": "^24.0.2",
+        "ts-jest": "^27.0.7",
         "typescript": "^4.3.4",
         "tslib": "^2.0.0",
-        "uglify-js": "^3.11.0"
+        "uglify-js": "^3.11.0",
+        "history": "^5.1.0"
     },
     "dependencies": {
         "@microsoft/applicationinsights-shims": "2.0.0",
-        "@microsoft/applicationinsights-core-js": "2.7.2-nightly.2111-08",
-        "@microsoft/applicationinsights-common": "2.7.2-nightly.2111-08",
-        "@microsoft/dynamicproto-js": "^1.1.4",
-        "history": "^4.10.1"
+        "@microsoft/applicationinsights-core-js": "2.7.2-nightly.2111-09",
+        "@microsoft/applicationinsights-common": "2.7.2-nightly.2111-09",
+        "@microsoft/dynamicproto-js": "^1.1.4"
     },
     "peerDependencies": {
         "tslib": "*",
-        "react": "^17.0.1"
+        "react": "^17.0.1",
+        "history": ">= 4.10.1"
     },
     "license": "MIT",
     "publishConfig": {

package/rollup.config.js

@@ -0,0 +1,148 @@
+import nodeResolve from "@rollup/plugin-node-resolve";
+import commonjs from "@rollup/plugin-commonjs";
+import replace from "@rollup/plugin-replace";
+import cleanup from "rollup-plugin-cleanup";
+import peerDepsExternal from 'rollup-plugin-peer-deps-external';
+import { uglify } from "../../tools/rollup-plugin-uglify3-js/dist/esm/rollup-plugin-uglify3-js";
+import { es3Poly, importCheck } from "@microsoft/applicationinsights-rollup-es3";
+import dynamicRemove from "@microsoft/dynamicproto-js/tools/rollup/node/removedynamic";
+import { updateDistEsmFiles } from "../../tools/updateDistEsm/updateDistEsm";
+
+const version = require("./package.json").version;
+const outputName = "applicationinsights-react-js";
+const banner = [
+  "/*!",
+  ` * Application Insights JavaScript SDK - React Plugin, ${version}`,
+  " * Copyright (c) Microsoft and contributors. All rights reserved.",
+  " */"
+].join("\n");
+
+const replaceValues = {
+  "// Copyright (c) Microsoft Corporation. All rights reserved.": "",
+  "// Licensed under the MIT License.": ""
+};
+
+function doCleanup() {
+  return cleanup({
+    comments: [
+      'some', 
+      /^.\s*@DynamicProtoStub/i,
+      /^\*\*\s*@class\s*$/
+    ]
+  })
+}
+
+const browserRollupConfigFactory = isProduction => {
+  const browserRollupConfig = {
+    input: `dist-esm/${outputName}.js`,
+    output: {
+      file: `browser/${outputName}.js`,
+      banner: banner,
+      format: "umd",
+      name: "Microsoft.ApplicationInsights",
+      extend: true,
+      freeze: false,
+      sourcemap: true
+    },
+    plugins: [
+      dynamicRemove(),
+      replace({
+        preventAssignment: true,
+        delimiters: ["", ""],
+        values: replaceValues
+      }),
+      importCheck({ exclude: [ "applicationinsights-react-js" ] }),
+      peerDepsExternal(),
+      nodeResolve({
+        browser: true,
+        preferBuiltins: true,
+        dedupe: [ "react", "react-dom" ]
+      }),
+      commonjs(),
+      doCleanup(),
+      es3Poly()
+    ]
+  };
+
+   if (isProduction) {
+    browserRollupConfig.output.file = `browser/${outputName}.min.js`;
+    browserRollupConfig.plugins.push(
+      uglify({
+        ie8: true,
+        toplevel: true,
+        compress: {
+          passes:3,
+          unsafe: true
+        },
+        output: {
+          preamble: banner,
+          webkit:true
+        }
+      })
+    );
+  }
+
+  return browserRollupConfig;
+};
+
+const nodeUmdRollupConfigFactory = (isProduction) => {
+  const nodeRollupConfig = {
+    input: `dist-esm/${outputName}.js`,
+    output: {
+      file: `dist/${outputName}.js`,
+      banner: banner,
+      format: "umd",
+      name: "Microsoft.ApplicationInsights",
+      extend: true,
+      freeze: false,
+      sourcemap: true
+    },
+    plugins: [
+      dynamicRemove(),
+      replace({
+        preventAssignment: true,
+        delimiters: ["", ""],
+        values: replaceValues
+      }),
+      importCheck({ exclude: [ "applicationinsights-react-js" ] }),
+      peerDepsExternal(),
+      nodeResolve({
+        browser: true,
+        preferBuiltins: true,
+        dedupe: [ "react", "react-dom" ]
+      }),
+      commonjs(),
+      doCleanup(),
+      es3Poly()
+    ]
+  };
+
+  if (isProduction) {
+    nodeRollupConfig.output.file = `dist/${outputName}.min.js`;
+    nodeRollupConfig.plugins.push(
+      uglify({
+        ie8: true,
+        toplevel: true,
+        compress: {
+          passes:3,
+          unsafe: true
+        },
+        output: {
+          preamble: banner,
+          webkit:true
+        }
+      })
+    );
+  }
+
+  return nodeRollupConfig;
+};
+
+updateDistEsmFiles(replaceValues, banner);
+
+export default [
+  browserRollupConfigFactory(true),
+  browserRollupConfigFactory(false),
+  nodeUmdRollupConfigFactory(true),
+  nodeUmdRollupConfigFactory(false)
+];

package/src/ReactPlugin.ts

@@ -12,7 +12,7 @@ import {
     ITelemetryPluginChain, _InternalMessageId, LoggingSeverity, ICustomProperties, safeGetCookieMgr, ICookieMgr, arrForEach
 } from "@microsoft/applicationinsights-core-js";
 import { IReactExtensionConfig } from './Interfaces/IReactExtensionConfig';
-import { History, LocationListener, Location, Action } from "history";
+import { History, Location, Action, Update } from "history";
 
 export default class ReactPlugin extends BaseTelemetryPlugin {
     public priority = 185;
@@ -116,10 +116,19 @@ export default class ReactPlugin extends BaseTelemetryPlugin {
 
 
     private addHistoryListener(history: History): void {
-        const locationListener: LocationListener = (location: Location, action: Action): void => {
+        const locationListener = (arg: Location | Update): void => {
+            // v4 of the history API passes "location" as the first argument, while v5 passes an object that contains location and action 
+            let locn: Location = null;
+            if ("location" in arg) {
+                // Looks like v5
+                locn = arg["location"];
+            } else {
+                locn = arg as Location;
+            }
+
             // Timeout to ensure any changes to the DOM made by route changes get included in pageView telemetry
             setTimeout(() => {
-                const pageViewTelemetry: IPageViewTelemetry = { uri: location.pathname };
+                const pageViewTelemetry: IPageViewTelemetry = { uri: locn.pathname };
                 this.trackPageView(pageViewTelemetry);
             }, 500);
         };

package/temp/applicationinsights-react-js.api.md

@@ -0,0 +1,98 @@
+## API Report File for "@microsoft/applicationinsights-react-js"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+import { BaseTelemetryPlugin } from '@microsoft/applicationinsights-core-js';
+import { Context } from 'react';
+import { Dispatch } from 'react';
+import { History as History_2 } from 'history';
+import { IAppInsights } from '@microsoft/applicationinsights-common';
+import { IAppInsightsCore } from '@microsoft/applicationinsights-core-js';
+import { IConfig } from '@microsoft/applicationinsights-common';
+import { IConfiguration } from '@microsoft/applicationinsights-core-js';
+import { ICookieMgr } from '@microsoft/applicationinsights-core-js';
+import { ICustomProperties } from '@microsoft/applicationinsights-core-js';
+import { IEventTelemetry } from '@microsoft/applicationinsights-common';
+import { IExceptionTelemetry } from '@microsoft/applicationinsights-common';
+import { IMetricTelemetry } from '@microsoft/applicationinsights-common';
+import { IPageViewTelemetry } from '@microsoft/applicationinsights-common';
+import { IPlugin } from '@microsoft/applicationinsights-core-js';
+import { IProcessTelemetryContext } from '@microsoft/applicationinsights-core-js';
+import { ITelemetryItem } from '@microsoft/applicationinsights-core-js';
+import { ITelemetryPluginChain } from '@microsoft/applicationinsights-core-js';
+import { ITraceTelemetry } from '@microsoft/applicationinsights-common';
+import * as React_2 from 'react';
+import { default as React_3 } from 'react';
+import { SetStateAction } from 'react';
+
+// Warning: (ae-forgotten-export) The symbol "AppInsightsReactContext" needs to be exported by the entry point applicationinsights-react-js.d.ts
+//
+// @public (undocumented)
+export const AppInsightsContext: AppInsightsReactContext;
+
+// Warning: (ae-forgotten-export) The symbol "IAppInsightsErrorBoundaryProps" needs to be exported by the entry point applicationinsights-react-js.d.ts
+// Warning: (ae-forgotten-export) The symbol "IAppInsightsErrorBoundaryState" needs to be exported by the entry point applicationinsights-react-js.d.ts
+//
+// @public (undocumented)
+export class AppInsightsErrorBoundary extends React_3.Component<IAppInsightsErrorBoundaryProps, IAppInsightsErrorBoundaryState> {
+    // (undocumented)
+    componentDidCatch(error: Error, errorInfo: React_3.ErrorInfo): void;
+    // (undocumented)
+    render(): React_3.ReactNode;
+    // (undocumented)
+    state: {
+        hasError: boolean;
+    };
+}
+
+// @public
+export interface IReactExtensionConfig {
+    readonly history?: History_2;
+}
+
+// @public (undocumented)
+export class ReactPlugin extends BaseTelemetryPlugin {
+    getAppInsights(): IAppInsights;
+    getCookieMgr(): ICookieMgr;
+    // (undocumented)
+    identifier: string;
+    // (undocumented)
+    initialize(config: IConfiguration & IConfig, core: IAppInsightsCore, extensions: IPlugin[], pluginChain?: ITelemetryPluginChain): void;
+    // (undocumented)
+    priority: number;
+    processTelemetry(event: ITelemetryItem, itemCtx?: IProcessTelemetryContext): void;
+    // (undocumented)
+    trackEvent(event: IEventTelemetry, customProperties?: ICustomProperties): void;
+    // (undocumented)
+    trackException(exception: IExceptionTelemetry, customProperties?: {
+        [key: string]: any;
+    }): void;
+    // (undocumented)
+    trackMetric(metric: IMetricTelemetry, customProperties: ICustomProperties): void;
+    // (undocumented)
+    trackPageView(pageView: IPageViewTelemetry): void;
+    // (undocumented)
+    trackTrace(trace: ITraceTelemetry, customProperties?: {
+        [key: string]: any;
+    }): void;
+}
+
+// @public (undocumented)
+export const useAppInsightsContext: () => ReactPlugin;
+
+// Warning: (ae-forgotten-export) The symbol "AIReactCustomEvent" needs to be exported by the entry point applicationinsights-react-js.d.ts
+//
+// @public (undocumented)
+export function useTrackEvent<T>(reactPlugin: ReactPlugin, eventName: string, eventData: T, skipFirstRun?: boolean): AIReactCustomEvent<T>;
+
+// @public (undocumented)
+export const useTrackMetric: (reactPlugin: ReactPlugin, componentName: string) => () => void;
+
+// @public
+export function withAITracking<P>(reactPlugin: ReactPlugin, Component: React_2.ComponentType<P>, componentName?: string, className?: string): React_2.ComponentClass<P>;
+
+// (No @packageDocumentation comment for this package)
+
+```

package/test/AppInsightsErrorBoundary.test.tsx

@@ -0,0 +1,88 @@
+import React from "react";
+import ReactPlugin from "../src/ReactPlugin";
+import AppInsightsErrorBoundary from "../src/AppInsightsErrorBoundary";
+import { TestComponent, ErrorTestComponent } from "./TestComponent";
+import { render} from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+
+let reactPlugin: ReactPlugin;
+let trackExceptionSpy;
+let orgWarn = console && console.warn;
+
+describe("<AppInsightsErrorBoundary />", () => {
+  beforeEach(() => {
+    if (orgWarn) {
+      console.warn = (msg) => { /* Swallow */ }
+    }
+    reactPlugin = new ReactPlugin();
+    trackExceptionSpy = reactPlugin.trackException = jest.fn();
+  });
+
+  afterEach(() => {
+    if (orgWarn) {
+      console.warn = orgWarn;
+    }
+  });
+
+  it("should render a non-erroring component", () => {
+    const aiErrorBoundry = render(
+      <AppInsightsErrorBoundary
+        appInsights={reactPlugin}
+        onError={() => <div></div>}
+      >
+        <TestComponent />
+      </AppInsightsErrorBoundary>
+    );
+    const testComponent = render(<TestComponent />);
+    expect(aiErrorBoundry.container).toEqual(testComponent.container);
+  });
+
+  it("should catch the error and render the alternative component", async () => {
+    const orgError = console && console.error;
+    if (orgError) {
+      console.error = msg => { /* Do Nothing */ };
+    }
+
+    try {
+      const ErrorDisplay = () => <div>Error</div>;
+      const aiErrorBoundry = render(
+        <AppInsightsErrorBoundary
+          appInsights={reactPlugin}
+          onError={ErrorDisplay}
+        >
+          <ErrorTestComponent />
+        </AppInsightsErrorBoundary>
+      );
+      const errorDisplay = render(<ErrorDisplay />);
+      expect(aiErrorBoundry.container).toEqual(errorDisplay.container);
+    } finally {
+      if (orgError) {
+        console.error = orgError;
+      }
+    }
+  });
+
+  it("should catch the error and track exception", async () => {
+    const orgError = console && console.error;
+    if (orgError) {
+      console.error = msg => { /* Do Nothing */ };
+    }
+
+    try {
+      const ErrorDisplay = () => <div>Error</div>;
+      const aiErrorBoundry = render(
+        <AppInsightsErrorBoundary
+          appInsights={reactPlugin}
+          onError={ErrorDisplay}
+        >
+          <ErrorTestComponent />
+        </AppInsightsErrorBoundary>
+      );
+      expect(trackExceptionSpy).toHaveBeenCalledTimes(1);
+    } finally {
+      if (orgError) {
+        console.error = orgError;
+      }
+    }
+  });
+});