[WIP] feat: Span Streaming POC #17852

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft

Lms24 wants to merge 67 commits into develop from lms/feat-span-streaming-poc

.cursor/plans/span_streaming_prs_43411dc5.plan.md

Large diffs are not rendered by default.

.size-limit.js

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -8,14 +8,14 @@ module.exports = [
  
        path: 'packages/browser/build/npm/esm/prod/index.js',

        import: createImport('init'),

        gzip: true,

        limit: '25.5 KB',

        limit: '26KB',

      },

      {

        name: '@sentry/browser - with treeshaking flags',

        path: 'packages/browser/build/npm/esm/prod/index.js',

        import: createImport('init'),

        gzip: true,

        limit: '24.1 KB',

        limit: '25 KB',

        modifyWebpackConfig: function (config) {

          const webpack = require('webpack');

    @@ -47,6 +47,13 @@ module.exports = [
  
        gzip: true,

        limit: '48 KB',

      },

      // {

      //   name: '@sentry/browser (incl. Tracing Span-First)',

      //   path: 'packages/browser/build/npm/esm/index.js',

      //   import: createImport('init', 'browserTracingIntegration', 'spanStreamingIntegration'),

      //   gzip: true,

      //   limit: '44 KB',

      // },

      {

        name: '@sentry/browser (incl. Tracing, Replay)',

        path: 'packages/browser/build/npm/esm/prod/index.js',

    @@ -82,14 +89,14 @@ module.exports = [
  
        path: 'packages/browser/build/npm/esm/prod/index.js',

        import: createImport('init', 'browserTracingIntegration', 'replayIntegration', 'replayCanvasIntegration'),

        gzip: true,

        limit: '85.55 KB',

        limit: '87 KB',

      },

      {

        name: '@sentry/browser (incl. Tracing, Replay, Feedback)',

        path: 'packages/browser/build/npm/esm/prod/index.js',

        import: createImport('init', 'browserTracingIntegration', 'replayIntegration', 'feedbackIntegration'),

        gzip: true,

        limit: '98 KB',

        limit: '99 KB',

      },

      {

        name: '@sentry/browser (incl. Feedback)',

    @@ -148,43 +155,43 @@ module.exports = [
  
        import: createImport('init', 'ErrorBoundary', 'reactRouterV6BrowserTracingIntegration'),

        ignore: ['react/jsx-runtime'],

        gzip: true,

        limit: '44.5 KB',

        limit: '46 KB',

      },

      // Vue SDK (ESM)

      {

        name: '@sentry/vue',

        path: 'packages/vue/build/esm/index.js',

        import: createImport('init'),

        gzip: true,

        limit: '30 KB',

        limit: '31 KB',

      },

      {

        name: '@sentry/vue (incl. Tracing)',

        path: 'packages/vue/build/esm/index.js',

        import: createImport('init', 'browserTracingIntegration'),

        gzip: true,

        limit: '44.1 KB',

        limit: '45 KB',

      },

      // Svelte SDK (ESM)

      {

        name: '@sentry/svelte',

        path: 'packages/svelte/build/esm/index.js',

        import: createImport('init'),

        gzip: true,

        limit: '25.5 KB',

        limit: '26 KB',

      },

      // Browser CDN bundles

      {

        name: 'CDN Bundle',

        path: createCDNPath('bundle.min.js'),

        gzip: true,

        limit: '28 KB',

        limit: '28.5 KB',

      },

      {

        name: 'CDN Bundle (incl. Tracing)',

        path: createCDNPath('bundle.tracing.min.js'),

        gzip: true,

        limit: '43 KB',

        limit: '44 KB',

      },

      {

        name: 'CDN Bundle (incl. Logs, Metrics)',

    @@ -208,7 +215,7 @@ module.exports = [
  
        name: 'CDN Bundle (incl. Tracing, Replay)',

        path: createCDNPath('bundle.tracing.replay.min.js'),

        gzip: true,

        limit: '80 KB',

        limit: '81 KB',

      },

      {

        name: 'CDN Bundle (incl. Tracing, Replay, Logs, Metrics)',

    @@ -234,21 +241,14 @@ module.exports = [
  
        path: createCDNPath('bundle.min.js'),

        gzip: false,

        brotli: false,

        limit: '82 KB',

        limit: '83 KB',

      },

      {

        name: 'CDN Bundle (incl. Tracing) - uncompressed',

        path: createCDNPath('bundle.tracing.min.js'),

        gzip: false,

        brotli: false,

        limit: '128 KB',

      },

      {

        name: 'CDN Bundle (incl. Logs, Metrics) - uncompressed',

        path: createCDNPath('bundle.logs.metrics.min.js'),

        gzip: false,

        brotli: false,

        limit: '86 KB',

        limit: '129 KB',

      },

      {

        name: 'CDN Bundle (incl. Tracing, Logs, Metrics) - uncompressed',

    @@ -269,7 +269,7 @@ module.exports = [
  
        path: createCDNPath('bundle.tracing.replay.min.js'),

        gzip: false,

        brotli: false,

        limit: '245 KB',

        limit: '247 KB',

      },

      {

        name: 'CDN Bundle (incl. Tracing, Replay, Logs, Metrics) - uncompressed',

    @@ -299,7 +299,7 @@ module.exports = [
  
        import: createImport('init'),

        ignore: ['next/router', 'next/constants'],

        gzip: true,

        limit: '47 KB',

        limit: '48 KB',

      },

      // SvelteKit SDK (ESM)

      {

    @@ -308,7 +308,7 @@ module.exports = [
  
        import: createImport('init'),

        ignore: ['$app/stores'],

        gzip: true,

        limit: '43 KB',

        limit: '44 KB',

      },

      // Node-Core SDK (ESM)

      {

    @@ -326,14 +326,14 @@ module.exports = [
  
        import: createImport('init'),

        ignore: [...builtinModules, ...nodePrefixedBuiltinModules],

        gzip: true,

        limit: '167 KB',

        limit: '166 KB',

      },

      {

        name: '@sentry/node - without tracing',

        path: 'packages/node/build/esm/index.js',

        import: createImport('initWithoutDefaultIntegrations', 'getDefaultIntegrationsWithoutPerformance'),

        gzip: true,

        limit: '95 KB',

        limit: '97 KB',

        ignore: [...builtinModules, ...nodePrefixedBuiltinModules],

        modifyWebpackConfig: function (config) {

          const webpack = require('webpack');

    @@ -356,7 +356,7 @@ module.exports = [
  
        import: createImport('init'),

        ignore: [...builtinModules, ...nodePrefixedBuiltinModules],

        gzip: true,

        limit: '111 KB',

        limit: '112 KB',

      },

    ];

.vscode/settings.json

-Original file line number
+Diff line change
@@ Expand Up / @@ -28,5 +28,6 @@ @@
       "editor.defaultFormatter": "esbenp.prettier-vscode",
       "[typescript]": {
         "editor.defaultFormatter": "esbenp.prettier-vscode"
-      }
+      },
+      "angular.enable-strict-mode-prompt": false
     }

CHANGELOG.md

-Original file line number
+Diff line change
@@ Expand Up @@
     Work in this release was contributed by @0xbad0c0d3. Thank you for your contribution!
+    ## 10.21.0-alpha.1
+    This release is a preview release for sending spans in browser via spanV2 instead of transaction event envelopes. All of this is experimental and subject to change. Use at your own risk. [More Details.](https://github.com/getsentry/sentry-javascript/pull/17852)
+    - export withStreamSpan from `@sentry/browser`
+    ## 10.21.0-alpha.0
+    This release is a preview release for sending spans in browser via spanV2 instead of transaction event envelopes. All of this is experimental and subject to change. Use at your own risk. [More Details.](https://github.com/getsentry/sentry-javascript/pull/17852)
     ## 10.20.0
     ### Important Changes
@@ Expand Down @@

dev-packages/browser-integration-tests/suites/span-first/backgroundtab-pageload/init.js

-Original file line number
+Diff line change
@@ -0,0 +1,12 @@
+    import * as Sentry from '@sentry/browser';
+    window.Sentry = Sentry;
+    Sentry.init({
+      dsn: 'https://[email protected]/1337',
+      traceLifecycle: 'stream',
+      integrations: [Sentry.browserTracingIntegration(), Sentry.spanStreamingIntegration()],
+      tracePropagationTargets: ['http://sentry-test-site.example'],
+      tracesSampleRate: 1,
+      sendDefaultPii: true,
+    });

dev-packages/browser-integration-tests/suites/span-first/backgroundtab-pageload/subject.js

-Original file line number
+Diff line change
@@ -0,0 +1,8 @@
+    document.getElementById('go-background').addEventListener('click', () => {
+      setTimeout(() => {
+        Object.defineProperty(document, 'hidden', { value: true, writable: true });
+        const ev = document.createEvent('Event');
+        ev.initEvent('visibilitychange');
+        document.dispatchEvent(ev);
+      }, 250);
+    });

...packages/browser-integration-tests/suites/span-first/backgroundtab-pageload/template.html

-Original file line number
+Diff line change
@@ -0,0 +1,9 @@
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta charset="utf-8" />
+      </head>
+      <body>
+        <button id="go-background">New Tab</button>
+      </body>
+    </html>

dev-packages/browser-integration-tests/suites/span-first/backgroundtab-pageload/test.ts

-Original file line number
+Diff line change
@@ -0,0 +1,24 @@
+    import { expect } from '@playwright/test';
+    import { sentryTest } from '../../../utils/fixtures';
+    import { shouldSkipTracingTest, testingCdnBundle } from '../../../utils/helpers';
+    import { getSpanOp, waitForV2Spans } from '../../../utils/spanFirstUtils';
+    sentryTest('ends pageload span when the page goes to background', async ({ getLocalTestUrl, page }) => {
+      // for now, spanStreamingIntegration is only exported in the NPM package, so we skip the test for bundles.
+      if (shouldSkipTracingTest() || testingCdnBundle()) {
+        sentryTest.skip();
+      }
+      const url = await getLocalTestUrl({ testDir: __dirname });
+      const spanPromise = waitForV2Spans(page, spans => !!spans.find(span => getSpanOp(span) === 'pageload'));
+      await page.goto(url);
+      await page.locator('#go-background').click();
+      const pageloadSpan = (await spanPromise).find(span => getSpanOp(span) === 'pageload');
+      expect(pageloadSpan?.status).toBe('error'); // a cancelled span previously mapped to status error with message cancelled.
+      expect(pageloadSpan?.attributes?.['sentry.op']?.value).toBe('pageload');
+      expect(pageloadSpan?.attributes?.['sentry.cancellation_reason']?.value).toBe('document.hidden');
+    });

dev-packages/browser-integration-tests/suites/span-first/error/init.js

-Original file line number
+Diff line change
@@ -0,0 +1,13 @@
+    import * as Sentry from '@sentry/browser';
+    window.Sentry = Sentry;
+    Sentry.init({
+      dsn: 'https://[email protected]/1337',
+      traceLifecycle: 'stream',
+      integrations: [Sentry.browserTracingIntegration(), Sentry.spanStreamingIntegration()],
+      tracePropagationTargets: ['http://sentry-test-site.example'],
+      tracesSampleRate: 1,
+      sendDefaultPii: true,
+      debug: true,
+    });

dev-packages/browser-integration-tests/suites/span-first/error/test.ts

-Original file line number
+Diff line change
@@ -0,0 +1,48 @@
+    import { expect } from '@playwright/test';
+    import type { Event } from '@sentry/core';
+    import { sentryTest } from '../../../utils/fixtures';
+    import {
+      envelopeRequestParser,
+      runScriptInSandbox,
+      shouldSkipTracingTest,
+      testingCdnBundle,
+      waitForErrorRequest,
+    } from '../../../utils/helpers';
+    import { getSpanOp, waitForV2Spans } from '../../../utils/spanFirstUtils';
+    sentryTest(
+      'puts the pageload span name onto an error event caught during pageload',
+      async ({ getLocalTestUrl, page, browserName }) => {
+        // for now, spanStreamingIntegration is only exported in the NPM package, so we skip the test for bundles.
+        // This test fails on Webkit as errors thrown from `runScriptInSandbox` are Script Errors and skipped by Sentry
+        if (shouldSkipTracingTest() || testingCdnBundle() || browserName === 'webkit') {
+          sentryTest.skip();
+        }
+        const url = await getLocalTestUrl({ testDir: __dirname });
+        const errorEventPromise = waitForErrorRequest(page);
+        const spanPromise = waitForV2Spans(page, spans => !!spans.find(span => getSpanOp(span) === 'pageload'));
+        await page.goto(url);
+        await runScriptInSandbox(page, {
+          content: `
+              throw new Error('Error during pageload');
+            `,
+        });
+        const errorEvent = envelopeRequestParser<Event>(await errorEventPromise);
+        const pageloadSpan = (await spanPromise).find(span => getSpanOp(span) === 'pageload');
+        expect(pageloadSpan?.attributes?.['sentry.op']?.value).toEqual('pageload');
+        expect(errorEvent.exception?.values?.[0]).toBeDefined();
+        expect(pageloadSpan?.name).toEqual('/index.html');
+        expect(pageloadSpan?.status).toBe('error');
+        expect(pageloadSpan?.attributes?.['sentry.idle_span_finish_reason']?.value).toBe('idleTimeout');
+        expect(errorEvent.transaction).toEqual(pageloadSpan?.name);
+      },
+    );

dev-packages/browser-integration-tests/suites/span-first/init.js

-Original file line number
+Diff line change
@@ -0,0 +1,12 @@
+    import * as Sentry from '@sentry/browser';
+    window.Sentry = Sentry;
+    Sentry.init({
+      dsn: 'https://[email protected]/1337',
+      traceLifecycle: 'stream',
+      integrations: [Sentry.browserTracingIntegration(), Sentry.spanStreamingIntegration()],
+      tracePropagationTargets: ['http://sentry-test-site.example'],
+      tracesSampleRate: 1,
+      sendDefaultPii: true,
+    });

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[WIP] feat: Span Streaming POC #17852

Uh oh!

Diff view

Diff view

There are no files selected for viewing

Uh oh!

Uh oh!

Uh oh!

Uh oh!

[WIP] feat: Span Streaming POC #17852

Are you sure you want to change the base?

Uh oh!

[WIP] feat: Span Streaming POC #17852

Uh oh!

Uh oh!

Diff view

Diff view

There are no files selected for viewing

Uh oh!

Uh oh!

Uh oh!