test(tracing): Add test to validate that spans only added when active span exists

Author: AbhiPrasad

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-no-active-span/init.js

@@ -0,0 +1,10 @@
+import * as Sentry from '@sentry/browser';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  // disable pageload transaction
+  integrations: [Sentry.BrowserTracing({ tracingOrigins: ['http://example.com'], startTransactionOnPageLoad: false })],
+  tracesSampleRate: 1,
+});

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-no-active-span/subject.js

@@ -0,0 +1 @@
+fetch('http://example.com/0').then(fetch('http://example.com/1').then(fetch('http://example.com/2')));

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-no-active-span/test.ts

@@ -0,0 +1,30 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { shouldSkipTracingTest } from '../../../../utils/helpers';
+
+sentryTest(
+  'there should be no span created for fetch requests with no active span',
+  async ({ getLocalTestPath, page }) => {
+    if (shouldSkipTracingTest()) {
+      sentryTest.skip();
+    }
+
+    const url = await getLocalTestPath({ testDir: __dirname });
+
+    let requestCount = 0;
+    page.on('request', request => {
+      expect(request.url()).not.toContain(url);
+      requestCount++;
+    });
+
+    await page.goto(url);
+
+    // There are 6 requests in the page:
+    // 1. HTML page
+    // 2. Init JS bundle
+    // 3. Subject JS bundle
+    // and then 3 fetch requests
+    expect(requestCount).toBe(6);
+  },
+);

dev-packages/browser-integration-tests/suites/tracing/request/xhr-with-no-active-span/init.js

@@ -0,0 +1,10 @@
+import * as Sentry from '@sentry/browser';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  // disable pageload transaction
+  integrations: [Sentry.BrowserTracing({ tracingOrigins: ['http://example.com'], startTransactionOnPageLoad: false })],
+  tracesSampleRate: 1,
+});

dev-packages/browser-integration-tests/suites/tracing/request/xhr-with-no-active-span/subject.js

@@ -0,0 +1,11 @@
+const xhr_1 = new XMLHttpRequest();
+xhr_1.open('GET', 'http://example.com/0');
+xhr_1.send();
+
+const xhr_2 = new XMLHttpRequest();
+xhr_2.open('GET', 'http://example.com/1');
+xhr_2.send();
+
+const xhr_3 = new XMLHttpRequest();
+xhr_3.open('GET', 'http://example.com/2');
+xhr_3.send();

dev-packages/browser-integration-tests/suites/tracing/request/xhr-with-no-active-span/test.ts

@@ -0,0 +1,30 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { shouldSkipTracingTest } from '../../../../utils/helpers';
+
+sentryTest(
+  'there should be no span created for xhr requests with no active span',
+  async ({ getLocalTestPath, page }) => {
+    if (shouldSkipTracingTest()) {
+      sentryTest.skip();
+    }
+
+    const url = await getLocalTestPath({ testDir: __dirname });
+
+    let requestCount = 0;
+    page.on('request', request => {
+      expect(request.url()).not.toContain(url);
+      requestCount++;
+    });
+
+    await page.goto(url);
+
+    // There are 6 requests in the page:
+    // 1. HTML page
+    // 2. Init JS bundle
+    // 3. Subject JS bundle
+    // and then 3 fetch requests
+    expect(requestCount).toBe(6);
+  },
+);