From 6e19d9a2617197a8196d27c026f574d105aa0170 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Mon, 20 Jan 2025 10:09:16 +0100 Subject: [PATCH 01/12] docs(onboarding): add cloudflare onboarding draft --- .../gettingStartedDocs/node/cloudflare.tsx | 308 ++++++++++++++++++ 1 file changed, 308 insertions(+) create mode 100644 static/app/gettingStartedDocs/node/cloudflare.tsx diff --git a/static/app/gettingStartedDocs/node/cloudflare.tsx b/static/app/gettingStartedDocs/node/cloudflare.tsx new file mode 100644 index 00000000000000..57548e30ce752d --- /dev/null +++ b/static/app/gettingStartedDocs/node/cloudflare.tsx @@ -0,0 +1,308 @@ +import {Fragment} from 'react'; + +// import crashReportCallout from 'sentry/components/onboarding/gettingStartedDoc/feedback/crashReportCallout'; +import widgetCallout from 'sentry/components/onboarding/gettingStartedDoc/feedback/widgetCallout'; +import TracePropagationMessage from 'sentry/components/onboarding/gettingStartedDoc/replay/tracePropagationMessage'; +import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import type { + Docs, + DocsParams, + OnboardingConfig, + PlatformOption, +} from 'sentry/components/onboarding/gettingStartedDoc/types'; +import {getUploadSourceMapsStep} from 'sentry/components/onboarding/gettingStartedDoc/utils'; +import { + getCrashReportJavaScriptInstallStep, + getCrashReportModalConfigDescription, + getCrashReportModalIntroduction, + // getFeedbackConfigureDescription, + // getFeedbackSDKSetupSnippet, +} from 'sentry/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding'; +import {getJSMetricsOnboarding} from 'sentry/components/onboarding/gettingStartedDoc/utils/metricsOnboarding'; +import { + getProfilingDocumentHeaderConfigurationStep, + MaybeBrowserProfilingBetaWarning, +} from 'sentry/components/onboarding/gettingStartedDoc/utils/profilingOnboarding'; +import { + // getReplayConfigOptions, + getReplayConfigureDescription, + getReplayVerifyStep, +} from 'sentry/components/onboarding/gettingStartedDoc/utils/replayOnboarding'; +import {featureFlagOnboarding} from 'sentry/gettingStartedDocs/javascript/javascript'; +import {t, tct} from 'sentry/locale'; + +export enum CloudflarePlatform { + CLOUDFLARE_PAGES = 'cloudflare-pages', + CLOUDFLARE_WORKERS = 'cloudflare-workers', +} + +type PlatformOptionKey = 'siblingOption'; + +const platformOptions: Record = { + siblingOption: { + label: t('Cloudflare Platform'), + items: [ + { + label: t('Cloudflare Pages'), + value: CloudflarePlatform.CLOUDFLARE_PAGES, + }, + { + label: t('Cloudflare Workers'), + value: CloudflarePlatform.CLOUDFLARE_WORKERS, + }, + ], + }, +}; + +type PlatformOptions = typeof platformOptions; +type Params = DocsParams; + +const getSentryInitLayout = (_params: Params, siblingOption: string): string => { + if (siblingOption === CloudflarePlatform.CLOUDFLARE_PAGES) { + return `import * as Sentry from "@sentry/cloudflare"; + export const onRequest = [ + // Make sure Sentry is the first middleware + Sentry.sentryPagesPlugin((context) => ({ + dsn: "https://39cee92a7ef4d3bc57dc77944b659ddb@o4508333700677712.ingest.de.sentry.io/4508333717586014", + // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. + // Learn more at + // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate + tracesSampleRate: 1.0, + })), + // Add more middlewares here + ];`; + } + return ` + import * as Sentry from '@sentry/cloudflare'; + export default withSentry( + env => ({ + dsn: "https://39cee92a7ef4d3bc57dc77944b659ddb@o4508333700677712.ingest.de.sentry.io/4508333717586014", + // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. + // Learn more at + // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate + tracesSampleRate: 1.0, + }), + { + async fetch(request, env, ctx) { + return new Response('Hello World!'); + }, + } satisfies ExportedHandler, + ); + `; + + // ` + // Sentry.init({ + // ${siblingOption === VueVersion.VUE2 ? 'Vue,' : 'app,'} + // dsn: "${params.dsn.public}", + // integrations: [${ + // params.isPerformanceSelected + // ? ` + // Sentry.browserTracingIntegration({ router }),` + // : '' + // }${ + // params.isReplaySelected + // ? ` + // Sentry.replayIntegration(${getReplayConfigOptions(params.replayOptions)}),` + // : '' + // }${ + // params.isProfilingSelected + // ? ` + // Sentry.browserProfilingIntegration(),` + // : '' + // } + // ],${ + // params.isPerformanceSelected + // ? ` + // // Tracing + // tracesSampleRate: 1.0, // Capture 100% of the transactions + // // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled + // tracePropagationTargets: ["localhost", /^https:\\/\\/yourserver\\.io\\/api/],` + // : '' + // }${ + // params.isReplaySelected + // ? ` + // // Session Replay + // replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production. + // replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.` + // : '' + // }${ + // params.isProfilingSelected + // ? ` + // // Profiling + // profilesSampleRate: 1.0, // Profile 100% of the transactions. This value is relative to tracesSampleRate` + // : '' + // } + // });`; +}; + +const getInstallConfig = () => [ + { + language: 'bash', + code: [ + { + label: 'npm', + value: 'npm', + language: 'bash', + code: `npm install --save @sentry/cloudflare`, + }, + { + label: 'yarn', + value: 'yarn', + language: 'bash', + code: `yarn add @sentry/cloudflare`, + }, + { + label: 'pnpm', + value: 'pnpm', + language: 'bash', + code: `pnpm add @sentry/cloudflare`, + }, + ], + }, +]; + +const onboarding: OnboardingConfig = { + introduction: params => ( + + +

