feat: display sentry levels when capturing messages (#21243)

* feat: display sentry levels when capturing messages * tset * delete dangling snapshot
PostHog · Apr 4, 2024 · cdb4e8b · cdb4e8b
1 parent bb151e6
commit cdb4e8b
Show file tree

Hide file tree

Showing 4 changed files with 65 additions and 25 deletions.
diff --git a/frontend/src/lib/components/Errors/ErrorDisplay.tsx b/frontend/src/lib/components/Errors/ErrorDisplay.tsx
@@ -124,6 +124,7 @@ export function getExceptionPropertiesFrom(eventProperties: Record<string, any>)
         $active_feature_flags,
         $sentry_url,
         $sentry_exception,
+        $level,
     } = eventProperties
 
     let $exception_stack_trace_raw = eventProperties.$exception_stack_trace_raw
@@ -151,6 +152,7 @@ export function getExceptionPropertiesFrom(eventProperties: Record<string, any>)
         $active_feature_flags,
         $sentry_url,
         $exception_stack_trace_raw,
+        $level,
     }
 }
 
@@ -172,13 +174,14 @@ export function ErrorDisplay({ event }: { event: EventType | RecordingEventType
         $active_feature_flags,
         $sentry_url,
         $exception_stack_trace_raw,
+        $level,
     } = getExceptionPropertiesFrom(event.properties)
 
     return (
         <div className="flex flex-col space-y-2 pr-4 pb-2">
             <h1 className="mb-0">{$exception_message}</h1>
             <div className="flex flex-row gap-2 flex-wrap">
-                <LemonTag type="danger">{$exception_type}</LemonTag>
+                <LemonTag type="danger">{$exception_type || $level}</LemonTag>
                 <TitledSnack
                     type="success"
                     title="captured by"

diff --git a/frontend/src/lib/components/Errors/__snapshots__/error-display.test.ts.snap b/frontend/src/lib/components/Errors/__snapshots__/error-display.test.ts.snap
diff --git a/frontend/src/lib/components/Errors/error-display.test.ts b/frontend/src/lib/components/Errors/error-display.test.ts
@@ -48,8 +48,65 @@ describe('Error Display', () => {
             $exception_type: 'Error',
         }
         const result = getExceptionPropertiesFrom(eventProperties)
-        // we don't use all the properties
-        expect(Object.keys(result)).toHaveLength(12)
-        expect(result).toMatchSnapshot()
+        expect(result).toEqual({
+            $active_feature_flags: ['feature1,feature2'],
+            $browser: 'Chrome',
+            $browser_version: '92.0.4515',
+            $exception_message: 'There was an error creating the support ticket with zendesk.',
+            $exception_stack_trace_raw:
+                '[{"colno":220,"filename":"https://app-static-prod.posthog.com/static/chunk-UFQKIDIH.js","function":"submitZendeskTicket","in_app":true,"lineno":25}]',
+            $exception_synthetic: undefined,
+            $exception_type: 'Error',
+            $lib: 'posthog-js',
+            $lib_version: '1.0.0',
+            $level: undefined,
+            $os: 'Windows',
+            $os_version: '10',
+            $sentry_url:
+                'https://sentry.io/organizations/posthog/issues/?project=1899813&query=40e442d79c22473391aeeeba54c82163',
+        })
+    })
+
+    it('can read sentry message', () => {
+        const eventProperties = {
+            'should not be in the': 'result',
+            $browser: 'Chrome',
+            $browser_version: '92.0.4515',
+            $active_feature_flags: ['feature1,feature2'],
+            $lib: 'posthog-js',
+            $lib_version: '1.0.0',
+            $os: 'Windows',
+            $os_version: '10',
+            $sentry_tags: {
+                'PostHog Person URL': 'https://app.posthog.com/person/f6kW3HXaha6dAvHZiOmgrcAXK09682P6nNPxvfjqM9c',
+                'PostHog Recording URL': 'https://app.posthog.com/replay/018dc30d-a8a5-7257-9faf-dcd97c0e19cf?t=2294',
+            },
+            $sentry_exception: undefined,
+            $sentry_url:
+                'https://sentry.io/organizations/posthog/issues/?project=1899813&query=40e442d79c22473391aeeeba54c82163',
+            $sentry_event_id: '40e442d79c22473391aeeeba54c82163',
+            $sentry_exception_type: undefined,
+            $exception_personURL: 'https://app.posthog.com/person/f6kW3HXaha6dAvHZiOmgrcAXK09682P6nNPxvfjqM9c',
+            $exception_type: undefined,
+            $level: 'info',
+            $exception_message: 'the message sent into sentry captureMessage',
+        }
+        const result = getExceptionPropertiesFrom(eventProperties)
+        expect(result).toEqual({
+            $active_feature_flags: ['feature1,feature2'],
+            $browser: 'Chrome',
+            $browser_version: '92.0.4515',
+            $exception_message: 'the message sent into sentry captureMessage',
+            $exception_stack_trace_raw: undefined,
+            $exception_synthetic: undefined,
+            $exception_type: undefined,
+            $lib: 'posthog-js',
+            $lib_version: '1.0.0',
+            $level: 'info',
+            $os: 'Windows',
+            $os_version: '10',
+            $sentry_url:
+                'https://sentry.io/organizations/posthog/issues/?project=1899813&query=40e442d79c22473391aeeeba54c82163',
+        })
     })
 })
diff --git a/frontend/src/loadPostHogJS.tsx b/frontend/src/loadPostHogJS.tsx
@@ -82,7 +82,7 @@ export function loadPostHogJS(): void {
             dsn: window.SENTRY_DSN,
             environment: window.SENTRY_ENVIRONMENT,
             ...(location.host.includes('posthog.com') && {
-                integrations: [new posthog.SentryIntegration(posthog, 'posthog', 1899813)],
+                integrations: [new posthog.SentryIntegration(posthog, 'posthog', 1899813, undefined, '*')],
             }),
         })
     }