@sentry/react - npm Package Compare versions

Comparing version 5.20.1 to 5.21.0

dist/errorboundary.d.ts

@@ -7,4 +7,4 @@ import { ReportDialogOptions, Scope } from '@sentry/browser';
     componentStack: string | null;
+    eventId: string | null;
     resetError(): void;
-    eventId: string | null;
 }) => React.ReactNode;
@@ -56,4 +56,4 @@ export declare type ErrorBoundaryProps = {
 }
-declare function withErrorBoundary<P extends object>(WrappedComponent: React.ComponentType<P>, errorBoundaryOptions: ErrorBoundaryProps): React.FC<P>;
+declare function withErrorBoundary<P extends Record<string, unknown>>(WrappedComponent: React.ComponentType<P>, errorBoundaryOptions: ErrorBoundaryProps): React.FC<P>;
 export { ErrorBoundary, withErrorBoundary };
 //# sourceMappingURL=errorboundary.d.ts.map

dist/errorboundary.js

@@ -44,3 +44,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
             if (showDialog) {
-                browser_1.showReportDialog(tslib_1.__assign({}, dialogOptions, { eventId: eventId }));
+                browser_1.showReportDialog(tslib_1.__assign(tslib_1.__assign({}, dialogOptions), { eventId: eventId }));
             }
@@ -47,0 +47,0 @@ // componentDidCatch is used over getDerivedStateFromError

dist/index.d.ts

@@ -5,3 +5,4 @@ export * from '@sentry/browser';
 export { createReduxEnhancer } from './redux';
-export { reactRouterV3Instrumentation } from './reactrouter';
+export { reactRouterV3Instrumentation } from './reactrouterv3';
+export { reactRouterV4Instrumentation, reactRouterV5Instrumentation, withSentryRouting } from './reactrouter';
 //# sourceMappingURL=index.d.ts.map

dist/index.js

 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var browser_1 = require("@sentry/browser");