+ {tct( + 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', + { + strong: , + } + )} +

+ + ), + install: () => [ + { + type: StepType.INSTALL, + description: ( +

+ {tct( + `Install the Sentry Cloudflare SDK as a dependency using [code:npm] or [code:yarn], alongside the Sentry Vue SDK:`, + { + code: , + } + )} +

+ ), + configurations: getInstallConfig(), + }, + ], + configure: params => [ + { + type: StepType.CONFIGURE, + description: tct( + "Initialize Sentry as early as possible in your application's lifecycle, usually your app's entry point ([code:main.ts/js]).", + {code: } + ), + configurations: getSetupConfiguration(params), + }, + getUploadSourceMapsStep({ + guideLink: + 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/sourcemaps/', + ...params, + }), + ], + verify: () => [ + { + type: StepType.VERIFY, + description: t( + "This snippet contains an intentional error and can be used as a test to make sure that everything's working as expected." + ), + configurations: [ + { + language: 'javascript', + code: `myUndefinedFunction();`, + }, + ], + }, + ], + nextSteps: () => [ + // { + // id: 'vue-features', + // name: t('Vue Features'), + // description: t('Learn about our first class integration with the Vue framework.'), + // link: 'https://docs.sentry.io/platforms/javascript/guides/vue/features/', + // }, + ], +}; + +function getSetupConfiguration(params: Params) { + const siblingOption = params.platformOptions.siblingOption; + const sentryInitLayout = getSentryInitLayout(params, siblingOption); + const configuration = [ + { + language: 'javascript', + code: sentryInitLayout, + }, + ...(params.isProfilingSelected + ? [getProfilingDocumentHeaderConfigurationStep()] + : []), + ]; + + return configuration; +} + +const replayOnboarding: OnboardingConfig = { + install: () => [ + { + type: StepType.INSTALL, + description: tct( + 'You need a minimum version 7.27.0 of [code:@sentry/vue] in order to use Session Replay. You do not need to install any additional packages.', + { + code: , + } + ), + configurations: getInstallConfig(), + }, + ], + configure: params => [ + { + type: StepType.CONFIGURE, + description: getReplayConfigureDescription({ + link: 'https://docs.sentry.io/platforms/javascript/guides/vue/session-replay/', + }), + configurations: getSetupConfiguration(params), + additionalInfo: , + }, + ], + verify: getReplayVerifyStep(), + nextSteps: () => [], +}; + +const crashReportOnboarding: OnboardingConfig = { + introduction: () => getCrashReportModalIntroduction(), + install: (params: Params) => getCrashReportJavaScriptInstallStep(params), + configure: () => [ + { + type: StepType.CONFIGURE, + description: getCrashReportModalConfigDescription({ + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/configuration/#crash-report-modal', + }), + additionalInfo: widgetCallout({ + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/#user-feedback-widget', + }), + }, + ], + verify: () => [], + nextSteps: () => [], +}; + +// const profilingOnboarding: OnboardingConfig = { +// ...onboarding, +// introduction: params => , +// }; + +const docs: Docs = { + onboarding, + platformOptions, + replayOnboarding, + customMetricsOnboarding: getJSMetricsOnboarding({getInstallConfig}), + crashReportOnboarding, + featureFlagOnboarding, +}; + +export default docs; From 27e4511ef0d2024bea124336e9cc5db4fdd2a19c Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Tue, 21 Jan 2025 13:49:55 +0100 Subject: [PATCH 02/12] feat(onboarding): split cloudflare onboarding Split into cloudflare workers and pages respectively. --- src/sentry/models/project.py | 4 +- src/sentry/utils/platform_categories.py | 6 +- static/app/data/platformPickerCategories.tsx | 3 + static/app/data/platforms.tsx | 14 + .../gettingStartedDocs/node/cloudflare.tsx | 308 ------------------ .../node/cloudflarepages.tsx | 149 +++++++++ .../node/cloudflareworkers.tsx | 151 +++++++++ static/app/types/project.tsx | 2 + 8 files changed, 324 insertions(+), 313 deletions(-) delete mode 100644 static/app/gettingStartedDocs/node/cloudflare.tsx create mode 100644 static/app/gettingStartedDocs/node/cloudflarepages.tsx create mode 100644 static/app/gettingStartedDocs/node/cloudflareworkers.tsx diff --git a/src/sentry/models/project.py b/src/sentry/models/project.py index f37fb601d68b4f..4f317752004768 100644 --- a/src/sentry/models/project.py +++ b/src/sentry/models/project.py @@ -64,8 +64,6 @@ "apple-macos", "bun", "capacitor", - "cloudflare-pages", - "cloudflare-workers", "cordova", "dart", "deno", @@ -119,6 +117,8 @@ "node", "node-awslambda", "node-azurefunctions", + "node-cloudflarepages", + "node-cloudflareworkers", "node-connect", "node-express", "node-fastify", diff --git a/src/sentry/utils/platform_categories.py b/src/sentry/utils/platform_categories.py index 3baeb173bbb51f..193fe685e17d8e 100644 --- a/src/sentry/utils/platform_categories.py +++ b/src/sentry/utils/platform_categories.py @@ -51,8 +51,6 @@ # When changing this file, make sure to keep sentry/static/app/data/platformCategories.tsx in sync. BACKEND = { "bun", - "cloudflare-pages", - "cloudflare-workers", "deno", "dotnet", "dotnet-aspnet", @@ -78,6 +76,8 @@ "kotlin", "native", "node", + "node-cloudflarepages", + "node-cloudflareworkers", "node-connect", "node-express", "node-fastify", @@ -121,10 +121,10 @@ SERVERLESS = { "dotnet-awslambda", "dotnet-gcpfunctions", - "cloudflare-workers", "node-awslambda", "node-azurefunctions", "node-gcpfunctions", + "node-cloudflareworkers", "python-awslambda", "python-azurefunctions", "python-gcpfunctions", diff --git a/static/app/data/platformPickerCategories.tsx b/static/app/data/platformPickerCategories.tsx index 9d706d400d17ae..f82f32e8e457fc 100644 --- a/static/app/data/platformPickerCategories.tsx +++ b/static/app/data/platformPickerCategories.tsx @@ -73,6 +73,8 @@ const server: Set = new Set([ 'kotlin', 'native', 'node', + 'node-cloudflarepages', + 'node-cloudflareworkers', 'node-connect', 'node-express', 'node-fastify', @@ -144,6 +146,7 @@ const serverless: Set = new Set([ 'node-awslambda', 'node-azurefunctions', 'node-gcpfunctions', + 'node-cloudflareworkers', 'python-awslambda', 'python-gcpfunctions', 'python-serverless', diff --git a/static/app/data/platforms.tsx b/static/app/data/platforms.tsx index 3fd8d5b6880ed8..535d01406740ff 100644 --- a/static/app/data/platforms.tsx +++ b/static/app/data/platforms.tsx @@ -417,6 +417,20 @@ export const platforms: PlatformIntegration[] = [ language: 'node', link: 'https://docs.sentry.io/platforms/javascript/guides/azure-functions/', }, + { + id: 'node-cloudflarepages', + name: 'Cloudflare Pages', + type: 'framework', + language: 'node', + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/', + }, + { + id: 'node-cloudflareworkers', + name: 'Cloudflare Workers', + type: 'framework', + language: 'node', + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/', + }, { id: 'node-connect', name: 'Connect', diff --git a/static/app/gettingStartedDocs/node/cloudflare.tsx b/static/app/gettingStartedDocs/node/cloudflare.tsx deleted file mode 100644 index 57548e30ce752d..00000000000000 --- a/static/app/gettingStartedDocs/node/cloudflare.tsx +++ /dev/null @@ -1,308 +0,0 @@ -import {Fragment} from 'react'; - -// import crashReportCallout from 'sentry/components/onboarding/gettingStartedDoc/feedback/crashReportCallout'; -import widgetCallout from 'sentry/components/onboarding/gettingStartedDoc/feedback/widgetCallout'; -import TracePropagationMessage from 'sentry/components/onboarding/gettingStartedDoc/replay/tracePropagationMessage'; -import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; -import type { - Docs, - DocsParams, - OnboardingConfig, - PlatformOption, -} from 'sentry/components/onboarding/gettingStartedDoc/types'; -import {getUploadSourceMapsStep} from 'sentry/components/onboarding/gettingStartedDoc/utils'; -import { - getCrashReportJavaScriptInstallStep, - getCrashReportModalConfigDescription, - getCrashReportModalIntroduction, - // getFeedbackConfigureDescription, - // getFeedbackSDKSetupSnippet, -} from 'sentry/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding'; -import {getJSMetricsOnboarding} from 'sentry/components/onboarding/gettingStartedDoc/utils/metricsOnboarding'; -import { - getProfilingDocumentHeaderConfigurationStep, - MaybeBrowserProfilingBetaWarning, -} from 'sentry/components/onboarding/gettingStartedDoc/utils/profilingOnboarding'; -import { - // getReplayConfigOptions, - getReplayConfigureDescription, - getReplayVerifyStep, -} from 'sentry/components/onboarding/gettingStartedDoc/utils/replayOnboarding'; -import {featureFlagOnboarding} from 'sentry/gettingStartedDocs/javascript/javascript'; -import {t, tct} from 'sentry/locale'; - -export enum CloudflarePlatform { - CLOUDFLARE_PAGES = 'cloudflare-pages', - CLOUDFLARE_WORKERS = 'cloudflare-workers', -} - -type PlatformOptionKey = 'siblingOption'; - -const platformOptions: Record = { - siblingOption: { - label: t('Cloudflare Platform'), - items: [ - { - label: t('Cloudflare Pages'), - value: CloudflarePlatform.CLOUDFLARE_PAGES, - }, - { - label: t('Cloudflare Workers'), - value: CloudflarePlatform.CLOUDFLARE_WORKERS, - }, - ], - }, -}; - -type PlatformOptions = typeof platformOptions; -type Params = DocsParams; - -const getSentryInitLayout = (_params: Params, siblingOption: string): string => { - if (siblingOption === CloudflarePlatform.CLOUDFLARE_PAGES) { - return `import * as Sentry from "@sentry/cloudflare"; - export const onRequest = [ - // Make sure Sentry is the first middleware - Sentry.sentryPagesPlugin((context) => ({ - dsn: "https://39cee92a7ef4d3bc57dc77944b659ddb@o4508333700677712.ingest.de.sentry.io/4508333717586014", - // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. - // Learn more at - // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate - tracesSampleRate: 1.0, - })), - // Add more middlewares here - ];`; - } - return ` - import * as Sentry from '@sentry/cloudflare'; - export default withSentry( - env => ({ - dsn: "https://39cee92a7ef4d3bc57dc77944b659ddb@o4508333700677712.ingest.de.sentry.io/4508333717586014", - // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. - // Learn more at - // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate - tracesSampleRate: 1.0, - }), - { - async fetch(request, env, ctx) { - return new Response('Hello World!'); - }, - } satisfies ExportedHandler, - ); - `; - - // ` - // Sentry.init({ - // ${siblingOption === VueVersion.VUE2 ? 'Vue,' : 'app,'} - // dsn: "${params.dsn.public}", - // integrations: [${ - // params.isPerformanceSelected - // ? ` - // Sentry.browserTracingIntegration({ router }),` - // : '' - // }${ - // params.isReplaySelected - // ? ` - // Sentry.replayIntegration(${getReplayConfigOptions(params.replayOptions)}),` - // : '' - // }${ - // params.isProfilingSelected - // ? ` - // Sentry.browserProfilingIntegration(),` - // : '' - // } - // ],${ - // params.isPerformanceSelected - // ? ` - // // Tracing - // tracesSampleRate: 1.0, // Capture 100% of the transactions - // // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled - // tracePropagationTargets: ["localhost", /^https:\\/\\/yourserver\\.io\\/api/],` - // : '' - // }${ - // params.isReplaySelected - // ? ` - // // Session Replay - // replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production. - // replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.` - // : '' - // }${ - // params.isProfilingSelected - // ? ` - // // Profiling - // profilesSampleRate: 1.0, // Profile 100% of the transactions. This value is relative to tracesSampleRate` - // : '' - // } - // });`; -}; - -const getInstallConfig = () => [ - { - language: 'bash', - code: [ - { - label: 'npm', - value: 'npm', - language: 'bash', - code: `npm install --save @sentry/cloudflare`, - }, - { - label: 'yarn', - value: 'yarn', - language: 'bash', - code: `yarn add @sentry/cloudflare`, - }, - { - label: 'pnpm', - value: 'pnpm', - language: 'bash', - code: `pnpm add @sentry/cloudflare`, - }, - ], - }, -]; - -const onboarding: OnboardingConfig = { - introduction: params => ( - - -

- {tct( - 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', - { - strong: , - } - )} -

- - ), - install: () => [ - { - type: StepType.INSTALL, - description: ( -

- {tct( - `Install the Sentry Cloudflare SDK as a dependency using [code:npm] or [code:yarn], alongside the Sentry Vue SDK:`, - { - code: , - } - )} -

- ), - configurations: getInstallConfig(), - }, - ], - configure: params => [ - { - type: StepType.CONFIGURE, - description: tct( - "Initialize Sentry as early as possible in your application's lifecycle, usually your app's entry point ([code:main.ts/js]).", - {code: } - ), - configurations: getSetupConfiguration(params), - }, - getUploadSourceMapsStep({ - guideLink: - 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/sourcemaps/', - ...params, - }), - ], - verify: () => [ - { - type: StepType.VERIFY, - description: t( - "This snippet contains an intentional error and can be used as a test to make sure that everything's working as expected." - ), - configurations: [ - { - language: 'javascript', - code: `myUndefinedFunction();`, - }, - ], - }, - ], - nextSteps: () => [ - // { - // id: 'vue-features', - // name: t('Vue Features'), - // description: t('Learn about our first class integration with the Vue framework.'), - // link: 'https://docs.sentry.io/platforms/javascript/guides/vue/features/', - // }, - ], -}; - -function getSetupConfiguration(params: Params) { - const siblingOption = params.platformOptions.siblingOption; - const sentryInitLayout = getSentryInitLayout(params, siblingOption); - const configuration = [ - { - language: 'javascript', - code: sentryInitLayout, - }, - ...(params.isProfilingSelected - ? [getProfilingDocumentHeaderConfigurationStep()] - : []), - ]; - - return configuration; -} - -const replayOnboarding: OnboardingConfig = { - install: () => [ - { - type: StepType.INSTALL, - description: tct( - 'You need a minimum version 7.27.0 of [code:@sentry/vue] in order to use Session Replay. You do not need to install any additional packages.', - { - code: , - } - ), - configurations: getInstallConfig(), - }, - ], - configure: params => [ - { - type: StepType.CONFIGURE, - description: getReplayConfigureDescription({ - link: 'https://docs.sentry.io/platforms/javascript/guides/vue/session-replay/', - }), - configurations: getSetupConfiguration(params), - additionalInfo: , - }, - ], - verify: getReplayVerifyStep(), - nextSteps: () => [], -}; - -const crashReportOnboarding: OnboardingConfig = { - introduction: () => getCrashReportModalIntroduction(), - install: (params: Params) => getCrashReportJavaScriptInstallStep(params), - configure: () => [ - { - type: StepType.CONFIGURE, - description: getCrashReportModalConfigDescription({ - link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/configuration/#crash-report-modal', - }), - additionalInfo: widgetCallout({ - link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/#user-feedback-widget', - }), - }, - ], - verify: () => [], - nextSteps: () => [], -}; - -// const profilingOnboarding: OnboardingConfig = { -// ...onboarding, -// introduction: params => , -// }; - -const docs: Docs = { - onboarding, - platformOptions, - replayOnboarding, - customMetricsOnboarding: getJSMetricsOnboarding({getInstallConfig}), - crashReportOnboarding, - featureFlagOnboarding, -}; - -export default docs; diff --git a/static/app/gettingStartedDocs/node/cloudflarepages.tsx b/static/app/gettingStartedDocs/node/cloudflarepages.tsx new file mode 100644 index 00000000000000..50d637e692c3e3 --- /dev/null +++ b/static/app/gettingStartedDocs/node/cloudflarepages.tsx @@ -0,0 +1,149 @@ +import ExternalLink from 'sentry/components/links/externalLink'; +import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import type { + Docs, + DocsParams, + OnboardingConfig, +} from 'sentry/components/onboarding/gettingStartedDoc/types'; +import {getUploadSourceMapsStep} from 'sentry/components/onboarding/gettingStartedDoc/utils'; +import { + getCrashReportJavaScriptInstallStep, + getCrashReportModalConfigDescription, + getCrashReportModalIntroduction, +} from 'sentry/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding'; +import {t, tct} from 'sentry/locale'; +import {getInstallConfig} from 'sentry/utils/gettingStartedDocs/node'; + +type Params = DocsParams; + +const getSdkConfigureSnippet = () => ` +compatibility_flags = ["nodejs_compat"] +# compatibility_flags = ["nodejs_als"] +`; + +const getSdkSetupSnippet = (params: Params) => ` +import * as Sentry from "@sentry/cloudflare"; + +export const onRequest = [ + // Make sure Sentry is the first middleware + Sentry.sentryPagesPlugin((context) => ({ + dsn: "${params.dsn.public}", + // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. + // Learn more at + // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate + tracesSampleRate: 1.0, + })), + // Add more middlewares here +];`; + +const getVerifySnippet = () => ` +setTimeout(() => { + throw new Error(); +});`; + +const onboarding: OnboardingConfig = { + introduction: () => + tct( + 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', + { + strong: , + } + ), + install: params => [ + { + type: StepType.INSTALL, + description: t('Add the Sentry Cloudflare SDK as a dependency:'), + configurations: getInstallConfig(params, { + basePackage: '@sentry/cloudflare', + }), + }, + ], + configure: params => [ + { + type: StepType.CONFIGURE, + description: t( + "Configuration should happen as early as possible in your application's lifecycle." + ), + configurations: [ + { + description: tct( + "To use the SDK, you'll need to set either the [code:nodejs_compat] or [code:nodejs_als] compatibility flags in your [code:wrangler.toml]. This is because the SDK needs access to the [code:AsyncLocalStorage] API to work correctly.", + { + code: , + } + ), + code: [ + { + label: 'Toml', + value: 'toml', + language: 'toml', + filename: 'wrangler.toml', + code: getSdkConfigureSnippet(), + }, + ], + }, + { + description: tct( + 'To use this SDK, add the [code:sentryPagesPlugin] as [guideLink:middleware to your Cloudflare Pages application]. We recommend adding a [code:functions/_middleware.js] for the middleware setup so that Sentry is initialized for your entire app.', + { + code: , + guideLink: ( + + ), + } + ), + code: [ + { + label: 'JavaScript', + value: 'javascript', + language: 'javascript', + filename: 'functions/_middleware.js', + code: getSdkSetupSnippet(params), + }, + ], + }, + ], + }, + getUploadSourceMapsStep({ + guideLink: + 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/sourcemaps/', + ...params, + }), + ], + verify: () => [ + { + type: StepType.VERIFY, + description: t( + "This snippet contains an intentional error and can be used as a test to make sure that everything's working as expected." + ), + configurations: [ + { + language: 'javascript', + code: getVerifySnippet(), + }, + ], + }, + ], +}; + +const crashReportOnboarding: OnboardingConfig = { + introduction: () => getCrashReportModalIntroduction(), + install: (params: Params) => getCrashReportJavaScriptInstallStep(params), + configure: () => [ + { + type: StepType.CONFIGURE, + description: getCrashReportModalConfigDescription({ + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/configuration/#crash-report-modal', + }), + }, + ], + verify: () => [], + nextSteps: () => [], +}; + +const docs: Docs = { + onboarding, + crashReportOnboarding, +}; + +export default docs; diff --git a/static/app/gettingStartedDocs/node/cloudflareworkers.tsx b/static/app/gettingStartedDocs/node/cloudflareworkers.tsx new file mode 100644 index 00000000000000..a38ede01a14699 --- /dev/null +++ b/static/app/gettingStartedDocs/node/cloudflareworkers.tsx @@ -0,0 +1,151 @@ +import ExternalLink from 'sentry/components/links/externalLink'; +import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import type { + Docs, + DocsParams, + OnboardingConfig, +} from 'sentry/components/onboarding/gettingStartedDoc/types'; +import {getUploadSourceMapsStep} from 'sentry/components/onboarding/gettingStartedDoc/utils'; +import { + getCrashReportJavaScriptInstallStep, + getCrashReportModalConfigDescription, + getCrashReportModalIntroduction, +} from 'sentry/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding'; +import {t, tct} from 'sentry/locale'; +import {getInstallConfig} from 'sentry/utils/gettingStartedDocs/node'; + +type Params = DocsParams; + +const getSdkConfigureSnippet = () => ` +compatibility_flags = ["nodejs_compat"] +# compatibility_flags = ["nodejs_als"] +`; + +const getSdkSetupSnippet = (params: Params) => ` +import {withSentry} from "@sentry/cloudflare"; + +export default withSentry( + env => ({ + dsn: "${params.dsn.public}", + // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. + // Learn more at + // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate + tracesSampleRate: 1.0, + }), + { + async fetch(request, env, ctx) { + return new Response('Hello World!'); + }, + } satisfies ExportedHandler, +);`; + +const getVerifySnippet = () => ` +setTimeout(() => { + throw new Error(); +});`; + +const onboarding: OnboardingConfig = { + introduction: () => + tct( + 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', + { + strong: , + } + ), + install: params => [ + { + type: StepType.INSTALL, + description: t('Add the Sentry Cloudflare SDK as a dependency:'), + configurations: getInstallConfig(params, { + basePackage: '@sentry/cloudflare', + }), + }, + ], + configure: params => [ + { + type: StepType.CONFIGURE, + description: t( + "Configuration should happen as early as possible in your application's lifecycle." + ), + configurations: [ + { + description: tct( + "To use the SDK, you'll need to set either the [code:nodejs_compat] or [code:nodejs_als] compatibility flags in your [code:wrangler.toml]. This is because the SDK needs access to the [code:AsyncLocalStorage] API to work correctly.", + { + code: , + } + ), + code: [ + { + label: 'Toml', + value: 'toml', + language: 'toml', + filename: 'wrangler.toml', + code: getSdkConfigureSnippet(), + }, + ], + }, + { + description: tct( + 'To use this SDK, wrap your handler with the [code:withSentry] function. This will initialize the SDK and hook into the environment. Note that you can turn off almost all side effects using the respective options.', + { + code: , + guideLink: ( + + ), + } + ), + code: [ + { + label: 'TypeScript', + value: 'typescript', + language: 'typescript', + code: getSdkSetupSnippet(params), + }, + ], + }, + ], + }, + getUploadSourceMapsStep({ + guideLink: + 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/sourcemaps/', + ...params, + }), + ], + verify: () => [ + { + type: StepType.VERIFY, + description: t( + "This snippet contains an intentional error and can be used as a test to make sure that everything's working as expected." + ), + configurations: [ + { + language: 'javascript', + code: getVerifySnippet(), + }, + ], + }, + ], +}; + +const crashReportOnboarding: OnboardingConfig = { + introduction: () => getCrashReportModalIntroduction(), + install: (params: Params) => getCrashReportJavaScriptInstallStep(params), + configure: () => [ + { + type: StepType.CONFIGURE, + description: getCrashReportModalConfigDescription({ + link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/user-feedback/configuration/#crash-report-modal', + }), + }, + ], + verify: () => [], + nextSteps: () => [], +}; + +const docs: Docs = { + onboarding, + crashReportOnboarding, +}; + +export default docs; diff --git a/static/app/types/project.tsx b/static/app/types/project.tsx index 87a837ec86201b..41aaf8ca7b3724 100644 --- a/static/app/types/project.tsx +++ b/static/app/types/project.tsx @@ -238,6 +238,8 @@ export type PlatformKey = | 'node' | 'node-awslambda' | 'node-azurefunctions' + | 'node-cloudflarepages' + | 'node-cloudflareworkers' | 'node-connect' | 'node-express' | 'node-fastify' From 8447b1ce303003ffcc4887b27ea8e466b0403790 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Tue, 21 Jan 2025 16:28:30 +0100 Subject: [PATCH 03/12] ref(onboarding): renamed cloudflare platforms to use dash --- src/sentry/models/project.py | 4 ++-- src/sentry/utils/platform_categories.py | 6 +++--- static/app/data/platformPickerCategories.tsx | 6 +++--- static/app/data/platforms.tsx | 4 ++-- .../node/{cloudflarepages.tsx => cloudflare-pages.tsx} | 0 .../node/{cloudflareworkers.tsx => cloudflare-workers.tsx} | 0 static/app/types/project.tsx | 4 ++-- 7 files changed, 12 insertions(+), 12 deletions(-) rename static/app/gettingStartedDocs/node/{cloudflarepages.tsx => cloudflare-pages.tsx} (100%) rename static/app/gettingStartedDocs/node/{cloudflareworkers.tsx => cloudflare-workers.tsx} (100%) diff --git a/src/sentry/models/project.py b/src/sentry/models/project.py index 4f317752004768..25f3022b258801 100644 --- a/src/sentry/models/project.py +++ b/src/sentry/models/project.py @@ -117,8 +117,8 @@ "node", "node-awslambda", "node-azurefunctions", - "node-cloudflarepages", - "node-cloudflareworkers", + "node-cloudflare-pages", + "node-cloudflare-workers", "node-connect", "node-express", "node-fastify", diff --git a/src/sentry/utils/platform_categories.py b/src/sentry/utils/platform_categories.py index 193fe685e17d8e..dc3b6b09ef5115 100644 --- a/src/sentry/utils/platform_categories.py +++ b/src/sentry/utils/platform_categories.py @@ -76,8 +76,8 @@ "kotlin", "native", "node", - "node-cloudflarepages", - "node-cloudflareworkers", + "node-cloudflare-pages", + "node-cloudflare-workers", "node-connect", "node-express", "node-fastify", @@ -124,7 +124,7 @@ "node-awslambda", "node-azurefunctions", "node-gcpfunctions", - "node-cloudflareworkers", + "node-cloudflare-workers", "python-awslambda", "python-azurefunctions", "python-gcpfunctions", diff --git a/static/app/data/platformPickerCategories.tsx b/static/app/data/platformPickerCategories.tsx index f82f32e8e457fc..4d5123340621fe 100644 --- a/static/app/data/platformPickerCategories.tsx +++ b/static/app/data/platformPickerCategories.tsx @@ -73,8 +73,8 @@ const server: Set = new Set([ 'kotlin', 'native', 'node', - 'node-cloudflarepages', - 'node-cloudflareworkers', + 'node-cloudflare-pages', + 'node-cloudflare-workers', 'node-connect', 'node-express', 'node-fastify', @@ -146,7 +146,7 @@ const serverless: Set = new Set([ 'node-awslambda', 'node-azurefunctions', 'node-gcpfunctions', - 'node-cloudflareworkers', + 'node-cloudflare-workers', 'python-awslambda', 'python-gcpfunctions', 'python-serverless', diff --git a/static/app/data/platforms.tsx b/static/app/data/platforms.tsx index 535d01406740ff..248630191af85f 100644 --- a/static/app/data/platforms.tsx +++ b/static/app/data/platforms.tsx @@ -418,14 +418,14 @@ export const platforms: PlatformIntegration[] = [ link: 'https://docs.sentry.io/platforms/javascript/guides/azure-functions/', }, { - id: 'node-cloudflarepages', + id: 'node-cloudflare-pages', name: 'Cloudflare Pages', type: 'framework', language: 'node', link: 'https://docs.sentry.io/platforms/javascript/guides/cloudflare/', }, { - id: 'node-cloudflareworkers', + id: 'node-cloudflare-workers', name: 'Cloudflare Workers', type: 'framework', language: 'node', diff --git a/static/app/gettingStartedDocs/node/cloudflarepages.tsx b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx similarity index 100% rename from static/app/gettingStartedDocs/node/cloudflarepages.tsx rename to static/app/gettingStartedDocs/node/cloudflare-pages.tsx diff --git a/static/app/gettingStartedDocs/node/cloudflareworkers.tsx b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx similarity index 100% rename from static/app/gettingStartedDocs/node/cloudflareworkers.tsx rename to static/app/gettingStartedDocs/node/cloudflare-workers.tsx diff --git a/static/app/types/project.tsx b/static/app/types/project.tsx index 41aaf8ca7b3724..e2b2f8afc1f1ea 100644 --- a/static/app/types/project.tsx +++ b/static/app/types/project.tsx @@ -238,8 +238,8 @@ export type PlatformKey = | 'node' | 'node-awslambda' | 'node-azurefunctions' - | 'node-cloudflarepages' - | 'node-cloudflareworkers' + | 'node-cloudflare-pages' + | 'node-cloudflare-workers' | 'node-connect' | 'node-express' | 'node-fastify' From 9e821d53ba4999a7cbb7a1a0c01acedcc52e81b6 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Tue, 21 Jan 2025 16:40:37 +0100 Subject: [PATCH 04/12] build(onboarding): bump platformIcons to 7.0.4 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8d650e48337788..ec13225d8dab13 100644 --- a/package.json +++ b/package.json @@ -138,7 +138,7 @@ "moment-timezone": "0.5.44", "papaparse": "^5.3.2", "peggy": "^4.1.1", - "platformicons": "^7.0.1", + "platformicons": "^7.0.4", "po-catalog-loader": "2.1.0", "prettier": "3.3.2", "prismjs": "^1.29.0", From 0e0c02aebca72d68a1ddd331791ed0caa2b307ab Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Wed, 22 Jan 2025 10:59:24 +0100 Subject: [PATCH 05/12] build(onboarding): update yarn.lock --- yarn.lock | 49 ++++++++++++++++++++++++++++++++++--------------- 1 file changed, 34 insertions(+), 15 deletions(-) diff --git a/yarn.lock b/yarn.lock index dade0f4618f4c7..f2f20a7a167728 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4000,7 +4000,14 @@ dependencies: "@types/node" "*" -"@types/node@*", "@types/node@>=10.0.0", "@types/node@^22.9.1": +"@types/node@*": + version "22.10.7" + resolved "https://registry.yarnpkg.com/@types/node/-/node-22.10.7.tgz#14a1ca33fd0ebdd9d63593ed8d3fbc882a6d28d7" + integrity sha512-V09KvXxFiutGp6B7XkpaDXlNadZxrzajcY50EuoLIpQ6WWYCSvf19lVIazzfIzQvhUN2HjX12spLojTnhuKlGg== + dependencies: + undici-types "~6.20.0" + +"@types/node@>=10.0.0", "@types/node@^22.9.1": version "22.9.1" resolved "https://registry.yarnpkg.com/@types/node/-/node-22.9.1.tgz#bdf91c36e0e7ecfb7257b2d75bf1b206b308ca71" integrity sha512-p8Yy/8sw1caA8CdRIQBG5tiLHmxtQKObCijiAa9Ez+d4+PRffM4054xbju0msf+cvhJpnFEeNjxmVT/0ipktrg== @@ -4050,9 +4057,9 @@ integrity sha512-ZTaqn/qSqUuAq1YwvOFQfVW1AR/oQJlLSZVustdjwI+GZ8kr0MSHBj0tsXPW1EqHubx50gtBEjbPGsdZwQwCjQ== "@types/prop-types@*": - version "15.7.4" - resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11" - integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ== + version "15.7.14" + resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.14.tgz#1433419d73b2a7ebfc6918dcefd2ec0d5cd698f2" + integrity sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ== "@types/qs@*": version "6.9.16" @@ -4132,7 +4139,14 @@ "@types/prop-types" "*" "@types/react" "*" -"@types/react@*", "@types/react@18.2.55", "@types/react@>=16": +"@types/react@*": + version "19.0.7" + resolved "https://registry.yarnpkg.com/@types/react/-/react-19.0.7.tgz#c451968b999d1cb2d9207dc5ff56496164cf511d" + integrity sha512-MoFsEJKkAtZCrC1r6CM8U22GzhG7u2Wir8ons/aCKH6MBdD1ibV24zOSSkdZVUKqN5i396zG5VKLYZ3yaUZdLA== + dependencies: + csstype "^3.0.2" + +"@types/react@18.2.55", "@types/react@>=16": version "18.2.55" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.55.tgz#38141821b7084404b5013742bc4ae08e44da7a67" integrity sha512-Y2Tz5P4yz23brwm2d7jNon39qoAtMMmalOQv6+fEFt1mT+FcM3D841wDpoUvFXhaYenuROCy3FZYqdTjM7qVyA== @@ -4152,9 +4166,9 @@ integrity sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow== "@types/scheduler@*": - version "0.16.2" - resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39" - integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew== + version "0.23.0" + resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.23.0.tgz#0a6655b3e2708eaabca00b7372fafd7a792a7b09" + integrity sha512-YIoDCTH3Af6XM5VuwGG/QL/CJqga1Zm3NkU3HZ4ZHK2fRMPYP1VczsTUqtsf43PH/iJNVlPHAo2oWX7BSdB2Hw== "@types/scroll-to-element@^2.0.2": version "2.0.2" @@ -5846,9 +5860,9 @@ cssstyle@^2.3.0: cssom "~0.3.6" csstype@^3.0.2: - version "3.0.8" - resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.8.tgz#d2266a792729fb227cd216fb572f43728e1ad340" - integrity sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw== + version "3.1.3" + resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81" + integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw== data-urls@^3.0.2: version "3.0.2" @@ -9900,10 +9914,10 @@ platform@^1.3.3: resolved "https://registry.yarnpkg.com/platform/-/platform-1.3.6.tgz#48b4ce983164b209c2d45a107adb31f473a6e7a7" integrity sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg== -platformicons@^7.0.1: - version "7.0.1" - resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.1.tgz#eaf6a1e18fe8516b135df458ed603c4554ae050f" - integrity sha512-M/aNCZw4RJ8yIhkFBFhoQtOYgvwn+99upggQYy7BSaQxKaGS3Yb5/c1qC8+lKqzWWMZ+uafFOpEK6jLFPIkpww== +platformicons@^7.0.4: + version "7.0.4" + resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.4.tgz#1e5df8b79478e11381dced9df45e129da172f89e" + integrity sha512-ld6YQ8CwUYScEp9qUW34tHq68nguzS7tTIYAW6TV64h/v8G1FqlKJ2eUZXMK/BSds8Vs+buV06NZX1r3Wm1kiw== dependencies: "@types/node" "*" "@types/react" "*" @@ -11925,6 +11939,11 @@ undici-types@~6.19.8: resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.19.8.tgz#35111c9d1437ab83a7cdc0abae2f26d88eda0a02" integrity sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw== +undici-types@~6.20.0: + version "6.20.0" + resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.20.0.tgz#8171bf22c1f588d1554d55bf204bc624af388433" + integrity sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg== + undici@^5.25.4: version "5.28.4" resolved "https://registry.yarnpkg.com/undici/-/undici-5.28.4.tgz#6b280408edb6a1a604a9b20340f45b422e373068" From 8402d4ad94c9aba08455b9f5eada345778c25e6c Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Wed, 22 Jan 2025 17:15:50 +0100 Subject: [PATCH 06/12] test(onboarding): add tests for cloudflare onboarding --- .../node/cloudflare-pages.spec.tsx | 40 ++++++++++++++ .../node/cloudflare-workers.spec.tsx | 53 +++++++++++++++++++ 2 files changed, 93 insertions(+) create mode 100644 static/app/gettingStartedDocs/node/cloudflare-pages.spec.tsx create mode 100644 static/app/gettingStartedDocs/node/cloudflare-workers.spec.tsx diff --git a/static/app/gettingStartedDocs/node/cloudflare-pages.spec.tsx b/static/app/gettingStartedDocs/node/cloudflare-pages.spec.tsx new file mode 100644 index 00000000000000..01560fa5c7a1c3 --- /dev/null +++ b/static/app/gettingStartedDocs/node/cloudflare-pages.spec.tsx @@ -0,0 +1,40 @@ +import {renderWithOnboardingLayout} from 'sentry-test/onboarding/renderWithOnboardingLayout'; +import {screen} from 'sentry-test/reactTestingLibrary'; +import {textWithMarkupMatcher} from 'sentry-test/utils'; + +import {ProductSolution} from 'sentry/components/onboarding/gettingStartedDoc/types'; + +import docs from './cloudflare-pages'; + +describe('express onboarding docs', function () { + it('renders onboarding docs correctly', () => { + renderWithOnboardingLayout(docs); + + // Renders main headings + expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Upload Source Maps'})).toBeInTheDocument(); + + // Includes import statement + const allMatches = screen.getAllByText( + textWithMarkupMatcher(/import \* as Sentry from "@sentry\/cloudflare"/) + ); + allMatches.forEach(match => { + expect(match).toBeInTheDocument(); + }); + }); + + it('displays sample rates by default', () => { + renderWithOnboardingLayout(docs, { + selectedProducts: [ + ProductSolution.ERROR_MONITORING, + ProductSolution.PERFORMANCE_MONITORING, + ProductSolution.PROFILING, + ], + }); + + expect( + screen.getByText(textWithMarkupMatcher(/tracesSampleRate/)) + ).toBeInTheDocument(); + }); +}); diff --git a/static/app/gettingStartedDocs/node/cloudflare-workers.spec.tsx b/static/app/gettingStartedDocs/node/cloudflare-workers.spec.tsx new file mode 100644 index 00000000000000..505e487aa2b372 --- /dev/null +++ b/static/app/gettingStartedDocs/node/cloudflare-workers.spec.tsx @@ -0,0 +1,53 @@ +import {renderWithOnboardingLayout} from 'sentry-test/onboarding/renderWithOnboardingLayout'; +import {screen} from 'sentry-test/reactTestingLibrary'; +import {textWithMarkupMatcher} from 'sentry-test/utils'; + +import {ProductSolution} from 'sentry/components/onboarding/gettingStartedDoc/types'; + +import docs from './cloudflare-workers'; + +describe('express onboarding docs', function () { + it('renders onboarding docs correctly', () => { + renderWithOnboardingLayout(docs); + + // Renders main headings + expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Upload Source Maps'})).toBeInTheDocument(); + + // Includes import statement + const allMatches = screen.getAllByText( + textWithMarkupMatcher(/import \* as Sentry from "@sentry\/cloudflare"/) + ); + allMatches.forEach(match => { + expect(match).toBeInTheDocument(); + }); + }); + + it('displays sample rates by default', () => { + renderWithOnboardingLayout(docs, { + selectedProducts: [ + ProductSolution.ERROR_MONITORING, + ProductSolution.PERFORMANCE_MONITORING, + ProductSolution.PROFILING, + ], + }); + + expect( + screen.getByText(textWithMarkupMatcher(/tracesSampleRate/)) + ).toBeInTheDocument(); + }); + + it('enables performance setting the tracesSampleRate to 1', () => { + renderWithOnboardingLayout(docs, { + selectedProducts: [ + ProductSolution.ERROR_MONITORING, + ProductSolution.PERFORMANCE_MONITORING, + ], + }); + + expect( + screen.getByText(textWithMarkupMatcher(/tracesSampleRate: 1\.0/)) + ).toBeInTheDocument(); + }); +}); From e36c60ceceb5f257b1da420ed02e26ff3f5e55fc Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Wed, 22 Jan 2025 17:16:21 +0100 Subject: [PATCH 07/12] fix(onboarding): small adjustments to onboarding --- static/app/gettingStartedDocs/node/cloudflare-pages.tsx | 2 +- static/app/gettingStartedDocs/node/cloudflare-workers.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx index 50d637e692c3e3..c935a65922ee94 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx @@ -84,7 +84,7 @@ const onboarding: OnboardingConfig = { }, { description: tct( - 'To use this SDK, add the [code:sentryPagesPlugin] as [guideLink:middleware to your Cloudflare Pages application]. We recommend adding a [code:functions/_middleware.js] for the middleware setup so that Sentry is initialized for your entire app.', + 'Add the [code:sentryPagesPlugin] as [guideLink:middleware to your Cloudflare Pages application]. We recommend adding a [code:functions/_middleware.js] for the middleware setup so that Sentry is initialized for your entire app.', { code: , guideLink: ( diff --git a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx index a38ede01a14699..be5c6c6718fb68 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx @@ -22,9 +22,9 @@ compatibility_flags = ["nodejs_compat"] `; const getSdkSetupSnippet = (params: Params) => ` -import {withSentry} from "@sentry/cloudflare"; +import * as Sentry from "@sentry/cloudflare"; -export default withSentry( +export default Sentry.withSentry( env => ({ dsn: "${params.dsn.public}", // Set tracesSampleRate to 1.0 to capture 100% of spans for tracing. From edda4184487d34e158cad109f62d341486ef2ad8 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Thu, 23 Jan 2025 08:43:40 +0100 Subject: [PATCH 08/12] revert build(onboarding): update yarn.lock This reverts commit 0e0c02aebca72d68a1ddd331791ed0caa2b307ab. --- yarn.lock | 49 +++++++++++++++---------------------------------- 1 file changed, 15 insertions(+), 34 deletions(-) diff --git a/yarn.lock b/yarn.lock index 9e9b576a85bc00..ae8573970300c3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3976,14 +3976,7 @@ dependencies: "@types/node" "*" -"@types/node@*": - version "22.10.7" - resolved "https://registry.yarnpkg.com/@types/node/-/node-22.10.7.tgz#14a1ca33fd0ebdd9d63593ed8d3fbc882a6d28d7" - integrity sha512-V09KvXxFiutGp6B7XkpaDXlNadZxrzajcY50EuoLIpQ6WWYCSvf19lVIazzfIzQvhUN2HjX12spLojTnhuKlGg== - dependencies: - undici-types "~6.20.0" - -"@types/node@>=10.0.0", "@types/node@^22.9.1": +"@types/node@*", "@types/node@>=10.0.0", "@types/node@^22.9.1": version "22.9.1" resolved "https://registry.yarnpkg.com/@types/node/-/node-22.9.1.tgz#bdf91c36e0e7ecfb7257b2d75bf1b206b308ca71" integrity sha512-p8Yy/8sw1caA8CdRIQBG5tiLHmxtQKObCijiAa9Ez+d4+PRffM4054xbju0msf+cvhJpnFEeNjxmVT/0ipktrg== @@ -4038,9 +4031,9 @@ integrity sha512-ZTaqn/qSqUuAq1YwvOFQfVW1AR/oQJlLSZVustdjwI+GZ8kr0MSHBj0tsXPW1EqHubx50gtBEjbPGsdZwQwCjQ== "@types/prop-types@*": - version "15.7.14" - resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.14.tgz#1433419d73b2a7ebfc6918dcefd2ec0d5cd698f2" - integrity sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ== + version "15.7.4" + resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11" + integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ== "@types/qs@*": version "6.9.18" @@ -4120,14 +4113,7 @@ "@types/prop-types" "*" "@types/react" "*" -"@types/react@*": - version "19.0.7" - resolved "https://registry.yarnpkg.com/@types/react/-/react-19.0.7.tgz#c451968b999d1cb2d9207dc5ff56496164cf511d" - integrity sha512-MoFsEJKkAtZCrC1r6CM8U22GzhG7u2Wir8ons/aCKH6MBdD1ibV24zOSSkdZVUKqN5i396zG5VKLYZ3yaUZdLA== - dependencies: - csstype "^3.0.2" - -"@types/react@18.2.55", "@types/react@>=16": +"@types/react@*", "@types/react@18.2.55", "@types/react@>=16": version "18.2.55" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.55.tgz#38141821b7084404b5013742bc4ae08e44da7a67" integrity sha512-Y2Tz5P4yz23brwm2d7jNon39qoAtMMmalOQv6+fEFt1mT+FcM3D841wDpoUvFXhaYenuROCy3FZYqdTjM7qVyA== @@ -4147,9 +4133,9 @@ integrity sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow== "@types/scheduler@*": - version "0.23.0" - resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.23.0.tgz#0a6655b3e2708eaabca00b7372fafd7a792a7b09" - integrity sha512-YIoDCTH3Af6XM5VuwGG/QL/CJqga1Zm3NkU3HZ4ZHK2fRMPYP1VczsTUqtsf43PH/iJNVlPHAo2oWX7BSdB2Hw== + version "0.16.2" + resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39" + integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew== "@types/scroll-to-element@^2.0.2": version "2.0.2" @@ -5837,9 +5823,9 @@ cssstyle@^2.3.0: cssom "~0.3.6" csstype@^3.0.2: - version "3.1.3" - resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81" - integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw== + version "3.0.8" + resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.8.tgz#d2266a792729fb227cd216fb572f43728e1ad340" + integrity sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw== data-urls@^3.0.2: version "3.0.2" @@ -9880,10 +9866,10 @@ platform@^1.3.3: resolved "https://registry.yarnpkg.com/platform/-/platform-1.3.6.tgz#48b4ce983164b209c2d45a107adb31f473a6e7a7" integrity sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg== -platformicons@^7.0.4: - version "7.0.4" - resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.4.tgz#1e5df8b79478e11381dced9df45e129da172f89e" - integrity sha512-ld6YQ8CwUYScEp9qUW34tHq68nguzS7tTIYAW6TV64h/v8G1FqlKJ2eUZXMK/BSds8Vs+buV06NZX1r3Wm1kiw== +platformicons@^7.0.1: + version "7.0.1" + resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.1.tgz#eaf6a1e18fe8516b135df458ed603c4554ae050f" + integrity sha512-M/aNCZw4RJ8yIhkFBFhoQtOYgvwn+99upggQYy7BSaQxKaGS3Yb5/c1qC8+lKqzWWMZ+uafFOpEK6jLFPIkpww== dependencies: "@types/node" "*" "@types/react" "*" @@ -11953,11 +11939,6 @@ undici-types@~6.19.8: resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.19.8.tgz#35111c9d1437ab83a7cdc0abae2f26d88eda0a02" integrity sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw== -undici-types@~6.20.0: - version "6.20.0" - resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.20.0.tgz#8171bf22c1f588d1554d55bf204bc624af388433" - integrity sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg== - undici@^5.25.4: version "5.28.5" resolved "https://registry.yarnpkg.com/undici/-/undici-5.28.5.tgz#b2b94b6bf8f1d919bc5a6f31f2c01deb02e54d4b" From 7830762a90e56684fa8a565face03b6c2a0c6f77 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Thu, 23 Jan 2025 08:47:11 +0100 Subject: [PATCH 09/12] build(onboarding): update yarn.lock --- yarn.lock | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/yarn.lock b/yarn.lock index ae8573970300c3..45bb2bd1cf4a06 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9866,10 +9866,10 @@ platform@^1.3.3: resolved "https://registry.yarnpkg.com/platform/-/platform-1.3.6.tgz#48b4ce983164b209c2d45a107adb31f473a6e7a7" integrity sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg== -platformicons@^7.0.1: - version "7.0.1" - resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.1.tgz#eaf6a1e18fe8516b135df458ed603c4554ae050f" - integrity sha512-M/aNCZw4RJ8yIhkFBFhoQtOYgvwn+99upggQYy7BSaQxKaGS3Yb5/c1qC8+lKqzWWMZ+uafFOpEK6jLFPIkpww== +platformicons@^7.0.4: + version "7.0.4" + resolved "https://registry.yarnpkg.com/platformicons/-/platformicons-7.0.4.tgz#1e5df8b79478e11381dced9df45e129da172f89e" + integrity sha512-ld6YQ8CwUYScEp9qUW34tHq68nguzS7tTIYAW6TV64h/v8G1FqlKJ2eUZXMK/BSds8Vs+buV06NZX1r3Wm1kiw== dependencies: "@types/node" "*" "@types/react" "*" From c4710335928cef187fd73df134c90ef600caa361 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Thu, 23 Jan 2025 14:26:26 +0100 Subject: [PATCH 10/12] fix(onboarding): add cloudflare pages to serverless category --- src/sentry/utils/platform_categories.py | 1 + static/app/data/platformCategories.tsx | 5 +++++ static/app/data/platformPickerCategories.tsx | 1 + 3 files changed, 7 insertions(+) diff --git a/src/sentry/utils/platform_categories.py b/src/sentry/utils/platform_categories.py index dc3b6b09ef5115..a71e7c48e67da3 100644 --- a/src/sentry/utils/platform_categories.py +++ b/src/sentry/utils/platform_categories.py @@ -124,6 +124,7 @@ "node-awslambda", "node-azurefunctions", "node-gcpfunctions", + "node-cloudflare-pages", "node-cloudflare-workers", "python-awslambda", "python-azurefunctions", diff --git a/static/app/data/platformCategories.tsx b/static/app/data/platformCategories.tsx index 200e4611e9fcf5..025918d2196137 100644 --- a/static/app/data/platformCategories.tsx +++ b/static/app/data/platformCategories.tsx @@ -87,6 +87,9 @@ export const backend: PlatformKey[] = [ 'node-express', 'node-koa', 'node-connect', + 'node-cloudflare-pages', + 'node-cloudflare-workers', + 'perl', 'php', 'php-laravel', @@ -127,6 +130,8 @@ export const serverless: PlatformKey[] = [ 'node-awslambda', 'node-azurefunctions', 'node-gcpfunctions', + 'node-cloudflare-pages', + 'node-cloudflare-workers', 'python-awslambda', 'python-azurefunctions', 'python-gcpfunctions', diff --git a/static/app/data/platformPickerCategories.tsx b/static/app/data/platformPickerCategories.tsx index 4d5123340621fe..0292c4c285e8ee 100644 --- a/static/app/data/platformPickerCategories.tsx +++ b/static/app/data/platformPickerCategories.tsx @@ -146,6 +146,7 @@ const serverless: Set = new Set([ 'node-awslambda', 'node-azurefunctions', 'node-gcpfunctions', + 'node-cloudflare-pages', 'node-cloudflare-workers', 'python-awslambda', 'python-gcpfunctions', From dae6157d46f152ac09447a377809115a904a0458 Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Thu, 23 Jan 2025 14:27:19 +0100 Subject: [PATCH 11/12] docs(onboarding): fix wrangler configuration --- .../node/cloudflare-pages.tsx | 20 +++++++++++++++++-- .../node/cloudflare-workers.tsx | 20 +++++++++++++++++-- 2 files changed, 36 insertions(+), 4 deletions(-) diff --git a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx index c935a65922ee94..7c030b82c75b17 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx @@ -16,11 +16,20 @@ import {getInstallConfig} from 'sentry/utils/gettingStartedDocs/node'; type Params = DocsParams; -const getSdkConfigureSnippet = () => ` +const getSdkConfigureSnippetToml = () => ` compatibility_flags = ["nodejs_compat"] # compatibility_flags = ["nodejs_als"] `; +const getSdkConfigureSnippetJson = () => ` +{ + "compatibility_flags": [ + "nodejs_compat" + ], + "compatibility_date": "2024-09-23" +} +`; + const getSdkSetupSnippet = (params: Params) => ` import * as Sentry from "@sentry/cloudflare"; @@ -78,7 +87,14 @@ const onboarding: OnboardingConfig = { value: 'toml', language: 'toml', filename: 'wrangler.toml', - code: getSdkConfigureSnippet(), + code: getSdkConfigureSnippetToml(), + }, + { + label: 'JSON', + value: 'json', + language: 'json', + filename: 'wrangler.json', + code: getSdkConfigureSnippetJson(), }, ], }, diff --git a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx index be5c6c6718fb68..5e636131c78252 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx @@ -16,11 +16,20 @@ import {getInstallConfig} from 'sentry/utils/gettingStartedDocs/node'; type Params = DocsParams; -const getSdkConfigureSnippet = () => ` +const getSdkConfigureSnippetToml = () => ` compatibility_flags = ["nodejs_compat"] # compatibility_flags = ["nodejs_als"] `; +const getSdkConfigureSnippetJson = () => ` +{ + "compatibility_flags": [ + "nodejs_compat" + ], + "compatibility_date": "2024-09-23" +} +`; + const getSdkSetupSnippet = (params: Params) => ` import * as Sentry from "@sentry/cloudflare"; @@ -81,7 +90,14 @@ const onboarding: OnboardingConfig = { value: 'toml', language: 'toml', filename: 'wrangler.toml', - code: getSdkConfigureSnippet(), + code: getSdkConfigureSnippetToml(), + }, + { + label: 'JSON', + value: 'json', + language: 'json', + filename: 'wrangler.json', + code: getSdkConfigureSnippetJson(), }, ], }, From 1da294f389117088cfbe109cab087f214590fb0b Mon Sep 17 00:00:00 2001 From: Fabian Schindler Date: Thu, 23 Jan 2025 15:37:54 +0100 Subject: [PATCH 12/12] fix(onboarding): small fixes for cloudflare onboardings --- static/app/data/platformCategories.tsx | 1 - .../node/cloudflare-pages.tsx | 24 +++++++--------- .../node/cloudflare-workers.tsx | 28 ++++++++----------- 3 files changed, 22 insertions(+), 31 deletions(-) diff --git a/static/app/data/platformCategories.tsx b/static/app/data/platformCategories.tsx index 025918d2196137..fadb85b4d4cab6 100644 --- a/static/app/data/platformCategories.tsx +++ b/static/app/data/platformCategories.tsx @@ -89,7 +89,6 @@ export const backend: PlatformKey[] = [ 'node-connect', 'node-cloudflare-pages', 'node-cloudflare-workers', - 'perl', 'php', 'php-laravel', diff --git a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx index 7c030b82c75b17..38552b559f55a7 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-pages.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-pages.tsx @@ -27,8 +27,7 @@ const getSdkConfigureSnippetJson = () => ` "nodejs_compat" ], "compatibility_date": "2024-09-23" -} -`; +}`; const getSdkSetupSnippet = (params: Params) => ` import * as Sentry from "@sentry/cloudflare"; @@ -52,11 +51,8 @@ setTimeout(() => { const onboarding: OnboardingConfig = { introduction: () => - tct( - 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', - { - strong: , - } + t( + 'In this quick guide you’ll set up and configure the Sentry Cloudflare SDK for the use in your Cloudflare Pages application.' ), install: params => [ { @@ -82,13 +78,6 @@ const onboarding: OnboardingConfig = { } ), code: [ - { - label: 'Toml', - value: 'toml', - language: 'toml', - filename: 'wrangler.toml', - code: getSdkConfigureSnippetToml(), - }, { label: 'JSON', value: 'json', @@ -96,6 +85,13 @@ const onboarding: OnboardingConfig = { filename: 'wrangler.json', code: getSdkConfigureSnippetJson(), }, + { + label: 'Toml', + value: 'toml', + language: 'toml', + filename: 'wrangler.toml', + code: getSdkConfigureSnippetToml(), + }, ], }, { diff --git a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx index 5e636131c78252..d627ee23973db9 100644 --- a/static/app/gettingStartedDocs/node/cloudflare-workers.tsx +++ b/static/app/gettingStartedDocs/node/cloudflare-workers.tsx @@ -27,8 +27,7 @@ const getSdkConfigureSnippetJson = () => ` "nodejs_compat" ], "compatibility_date": "2024-09-23" -} -`; +}`; const getSdkSetupSnippet = (params: Params) => ` import * as Sentry from "@sentry/cloudflare"; @@ -55,11 +54,8 @@ setTimeout(() => { const onboarding: OnboardingConfig = { introduction: () => - tct( - 'In this quick guide you’ll use [strong:npm], [strong:yarn] or [strong:pnpm] to set up:', - { - strong: , - } + t( + 'In this quick guide you’ll set up and configure the Sentry Cloudflare SDK for the use in your Cloudflare Workers application.' ), install: params => [ { @@ -79,19 +75,12 @@ const onboarding: OnboardingConfig = { configurations: [ { description: tct( - "To use the SDK, you'll need to set either the [code:nodejs_compat] or [code:nodejs_als] compatibility flags in your [code:wrangler.toml]. This is because the SDK needs access to the [code:AsyncLocalStorage] API to work correctly.", + "To use the SDK, you'll need to set either the [code:nodejs_compat] or [code:nodejs_als] compatibility flags in your [code:wrangler.json]/[code:wrangler.toml]. This is because the SDK needs access to the [code:AsyncLocalStorage] API to work correctly.", { code: , } ), code: [ - { - label: 'Toml', - value: 'toml', - language: 'toml', - filename: 'wrangler.toml', - code: getSdkConfigureSnippetToml(), - }, { label: 'JSON', value: 'json', @@ -99,11 +88,18 @@ const onboarding: OnboardingConfig = { filename: 'wrangler.json', code: getSdkConfigureSnippetJson(), }, + { + label: 'Toml', + value: 'toml', + language: 'toml', + filename: 'wrangler.toml', + code: getSdkConfigureSnippetToml(), + }, ], }, { description: tct( - 'To use this SDK, wrap your handler with the [code:withSentry] function. This will initialize the SDK and hook into the environment. Note that you can turn off almost all side effects using the respective options.', + 'In order to initialize the SDK, wrap your handler with the [code:withSentry] function. Note that you can turn off almost all side effects using the respective options.', { code: , guideLink: (