Closed
Description
Is there an existing issue for this?
- I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
- I have reviewed the documentation https://docs.sentry.io/
- I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases
How do you use Sentry?
Self-hosted/on-premise
Which package are you using?
@sentry/react
SDK Version
@sentry/react 6.9.0 @sentry/tracing 6.9.0
Framework Version
Link to Sentry event
No response
Steps to Reproduce
I used the following operations in the single page application I built with webpack and react-router:
Using HOC (Higher Order Component), I used the following code in the APP entry to monitor react application performance。
import React from "react";
import * as Sentry from "@sentry/react";
import { Integrations } from "@sentry/tracing";
const WithSentry = (
WrappedComponent: typeof React.Component
): React.ComponentClass => {
return class WithSeo extends React.PureComponent {
componentDidMount() {
this.initEvent();
}
private initEvent() {
Sentry.init({
dsn: "xxxxxxxxxxxxxxxx",
sampleRate: 1.0,
tracesSampleRate: 0.5,
release: `[email protected]`,
integrations: [
new Integrations.BrowserTracing({
beforeNavigate: (context) => {
return {
...context,
name: location.pathname
.replace(/\/(\d+,+|\d+)+/g, "/:id"),
};
},
}),
],
});
}
render() {
return (
<WrappedComponent {...this.props}>
<Sentry.ErrorBoundary></Sentry.ErrorBoundary>
</WrappedComponent>
);
}
};
};
export default (WrappedComponent: typeof React.Component) =>
Sentry.withProfiler(WithSentry(WrappedComponent));
Expected Result
The actual value of LCP will be larger than FCP