diff --git a/react/src/index.js b/react/src/index.js index 130973cf4..7b6748bd0 100644 --- a/react/src/index.js +++ b/react/src/index.js @@ -164,18 +164,27 @@ class App extends Component { console.log(`> backendType: ${backendType} | backendUrl: ${BACKEND_URL}`); // These also get passed via request headers (see window.fetch below) + + // NOTE: because the demo extracts tags from the scope in order to pass them + // as headers to the backend, we need to make sure we are calling `setTag()` + // on the current scope. We don't want to call Sentry.setTag() as is usually + // recommended (https://docs.sentry.io/platforms/javascript/enriching-events/scopes/#isolation-scope), + // because that would set the tag on the isolation scope, and make it inaccessible + // when it's time to set the headers. + let currentScope = Sentry.getCurrentScope() + const customerType = [ 'medium-plan', 'large-plan', 'small-plan', 'enterprise', ][Math.floor(Math.random() * 4)]; - Sentry.setTag('customerType', customerType); + currentScope.setTag('customerType', customerType); if (queryParams.get('se')) { // Route components (navigation changes) will now have 'se' tag on scope console.log('> src/index.js se', queryParams.get('se')); - Sentry.setTag('se', queryParams.get('se')); + currentScope.setTag('se', queryParams.get('se')); // for use in Checkout.js when deciding whether to pre-fill form // lasts for as long as the tab is open sessionStorage.setItem('se', queryParams.get('se')); @@ -184,10 +193,10 @@ class App extends Component { if (queryParams.get('frontendSlowdown') === 'true') { console.log('> frontend-only slowdown: true'); FRONTEND_SLOWDOWN = true; - Sentry.setTag('frontendSlowdown', true); + currentScope.setTag('frontendSlowdown', true); } else { console.log('> frontend + backend slowdown'); - Sentry.setTag('frontendSlowdown', false); + currentScope.setTag('frontendSlowdown', false); } if (queryParams.get('rageclick') === 'true') { @@ -201,7 +210,7 @@ class App extends Component { } sessionStorage.removeItem('lastErrorEventId'); - Sentry.setTag('backendType', backendType); + currentScope.setTag('backendType', backendType); let email = null; if (queryParams.get('userEmail')) { @@ -241,7 +250,7 @@ class App extends Component { let c = array[Math.floor(Math.random() * array.length)]; email = a + b + c + '@example.com'; } - Sentry.setUser({ email: email }); + currentScope.setUser({ email: email }); // Automatically append `se`, `customerType` and `userEmail` query params to all requests // (except for requests to Sentry)