From 9fb6a7a6e4b97ca7deaea4c2670d64fd91be29dd Mon Sep 17 00:00:00 2001 From: Spencer Murray Date: Wed, 6 Nov 2024 14:37:33 -0500 Subject: [PATCH 1/2] Add sentry tracing to network requests --- src/background/main.ts | 56 +++++++++++++++++++++--------- src/content/common/sentry.ts | 21 +++++++----- src/content/github/file/main.tsx | 58 ++++++++++++++++---------------- webpack/webpack.common.js | 4 +-- 4 files changed, 84 insertions(+), 55 deletions(-) diff --git a/src/background/main.ts b/src/background/main.ts index 45b6041..06eaaa8 100644 --- a/src/background/main.ts +++ b/src/background/main.ts @@ -6,8 +6,30 @@ import { registerContentScript, unregisterContentScriptIfExists, } from "./dynamic_content_scripts"; +import * as Sentry from "@sentry/browser"; async function main(): Promise { + Sentry.init({ + // @ts-ignore SENTRY_DSN is populated by Webpack at build time + dsn: SENTRY_DSN, + + // This enables automatic instrumentation (highly recommended), + // but is not necessary for purely manual usage + // If you only want to use custom instrumentation: + // * Remove the `BrowserTracing` integration + // * add `Sentry.addTracingExtensions()` above your Sentry.init() call + integrations: [ + Sentry.browserTracingIntegration({ + // disable automatic span creation + instrumentNavigation: false, + instrumentPageLoad: false, + }), + ], + + // We recommend adjusting this value in production, or using tracesSampler + // for finer control + tracesSampleRate: 1.0, + }); browser.runtime.onMessage.addListener(handleMessages); } @@ -16,22 +38,24 @@ async function handleMessages(message: { payload: any; referrer?: string; }) { - switch (message.type) { - case MessageType.FETCH_COMMIT_REPORT: - return Codecov.fetchCommitReport(message.payload, message.referrer!); - case MessageType.FETCH_PR_COMPARISON: - return Codecov.fetchPRComparison(message.payload, message.referrer!); - case MessageType.FETCH_FLAGS_LIST: - return Codecov.listFlags(message.payload, message.referrer!); - case MessageType.FETCH_COMPONENTS_LIST: - return Codecov.listComponents(message.payload, message.referrer!); - case MessageType.CHECK_AUTH: - return Codecov.checkAuth(message.payload); - case MessageType.REGISTER_CONTENT_SCRIPTS: - return registerContentScript(message.payload); - case MessageType.UNREGISTER_CONTENT_SCRIPTS: - return unregisterContentScriptIfExists(message.payload); - } + Sentry.startSpan({ name: message.type }, async () => { + switch (message.type) { + case MessageType.FETCH_COMMIT_REPORT: + return Codecov.fetchCommitReport(message.payload, message.referrer!); + case MessageType.FETCH_PR_COMPARISON: + return Codecov.fetchPRComparison(message.payload, message.referrer!); + case MessageType.FETCH_FLAGS_LIST: + return Codecov.listFlags(message.payload, message.referrer!); + case MessageType.FETCH_COMPONENTS_LIST: + return Codecov.listComponents(message.payload, message.referrer!); + case MessageType.CHECK_AUTH: + return Codecov.checkAuth(message.payload); + case MessageType.REGISTER_CONTENT_SCRIPTS: + return registerContentScript(message.payload); + case MessageType.UNREGISTER_CONTENT_SCRIPTS: + return unregisterContentScriptIfExists(message.payload); + } + }); } main().catch(console.log); diff --git a/src/content/common/sentry.ts b/src/content/common/sentry.ts index 7eaefa4..f0e2f4c 100644 --- a/src/content/common/sentry.ts +++ b/src/content/common/sentry.ts @@ -4,19 +4,24 @@ import { getDefaultIntegrations, makeFetchTransport, Scope, -} from '@sentry/browser'; +} from "@sentry/browser"; // Sentry config -// Browser extensions must initialize Sentry a bit differently to avoid +// Browser extensions must initialize Sentry a bit differently to avoid // conflicts between Sentry instances should the site the extension is running // on also use Sentry. Read more here: // https://docs.sentry.io/platforms/javascript/best-practices/browser-extensions/ -const sentryIntegrations = getDefaultIntegrations({}).filter(defaultIntegration => { - return !['BrowserApiErrors', 'TryCatch', 'Breadcrumbs', 'GlobalHandlers'].includes( - defaultIntegration.name - ); -}); +const sentryIntegrations = getDefaultIntegrations({}).filter( + (defaultIntegration) => { + return ![ + "BrowserApiErrors", + "TryCatch", + "Breadcrumbs", + "GlobalHandlers", + ].includes(defaultIntegration.name); + } +); const sentryClient = new BrowserClient({ // @ts-ignore SENTRY_DSN is populated by Webpack at build time @@ -30,4 +35,4 @@ const Sentry = new Scope(); Sentry.setClient(sentryClient); sentryClient.init(); -export default Sentry +export default Sentry; diff --git a/src/content/github/file/main.tsx b/src/content/github/file/main.tsx index 3857b6d..2060a4e 100644 --- a/src/content/github/file/main.tsx +++ b/src/content/github/file/main.tsx @@ -35,7 +35,7 @@ import { } from "../common/fetchers"; import { print } from "src/utils"; import { isFileUrl } from "../common/utils"; -import Sentry from '../../common/sentry'; +import Sentry from "../../common/sentry"; const globals: { coverageReport?: FileCoverageReport; @@ -47,7 +47,7 @@ const globals: { prompt?: HTMLElement; } = {}; -init() +init(); function init(): Promise { // this event discovered by "reverse-engineering GitHub" @@ -73,10 +73,10 @@ async function main(): Promise { globals.coverageButton = createCoverageButton(); - process(metadata) + process(metadata); } catch (e) { - Sentry.captureException(e) - throw e + Sentry.captureException(e); + throw e; } } @@ -111,17 +111,16 @@ async function process(metadata: FileMetadata): Promise { previousElement: globals.coverageButton!, selectedOptions: selectedFlags, onClick: handleFlagClick, - }) - .then(({ button, list }) => { - globals.flagsButton = button; - globals.flagsDrop = new Drop({ - target: button, - content: list, - classes: "drop-theme-arrows codecov-z1 codecov-bg-white", - position: "bottom right", - openOn: "click", - }); - }) + }).then(({ button, list }) => { + globals.flagsButton = button; + globals.flagsDrop = new Drop({ + target: button, + content: list, + classes: "drop-theme-arrows codecov-z1 codecov-bg-white", + position: "bottom right", + openOn: "click", + }); + }); } const components = await getComponents(metadata); @@ -151,17 +150,16 @@ async function process(metadata: FileMetadata): Promise { previousElement: globals.coverageButton!, onClick: handleComponentClick, selectedOptions: selectedComponents, - }) - .then(({ button, list }) => { - globals.componentsButton = button; - globals.componentsDrop = new Drop({ - target: button, - content: list, - classes: "drop-theme-arrows codecov-z1 codecov-bg-white", - position: "bottom right", - openOn: "click", - }); - }) + }).then(({ button, list }) => { + globals.componentsButton = button; + globals.componentsDrop = new Drop({ + target: button, + content: list, + classes: "drop-theme-arrows codecov-z1 codecov-bg-white", + position: "bottom right", + openOn: "click", + }); + }); } let coverageReportResponses: Array; @@ -241,7 +239,9 @@ async function promptPastReport(metadata: FileMetadata): Promise { const matches = regexp.exec(response.commit_file_url); const commit = matches?.groups?.commit; if (!commit) { - throw new Error("Could not parse commit hash from response for past coverage report") + throw new Error( + "Could not parse commit hash from response for past coverage report" + ); } const link = document.URL.replace( `blob/${metadata.branch}`, @@ -260,7 +260,7 @@ function createPrompt(child: any) { const ref = document.querySelector('[data-testid="latest-commit"]') ?.parentElement?.parentElement; if (!ref) { - throw new Error("Could not find reference element to render prompt") + throw new Error("Could not find reference element to render prompt"); } const prompt =
{child}
; return ref.insertAdjacentElement("afterend", prompt) as HTMLElement; diff --git a/webpack/webpack.common.js b/webpack/webpack.common.js index 80d492a..cc98076 100644 --- a/webpack/webpack.common.js +++ b/webpack/webpack.common.js @@ -50,7 +50,7 @@ module.exports = { browser: "webextensions-polyfill", }), new DefinePlugin({ - SENTRY_DSN: process.env.SENTRY_DSN - }) + SENTRY_DSN: JSON.stringify(process.env.SENTRY_DSN), + }), ], }; From e284f67a21096f0e114f8ad2ba6c82b07230a906 Mon Sep 17 00:00:00 2001 From: Spencer Murray Date: Wed, 6 Nov 2024 14:40:30 -0500 Subject: [PATCH 2/2] Remove comments --- src/background/main.ts | 7 ------- 1 file changed, 7 deletions(-) diff --git a/src/background/main.ts b/src/background/main.ts index 06eaaa8..98c2395 100644 --- a/src/background/main.ts +++ b/src/background/main.ts @@ -13,11 +13,6 @@ async function main(): Promise { // @ts-ignore SENTRY_DSN is populated by Webpack at build time dsn: SENTRY_DSN, - // This enables automatic instrumentation (highly recommended), - // but is not necessary for purely manual usage - // If you only want to use custom instrumentation: - // * Remove the `BrowserTracing` integration - // * add `Sentry.addTracingExtensions()` above your Sentry.init() call integrations: [ Sentry.browserTracingIntegration({ // disable automatic span creation @@ -26,8 +21,6 @@ async function main(): Promise { }), ], - // We recommend adjusting this value in production, or using tracesSampler - // for finer control tracesSampleRate: 1.0, }); browser.runtime.onMessage.addListener(handleMessages);