+/**
+ * A global side effect that makes sure Sentry events that user
+ * `@sentry/react` will correctly have Sentry events associated
+ * with it.
+ */
 function createReactEventProcessor() {
     if (browser_1.addGlobalEventProcessor) {
         browser_1.addGlobalEventProcessor(function (event) {
-            event.sdk = tslib_1.__assign({}, event.sdk, { name: 'sentry.javascript.react', packages: tslib_1.__spread(((event.sdk && event.sdk.packages) || []), [
+            event.sdk = tslib_1.__assign(tslib_1.__assign({}, event.sdk), { name: 'sentry.javascript.react', packages: tslib_1.__spread(((event.sdk && event.sdk.packages) || []), [
                     {
@@ -27,5 +32,9 @@ name: 'npm:@sentry/react',
 exports.createReduxEnhancer = redux_1.createReduxEnhancer;
+var reactrouterv3_1 = require("./reactrouterv3");
+exports.reactRouterV3Instrumentation = reactrouterv3_1.reactRouterV3Instrumentation;
 var reactrouter_1 = require("./reactrouter");
-exports.reactRouterV3Instrumentation = reactrouter_1.reactRouterV3Instrumentation;
+exports.reactRouterV4Instrumentation = reactrouter_1.reactRouterV4Instrumentation;
+exports.reactRouterV5Instrumentation = reactrouter_1.reactRouterV5Instrumentation;
+exports.withSentryRouting = reactrouter_1.withSentryRouting;
 createReactEventProcessor();
 //# sourceMappingURL=index.js.map

dist/profiler.d.ts

@@ -11,3 +11,3 @@ import { Hub } from '@sentry/browser';
     updateProps: {
-        [key: string]: any;
+        [key: string]: unknown;
     };
@@ -37,3 +37,3 @@ };
  */
-declare function withProfiler<P extends object>(WrappedComponent: React.ComponentType<P>, options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>): React.FC<P>;
+declare function withProfiler<P extends Record<string, unknown>>(WrappedComponent: React.ComponentType<P>, options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>): React.FC<P>;
 /**
@@ -40,0 +40,0 @@ *

dist/profiler.js

 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
+/* eslint-disable @typescript-eslint/no-explicit-any */
 var browser_1 = require("@sentry/browser");
@@ -30,3 +31,2 @@ var utils_1 = require("@sentry/utils");
     }
-    // tslint:disable-next-line:no-unsafe-any
     return globalTracingIntegration.constructor.pushActivity(name, {
@@ -47,3 +47,2 @@ description: "<" + name + ">",
     }
-    // tslint:disable-next-line:no-unsafe-any
     globalTracingIntegration.constructor.popActivity(activity);
@@ -61,3 +60,2 @@ }
     }
-    // tslint:disable-next-line:no-unsafe-any
     return globalTracingIntegration.constructor.getActivitySpan(activity);
@@ -82,5 +80,5 @@ }
         // If they are using @sentry/apm, we need to push/pop activities
-        // tslint:disable-next-line: deprecation
+        // eslint-disable-next-line deprecation/deprecation
         if (getTracingIntegration()) {
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             _this._mountActivity = pushActivity(name, 'mount');
@@ -105,5 +103,5 @@ }
         else {
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             this._mountSpan = getActivitySpan(this._mountActivity);
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             popActivity(this._mountActivity);
@@ -157,2 +155,3 @@ this._mountActivity = null;
     };
+    // eslint-disable-next-line @typescript-eslint/member-ordering
     Profiler.defaultProps = {
@@ -226,2 +225,4 @@ disabled: false,
         };
+        // We only want this to run once.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
@@ -228,0 +229,0 @@ }

dist/reactrouter.d.ts

@@ -1,31 +0,35 @@
-import { Transaction, TransactionContext } from '@sentry/types';
-declare type ReactRouterInstrumentation = <T extends Transaction>(startTransaction: (context: TransactionContext) => T | undefined, startTransactionOnPageLoad?: boolean, startTransactionOnLocationChange?: boolean) => void;
-export declare type Route = {
-    path?: string;
-    childRoutes?: Route[];
+import * as React from 'react';
+import { Action, Location, ReactRouterInstrumentation } from './types';
+declare type Match = {
+    path: string;
+    url: string;
+    params: Record<string, any>;
+    isExact: boolean;
 };
-export declare type Match = (props: {
-    location: Location;
-    routes: Route[];
-}, cb: (error?: Error, _redirectLocation?: Location, renderProps?: {
-    routes?: Route[];
-}) => void) => void;
-declare type Location = {
-    pathname: string;
-    action?: 'PUSH' | 'REPLACE' | 'POP';
+export declare type RouterHistory = {
+    location?: Location;
+    listen?(cb: (location: Location, action: Action) => void): void;
 } & Record<string, any>;
-declare type History = {
+export declare type RouteConfig = {
+    [propName: string]: any;
+    path?: string | string[];
+    exact?: boolean;
+    component?: JSX.Element;
+    routes?: RouteConfig[];
+};
+interface RouteProps {
     location?: Location;
-    listen?(cb: (location: Location) => void): void;
-} & Record<string, any>;
-/**
- * Creates routing instrumentation for React Router v3
- * Works for React Router >= 3.2.0 and < 4.0.0
- *
- * @param history object from the `history` library
- * @param routes a list of all routes, should be
- * @param match `Router.match` utility
- */
-export declare function reactRouterV3Instrumentation(history: History, routes: Route[], match: Match): ReactRouterInstrumentation;
+    component?: React.ComponentType<any> | React.ComponentType<any>;
+    render?: (props: any) => React.ReactNode;
+    children?: ((props: any) => React.ReactNode) | React.ReactNode;
+    path?: string | string[];
+    exact?: boolean;
+    sensitive?: boolean;
+    strict?: boolean;
+}
+declare type MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;
+export declare function reactRouterV4Instrumentation(history: RouterHistory, routes?: RouteConfig[], matchPath?: MatchPath): ReactRouterInstrumentation;
+export declare function reactRouterV5Instrumentation(history: RouterHistory, routes?: RouteConfig[], matchPath?: MatchPath): ReactRouterInstrumentation;
+export declare function withSentryRouting<P extends RouteProps & Record<string, any>>(Route: React.ComponentType<P>): React.FC<P>;
 export {};
 //# sourceMappingURL=reactrouter.d.ts.map

dist/reactrouter.js

 Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
 var utils_1 = require("@sentry/utils");
+var hoist_non_react_statics_1 = tslib_1.__importDefault(require("hoist-non-react-statics"));
+var React = tslib_1.__importStar(require("react"));
+/* eslint-enable @typescript-eslint/no-explicit-any */
 var global = utils_1.getGlobalObject();
-/**
- * Creates routing instrumentation for React Router v3
- * Works for React Router >= 3.2.0 and < 4.0.0
- *
- * @param history object from the `history` library
- * @param routes a list of all routes, should be
- * @param match `Router.match` utility
- */
-function reactRouterV3Instrumentation(history, routes, match) {
+var activeTransaction;
+function reactRouterV4Instrumentation(history, routes, matchPath) {
+    return reactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);
+}
+exports.reactRouterV4Instrumentation = reactRouterV4Instrumentation;
+function reactRouterV5Instrumentation(history, routes, matchPath) {
+    return reactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);
+}
+exports.reactRouterV5Instrumentation = reactRouterV5Instrumentation;
+function reactRouterInstrumentation(history, name, allRoutes, matchPath) {
+    if (allRoutes === void 0) { allRoutes = []; }
+    function getName(pathname) {
+        if (allRoutes === [] || !matchPath) {
+            return pathname;
+        }
+        var branches = matchRoutes(allRoutes, pathname, matchPath);
+        // eslint-disable-next-line @typescript-eslint/prefer-for-of
+        for (var x = 0; x < branches.length; x++) {
+            if (branches[x].match.isExact) {
+                return branches[x].match.path;
+            }
+        }
+        return pathname;
+    }
     return function (startTransaction, startTransactionOnPageLoad, startTransactionOnLocationChange) {
         if (startTransactionOnPageLoad === void 0) { startTransactionOnPageLoad = true; }
         if (startTransactionOnLocationChange === void 0) { startTransactionOnLocationChange = true; }
-        var activeTransaction;
-        var prevName;
         if (startTransactionOnPageLoad && global && global.location) {
-            // Have to use global.location because history.location might not be defined.
-            prevName = normalizeTransactionName(routes, global.location, match);
             activeTransaction = startTransaction({
-                name: prevName,
+                name: getName(global.location.pathname),
                 op: 'pageload',
                 tags: {
-                    'routing.instrumentation': 'react-router-v3',
+                    'routing.instrumentation': name,
                 },
@@ -30,14 +45,12 @@ });
         if (startTransactionOnLocationChange && history.listen) {
-            history.listen(function (location) {
-                if (location.action === 'PUSH') {
+            history.listen(function (location, action) {
+                if (action && (action === 'PUSH' || action === 'POP')) {
                     if (activeTransaction) {
                         activeTransaction.finish();
                     }
-                    var tags = { 'routing.instrumentation': 'react-router-v3' };
-                    if (prevName) {
-                        tags.from = prevName;
-                    }
-                    prevName = normalizeTransactionName(routes, location, match);
+                    var tags = {
+                        'routing.instrumentation': name,
+                    };
                     activeTransaction = startTransaction({
-                        name: prevName,
+                        name: getName(location.pathname),
                         op: 'navigation',
@@ -51,52 +64,41 @@ tags: tags,
 }
-exports.reactRouterV3Instrumentation = reactRouterV3Instrumentation;
 /**
- * Normalize transaction names using `Router.match`
+ * Matches a set of routes to a pathname
+ * Based on implementation from
  */
-function normalizeTransactionName(appRoutes, location, match) {
-    var name = location.pathname;
-    match({
-        location: location,
-        routes: appRoutes,
-    }, function (error, _redirectLocation, renderProps) {
-        if (error || !renderProps) {
-            return name;
+function matchRoutes(routes, pathname, matchPath, branch) {
+    if (branch === void 0) { branch = []; }
+    routes.some(function (route) {
+        var match = route.path
+            ? matchPath(pathname, route)
+            : branch.length
+                ? branch[branch.length - 1].match // use parent match
+                : computeRootMatch(pathname); // use default "root" match
+        if (match) {
+            branch.push({ route: route, match: match });
+            if (route.routes) {
+                matchRoutes(route.routes, pathname, matchPath, branch);
+            }
         }
-        var routePath = getRouteStringFromRoutes(renderProps.routes || []);
-        if (routePath.length === 0 || routePath === '/*') {
-            return name;
-        }
-        name = routePath;
-        return name;
+        return !!match;
     });
-    return name;
+    return branch;
 }
-/**
- * Generate route name from array of routes
- */
-function getRouteStringFromRoutes(routes) {
-    if (!Array.isArray(routes) || routes.length === 0) {
-        return '';
-    }
-    var routesWithPaths = routes.filter(function (route) { return !!route.path; });
-    var index = -1;
-    for (var x = routesWithPaths.length - 1; x >= 0; x--) {
-        var route = routesWithPaths[x];
-        if (route.path && route.path.startsWith('/')) {
-            index = x;
-            break;
+function computeRootMatch(pathname) {
+    return { path: '/', url: '/', params: {}, isExact: pathname === '/' };
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function withSentryRouting(Route) {
+    var componentDisplayName = Route.displayName || Route.name;
+    var WrappedRoute = function (props) {
+        if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {
+            activeTransaction.setName(props.computedMatch.path);
         }
-    }
-    return routesWithPaths
-        .slice(index)
-        .filter(function (_a) {
-        var path = _a.path;
-        return !!path;
-    })
-        .map(function (_a) {
-        var path = _a.path;
-        return path;
-    })
-        .join('');
+        return React.createElement(Route, tslib_1.__assign({}, props));
+    };
+    WrappedRoute.displayName = "sentryRoute(" + componentDisplayName + ")";
+    hoist_non_react_statics_1.default(WrappedRoute, Route);
+    return WrappedRoute;
 }
+exports.withSentryRouting = withSentryRouting;
 //# sourceMappingURL=reactrouter.js.map

dist/redux.d.ts

@@ -12,3 +12,3 @@ import { Scope } from '@sentry/types';
 declare type Unsubscribe = () => void;
-interface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = {}> {
+interface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {
     dispatch: Dispatch<A>;
@@ -26,8 +26,8 @@ getState(): S;
 } ? S extends CombinedState<infer S1> ? {
-    [K in keyof S1]?: S1[K] extends object ? PreloadedState<S1[K]> : S1[K];
+    [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K];
 } : never : {
     [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]>;
 };
-declare type StoreEnhancer<Ext = {}, StateExt = never> = (next: StoreEnhancerStoreCreator<Ext, StateExt>) => StoreEnhancerStoreCreator<Ext, StateExt>;
-declare type StoreEnhancerStoreCreator<Ext = {}, StateExt = never> = <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, preloadedState?: PreloadedState<S>) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
+declare type StoreEnhancer<Ext = Record<string, unknown>, StateExt = never> = (next: StoreEnhancerStoreCreator<Ext, StateExt>) => StoreEnhancerStoreCreator<Ext, StateExt>;
+declare type StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, preloadedState?: PreloadedState<S>) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
 export interface SentryEnhancerOptions {
@@ -34,0 +34,0 @@ /**

dist/redux.js

 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
-// @flow
+/* eslint-disable @typescript-eslint/no-explicit-any */
 var minimal_1 = require("@sentry/minimal");
@@ -10,3 +10,2 @@ var ACTION_BREADCRUMB_CATEGORY = 'redux.action';
     actionTransformer: function (action) { return action; },
-    // tslint:disable-next-line: no-unsafe-any
     stateTransformer: function (state) { return state || null; },
@@ -20,3 +19,3 @@ };
 function createReduxEnhancer(enhancerOptions) {
-    var options = tslib_1.__assign({}, defaultOptions, enhancerOptions);
+    var options = tslib_1.__assign(tslib_1.__assign({}, defaultOptions), enhancerOptions);
     return function (next) { return function (reducer, initialState) {
@@ -28,3 +27,2 @@ var sentryReducer = function (state, action) {
                 var transformedAction = options.actionTransformer(action);
-                // tslint:disable-next-line: strict-type-predicates
                 if (typeof transformedAction !== 'undefined' && transformedAction !== null) {
@@ -39,5 +37,3 @@ scope.addBreadcrumb({
                 var transformedState = options.stateTransformer(newState);
-                // tslint:disable-next-line: strict-type-predicates
                 if (typeof transformedState !== 'undefined' && transformedState !== null) {
-                    // tslint:disable-next-line: no-unsafe-any
                     scope.setContext(STATE_CONTEXT_KEY, transformedState);
@@ -44,0 +40,0 @@ }

esm/errorboundary.d.ts

@@ -7,4 +7,4 @@ import { ReportDialogOptions, Scope } from '@sentry/browser';
     componentStack: string | null;
+    eventId: string | null;
     resetError(): void;
-    eventId: string | null;
 }) => React.ReactNode;
@@ -56,4 +56,4 @@ export declare type ErrorBoundaryProps = {
 }
-declare function withErrorBoundary<P extends object>(WrappedComponent: React.ComponentType<P>, errorBoundaryOptions: ErrorBoundaryProps): React.FC<P>;
+declare function withErrorBoundary<P extends Record<string, unknown>>(WrappedComponent: React.ComponentType<P>, errorBoundaryOptions: ErrorBoundaryProps): React.FC<P>;
 export { ErrorBoundary, withErrorBoundary };
 //# sourceMappingURL=errorboundary.d.ts.map

esm/errorboundary.js

@@ -1,2 +0,2 @@
-import * as tslib_1 from "tslib";
+import { __assign, __extends } from "tslib";
 import { captureException, showReportDialog, withScope } from '@sentry/browser';
@@ -16,3 +16,3 @@ import hoistNonReactStatics from 'hoist-non-react-statics';
 var ErrorBoundary = /** @class */ (function (_super) {
-    tslib_1.__extends(ErrorBoundary, _super);
+    __extends(ErrorBoundary, _super);
     function ErrorBoundary() {
@@ -44,3 +44,3 @@ var _this = _super !== null && _super.apply(this, arguments) || this;
             if (showDialog) {
-                showReportDialog(tslib_1.__assign({}, dialogOptions, { eventId: eventId }));
+                showReportDialog(__assign(__assign({}, dialogOptions), { eventId: eventId }));
             }
@@ -84,4 +84,4 @@ // componentDidCatch is used over getDerivedStateFromError
     var componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
-    var Wrapped = function (props) { return (React.createElement(ErrorBoundary, tslib_1.__assign({}, errorBoundaryOptions),
-        React.createElement(WrappedComponent, tslib_1.__assign({}, props)))); };
+    var Wrapped = function (props) { return (React.createElement(ErrorBoundary, __assign({}, errorBoundaryOptions),
+        React.createElement(WrappedComponent, __assign({}, props)))); };
     Wrapped.displayName = "errorBoundary(" + componentDisplayName + ")";
@@ -88,0 +88,0 @@ // Copy over static methods from Wrapped component to Profiler HOC

esm/index.d.ts

@@ -5,3 +5,4 @@ export * from '@sentry/browser';
 export { createReduxEnhancer } from './redux';
-export { reactRouterV3Instrumentation } from './reactrouter';
+export { reactRouterV3Instrumentation } from './reactrouterv3';
+export { reactRouterV4Instrumentation, reactRouterV5Instrumentation, withSentryRouting } from './reactrouter';
 //# sourceMappingURL=index.d.ts.map

esm/index.js

@@ -1,7 +0,12 @@
-import * as tslib_1 from "tslib";
+import { __assign, __read, __spread } from "tslib";
 import { addGlobalEventProcessor, SDK_VERSION } from '@sentry/browser';
+/**
+ * A global side effect that makes sure Sentry events that user
+ * `@sentry/react` will correctly have Sentry events associated
+ * with it.
+ */
 function createReactEventProcessor() {
     if (addGlobalEventProcessor) {
         addGlobalEventProcessor(function (event) {
-            event.sdk = tslib_1.__assign({}, event.sdk, { name: 'sentry.javascript.react', packages: tslib_1.__spread(((event.sdk && event.sdk.packages) || []), [
+            event.sdk = __assign(__assign({}, event.sdk), { name: 'sentry.javascript.react', packages: __spread(((event.sdk && event.sdk.packages) || []), [
                     {
@@ -20,4 +25,5 @@ name: 'npm:@sentry/react',
 export { createReduxEnhancer } from './redux';
-export { reactRouterV3Instrumentation } from './reactrouter';
+export { reactRouterV3Instrumentation } from './reactrouterv3';
+export { reactRouterV4Instrumentation, reactRouterV5Instrumentation, withSentryRouting } from './reactrouter';
 createReactEventProcessor();
 //# sourceMappingURL=index.js.map

esm/profiler.d.ts

@@ -11,3 +11,3 @@ import { Hub } from '@sentry/browser';
     updateProps: {
-        [key: string]: any;
+        [key: string]: unknown;
     };
@@ -37,3 +37,3 @@ };
  */
-declare function withProfiler<P extends object>(WrappedComponent: React.ComponentType<P>, options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>): React.FC<P>;
+declare function withProfiler<P extends Record<string, unknown>>(WrappedComponent: React.ComponentType<P>, options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>): React.FC<P>;
 /**
@@ -40,0 +40,0 @@ *

esm/profiler.js

@@ -1,2 +0,3 @@
-import * as tslib_1 from "tslib";
+import { __assign, __extends, __read } from "tslib";
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { getCurrentHub } from '@sentry/browser';
@@ -29,3 +30,2 @@ import { timestampWithMs } from '@sentry/utils';
     }
-    // tslint:disable-next-line:no-unsafe-any
     return globalTracingIntegration.constructor.pushActivity(name, {
@@ -46,3 +46,2 @@ description: "<" + name + ">",
     }
-    // tslint:disable-next-line:no-unsafe-any
     globalTracingIntegration.constructor.popActivity(activity);
@@ -60,3 +59,2 @@ }
     }
-    // tslint:disable-next-line:no-unsafe-any
     return globalTracingIntegration.constructor.getActivitySpan(activity);
@@ -69,3 +67,3 @@ }
 var Profiler = /** @class */ (function (_super) {
-    tslib_1.__extends(Profiler, _super);
+    __extends(Profiler, _super);
     function Profiler(props) {
@@ -82,5 +80,5 @@ var _this = _super.call(this, props) || this;
         // If they are using @sentry/apm, we need to push/pop activities
-        // tslint:disable-next-line: deprecation
+        // eslint-disable-next-line deprecation/deprecation
         if (getTracingIntegration()) {
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             _this._mountActivity = pushActivity(name, 'mount');
@@ -105,5 +103,5 @@ }
         else {
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             this._mountSpan = getActivitySpan(this._mountActivity);
-            // tslint:disable-next-line: deprecation
+            // eslint-disable-next-line deprecation/deprecation
             popActivity(this._mountActivity);
@@ -157,2 +155,3 @@ this._mountActivity = null;
     };
+    // eslint-disable-next-line @typescript-eslint/member-ordering
     Profiler.defaultProps = {
@@ -177,4 +176,4 @@ disabled: false,
     var componentDisplayName = (options && options.name) || WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
-    var Wrapped = function (props) { return (React.createElement(Profiler, tslib_1.__assign({}, options, { name: componentDisplayName, updateProps: props }),
-        React.createElement(WrappedComponent, tslib_1.__assign({}, props)))); };
+    var Wrapped = function (props) { return (React.createElement(Profiler, __assign({}, options, { name: componentDisplayName, updateProps: props }),
+        React.createElement(WrappedComponent, __assign({}, props)))); };
     Wrapped.displayName = "profiler(" + componentDisplayName + ")";
@@ -198,3 +197,3 @@ // Copy over static methods from Wrapped component to Profiler HOC
     }; }
-    var _a = tslib_1.__read(React.useState(function () {
+    var _a = __read(React.useState(function () {
         if (options && options.disabled) {
@@ -226,2 +225,4 @@ return undefined;
         };
+        // We only want this to run once.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
@@ -228,0 +229,0 @@ }

esm/reactrouter.d.ts

@@ -1,31 +0,35 @@
-import { Transaction, TransactionContext } from '@sentry/types';
-declare type ReactRouterInstrumentation = <T extends Transaction>(startTransaction: (context: TransactionContext) => T | undefined, startTransactionOnPageLoad?: boolean, startTransactionOnLocationChange?: boolean) => void;
-export declare type Route = {
-    path?: string;
-    childRoutes?: Route[];
+import * as React from 'react';
+import { Action, Location, ReactRouterInstrumentation } from './types';
+declare type Match = {
+    path: string;
+    url: string;
+    params: Record<string, any>;
+    isExact: boolean;
 };
-export declare type Match = (props: {
-    location: Location;
-    routes: Route[];
-}, cb: (error?: Error, _redirectLocation?: Location, renderProps?: {
-    routes?: Route[];
-}) => void) => void;
-declare type Location = {
-    pathname: string;
-    action?: 'PUSH' | 'REPLACE' | 'POP';
+export declare type RouterHistory = {
+    location?: Location;
+    listen?(cb: (location: Location, action: Action) => void): void;
 } & Record<string, any>;
-declare type History = {
+export declare type RouteConfig = {
+    [propName: string]: any;
+    path?: string | string[];
+    exact?: boolean;
+    component?: JSX.Element;
+    routes?: RouteConfig[];
+};
+interface RouteProps {
     location?: Location;
-    listen?(cb: (location: Location) => void): void;
-} & Record<string, any>;
-/**
- * Creates routing instrumentation for React Router v3
- * Works for React Router >= 3.2.0 and < 4.0.0
- *
- * @param history object from the `history` library
- * @param routes a list of all routes, should be
- * @param match `Router.match` utility
- */
-export declare function reactRouterV3Instrumentation(history: History, routes: Route[], match: Match): ReactRouterInstrumentation;
+    component?: React.ComponentType<any> | React.ComponentType<any>;
+    render?: (props: any) => React.ReactNode;
+    children?: ((props: any) => React.ReactNode) | React.ReactNode;
+    path?: string | string[];
+    exact?: boolean;
+    sensitive?: boolean;
+    strict?: boolean;
+}
+declare type MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;
+export declare function reactRouterV4Instrumentation(history: RouterHistory, routes?: RouteConfig[], matchPath?: MatchPath): ReactRouterInstrumentation;
+export declare function reactRouterV5Instrumentation(history: RouterHistory, routes?: RouteConfig[], matchPath?: MatchPath): ReactRouterInstrumentation;
+export declare function withSentryRouting<P extends RouteProps & Record<string, any>>(Route: React.ComponentType<P>): React.FC<P>;
 export {};
 //# sourceMappingURL=reactrouter.d.ts.map

esm/reactrouter.js

@@ -0,25 +1,38 @@
+import { __assign } from "tslib";
 import { getGlobalObject } from '@sentry/utils';
+import hoistNonReactStatics from 'hoist-non-react-statics';
+import * as React from 'react';
+/* eslint-enable @typescript-eslint/no-explicit-any */
 var global = getGlobalObject();
-/**
- * Creates routing instrumentation for React Router v3
- * Works for React Router >= 3.2.0 and < 4.0.0
- *
- * @param history object from the `history` library
- * @param routes a list of all routes, should be
- * @param match `Router.match` utility
- */
-export function reactRouterV3Instrumentation(history, routes, match) {
+var activeTransaction;
+export function reactRouterV4Instrumentation(history, routes, matchPath) {
+    return reactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);
+}
+export function reactRouterV5Instrumentation(history, routes, matchPath) {
+    return reactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);
+}
+function reactRouterInstrumentation(history, name, allRoutes, matchPath) {
+    if (allRoutes === void 0) { allRoutes = []; }
+    function getName(pathname) {
+        if (allRoutes === [] || !matchPath) {
+            return pathname;
+        }
+        var branches = matchRoutes(allRoutes, pathname, matchPath);
+        // eslint-disable-next-line @typescript-eslint/prefer-for-of
+        for (var x = 0; x < branches.length; x++) {
+            if (branches[x].match.isExact) {
+                return branches[x].match.path;
+            }
+        }
+        return pathname;
+    }
     return function (startTransaction, startTransactionOnPageLoad, startTransactionOnLocationChange) {
         if (startTransactionOnPageLoad === void 0) { startTransactionOnPageLoad = true; }
         if (startTransactionOnLocationChange === void 0) { startTransactionOnLocationChange = true; }
-        var activeTransaction;
-        var prevName;
         if (startTransactionOnPageLoad && global && global.location) {
-            // Have to use global.location because history.location might not be defined.
-            prevName = normalizeTransactionName(routes, global.location, match);
             activeTransaction = startTransaction({
-                name: prevName,
+                name: getName(global.location.pathname),
                 op: 'pageload',
                 tags: {
-                    'routing.instrumentation': 'react-router-v3',
+                    'routing.instrumentation': name,
                 },
@@ -29,14 +42,12 @@ });
         if (startTransactionOnLocationChange && history.listen) {
-            history.listen(function (location) {
-                if (location.action === 'PUSH') {
+            history.listen(function (location, action) {
+                if (action && (action === 'PUSH' || action === 'POP')) {
                     if (activeTransaction) {
                         activeTransaction.finish();
                     }
-                    var tags = { 'routing.instrumentation': 'react-router-v3' };
-                    if (prevName) {
-                        tags.from = prevName;
-                    }
-                    prevName = normalizeTransactionName(routes, location, match);
+                    var tags = {
+                        'routing.instrumentation': name,
+                    };
                     activeTransaction = startTransaction({
-                        name: prevName,
+                        name: getName(location.pathname),
                         op: 'navigation',
@@ -51,50 +62,39 @@ tags: tags,
 /**
- * Normalize transaction names using `Router.match`
+ * Matches a set of routes to a pathname
+ * Based on implementation from
  */
-function normalizeTransactionName(appRoutes, location, match) {
-    var name = location.pathname;
-    match({
-        location: location,
-        routes: appRoutes,
-    }, function (error, _redirectLocation, renderProps) {
-        if (error || !renderProps) {
-            return name;
+function matchRoutes(routes, pathname, matchPath, branch) {
+    if (branch === void 0) { branch = []; }
+    routes.some(function (route) {
+        var match = route.path
+            ? matchPath(pathname, route)
+            : branch.length
+                ? branch[branch.length - 1].match // use parent match
+                : computeRootMatch(pathname); // use default "root" match
+        if (match) {
+            branch.push({ route: route, match: match });
+            if (route.routes) {
+                matchRoutes(route.routes, pathname, matchPath, branch);
+            }
         }
-        var routePath = getRouteStringFromRoutes(renderProps.routes || []);
-        if (routePath.length === 0 || routePath === '/*') {
-            return name;
-        }
-        name = routePath;
-        return name;
+        return !!match;
     });
-    return name;
+    return branch;
 }
-/**
- * Generate route name from array of routes
- */
-function getRouteStringFromRoutes(routes) {
-    if (!Array.isArray(routes) || routes.length === 0) {
-        return '';
-    }
-    var routesWithPaths = routes.filter(function (route) { return !!route.path; });
-    var index = -1;
-    for (var x = routesWithPaths.length - 1; x >= 0; x--) {
-        var route = routesWithPaths[x];
-        if (route.path && route.path.startsWith('/')) {
-            index = x;
-            break;
+function computeRootMatch(pathname) {
+    return { path: '/', url: '/', params: {}, isExact: pathname === '/' };
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function withSentryRouting(Route) {
+    var componentDisplayName = Route.displayName || Route.name;
+    var WrappedRoute = function (props) {
+        if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {
+            activeTransaction.setName(props.computedMatch.path);
         }
-    }
-    return routesWithPaths
-        .slice(index)
-        .filter(function (_a) {
-        var path = _a.path;
-        return !!path;
-    })
-        .map(function (_a) {
-        var path = _a.path;
-        return path;
-    })
-        .join('');
+        return React.createElement(Route, __assign({}, props));
+    };
+    WrappedRoute.displayName = "sentryRoute(" + componentDisplayName + ")";
+    hoistNonReactStatics(WrappedRoute, Route);
+    return WrappedRoute;
 }
 //# sourceMappingURL=reactrouter.js.map

esm/redux.d.ts

@@ -12,3 +12,3 @@ import { Scope } from '@sentry/types';
 declare type Unsubscribe = () => void;
-interface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = {}> {
+interface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {
     dispatch: Dispatch<A>;
@@ -26,8 +26,8 @@ getState(): S;
 } ? S extends CombinedState<infer S1> ? {
-    [K in keyof S1]?: S1[K] extends object ? PreloadedState<S1[K]> : S1[K];
+    [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K];
 } : never : {
     [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]>;
 };
-declare type StoreEnhancer<Ext = {}, StateExt = never> = (next: StoreEnhancerStoreCreator<Ext, StateExt>) => StoreEnhancerStoreCreator<Ext, StateExt>;
-declare type StoreEnhancerStoreCreator<Ext = {}, StateExt = never> = <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, preloadedState?: PreloadedState<S>) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
+declare type StoreEnhancer<Ext = Record<string, unknown>, StateExt = never> = (next: StoreEnhancerStoreCreator<Ext, StateExt>) => StoreEnhancerStoreCreator<Ext, StateExt>;
+declare type StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, preloadedState?: PreloadedState<S>) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
 export interface SentryEnhancerOptions {
@@ -34,0 +34,0 @@ /**

esm/redux.js

@@ -1,3 +0,3 @@
-import * as tslib_1 from "tslib";
-// @flow
+import { __assign } from "tslib";
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { configureScope } from '@sentry/minimal';
@@ -9,3 +9,2 @@ var ACTION_BREADCRUMB_CATEGORY = 'redux.action';
     actionTransformer: function (action) { return action; },
-    // tslint:disable-next-line: no-unsafe-any
     stateTransformer: function (state) { return state || null; },
@@ -19,3 +18,3 @@ };
 function createReduxEnhancer(enhancerOptions) {
-    var options = tslib_1.__assign({}, defaultOptions, enhancerOptions);
+    var options = __assign(__assign({}, defaultOptions), enhancerOptions);
     return function (next) { return function (reducer, initialState) {
@@ -27,3 +26,2 @@ var sentryReducer = function (state, action) {
                 var transformedAction = options.actionTransformer(action);
-                // tslint:disable-next-line: strict-type-predicates
                 if (typeof transformedAction !== 'undefined' && transformedAction !== null) {
@@ -38,5 +36,3 @@ scope.addBreadcrumb({
                 var transformedState = options.stateTransformer(newState);
-                // tslint:disable-next-line: strict-type-predicates
                 if (typeof transformedState !== 'undefined' && transformedState !== null) {
-                    // tslint:disable-next-line: no-unsafe-any
                     scope.setContext(STATE_CONTEXT_KEY, transformedState);
@@ -43,0 +39,0 @@ }

package.json

 {
   "name": "@sentry/react",
-  "version": "5.20.1",
+  "version": "5.21.0",
   "description": "Offical Sentry SDK for React.js",
@@ -19,6 +19,6 @@ "repository": "git://github.com/getsentry/sentry-javascript.git",
   "dependencies": {
-    "@sentry/browser": "5.20.1",
-    "@sentry/minimal": "5.20.1",
-    "@sentry/types": "5.20.1",
-    "@sentry/utils": "5.20.1",
+    "@sentry/browser": "5.21.0",
+    "@sentry/minimal": "5.21.0",
+    "@sentry/types": "5.21.0",
+    "@sentry/utils": "5.21.0",
     "hoist-non-react-statics": "^3.3.2",
@@ -32,22 +32,30 @@ "tslib": "^1.9.3"
   "devDependencies": {
+    "@sentry-internal/eslint-config-sdk": "5.21.0",
     "@testing-library/react": "^10.0.6",
     "@testing-library/react-hooks": "^3.3.0",
+    "@types/history-4": "npm:@types/history@4.7.7",
+    "@types/history-5": "npm:@types/history@4.7.7",
     "@types/hoist-non-react-statics": "^3.3.1",
     "@types/react": "^16.9.35",
     "@types/react-router-3": "npm:@types/react-router@3.0.20",
+    "@types/react-router-4": "npm:@types/react-router@5.0.0",
+    "@types/react-router-5": "npm:@types/react-router@5.0.0",
+    "eslint": "7.6.0",
+    "eslint-plugin-react": "^7.20.5",
+    "eslint-plugin-react-hooks": "^4.0.8",
+    "history-4": "npm:history@4.6.0",
+    "history-5": "npm:history@4.9.0",
     "jest": "^24.7.1",
     "jsdom": "^16.2.2",
     "npm-run-all": "^4.1.2",
-    "prettier": "^1.17.0",
-    "prettier-check": "^2.0.0",
+    "prettier": "1.17.0",
     "react": "^16.0.0",
     "react-dom": "^16.0.0",
-    "react-router-3": "npm:react-router@^3.2.0",
+    "react-router-3": "npm:react-router@3.2.0",
+    "react-router-4": "npm:react-router@4.1.0",
+    "react-router-5": "npm:react-router@5.0.0",
     "react-test-renderer": "^16.13.1",
     "redux": "^4.0.5",
     "rimraf": "^2.6.3",
-    "tslint": "5.16.0",
-    "tslint-react": "^5.0.0",
-    "tslint-react-hooks": "^2.2.2",
-    "typescript": "3.4.5"
+    "typescript": "3.6.5"
   },
@@ -63,9 +71,8 @@ "scripts": {
     "link:yarn": "yarn link",
-    "lint": "run-s lint:prettier lint:tslint",
-    "lint:prettier": "prettier-check \"{src,test}/**/*.{ts,tsx}\"",
-    "lint:tslint": "tslint -t stylish -p .",
-    "lint:tslint:json": "tslint --format json -p . | tee lint-results.json",
-    "fix": "run-s fix:tslint fix:prettier",
-    "fix:prettier": "prettier --write \"{src,test}/**/*.{ts,tsx}\"",
-    "fix:tslint": "tslint --fix -t stylish -p .",
+    "lint": "run-s lint:prettier lint:eslint",
+    "lint:prettier": "prettier --check \"{src,test}/**/*.ts\"",
+    "lint:eslint": "eslint . --cache --cache-location '../../eslintcache/' --format stylish",
+    "fix": "run-s fix:eslint fix:prettier",
+    "fix:prettier": "prettier --write \"{src,test}/**/*.ts\"",
+    "fix:eslint": "eslint . --format stylish --fix",
     "test": "jest",
@@ -97,3 +104,5 @@ "test:watch": "jest --watch"
   },
-  "sideEffects": false
+  "sideEffects": [
+    "./src/index.ts"
+  ]
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

188289

increased by23.39%

Number of package files

59

increased by37.21%

Lines of code

1675

increased by20.24%

Worsened metrics

Dev dependency count

28

increased by40%

Dependency changes

• + Added@sentry/browser@5.21.0(transitive)

• + Added@sentry/core@5.21.0(transitive)

• + Added@sentry/hub@5.21.0(transitive)

• + Added@sentry/minimal@5.21.0(transitive)

• + Added@sentry/types@5.21.0(transitive)

• + Added@sentry/utils@5.21.0(transitive)

• - Removed@sentry/browser@5.20.1(transitive)

• - Removed@sentry/core@5.20.1(transitive)

• - Removed@sentry/hub@5.20.1(transitive)

• - Removed@sentry/minimal@5.20.1(transitive)

• - Removed@sentry/types@5.20.1(transitive)

• - Removed@sentry/utils@5.20.1(transitive)

• Updated@sentry/browser@5.21.0

• Updated@sentry/minimal@5.21.0

• Updated@sentry/types@5.21.0

• Updated@sentry/utils@5.21.0