feat(browser): Add multiplexedtransport.js CDN bundle (#15043)

Add a pluggable CDN bundle for `makeMultiplexedTransport`, an
API we export from `@sentry/browser` but not from the browser SDK CDN
bundles for bundle size reasons.

dev-packages/browser-integration-tests/suites/transport/multiplexed/init.js

@@ -0,0 +1,20 @@
+import * as Sentry from '@sentry/browser';
+
+import { makeMultiplexedTransport } from '@sentry/browser';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://public@dsn.ingest.sentry.io/1337',
+  transport: makeMultiplexedTransport(Sentry.makeFetchTransport, ({ getEvent }) => {
+    const event = getEvent('event');
+
+    if (event.tags.to === 'a') {
+      return ['https://public@dsn.ingest.sentry.io/1337'];
+    } else if (event.tags.to === 'b') {
+      return ['https://public@dsn.ingest.sentry.io/1337'];
+    } else {
+      throw new Error('Unknown destination');
+    }
+  }),
+});

dev-packages/browser-integration-tests/suites/transport/multiplexed/subject.js

@@ -0,0 +1,10 @@
+setTimeout(() => {
+  Sentry.withScope(scope => {
+    scope.setTag('to', 'a');
+    Sentry.captureException(new Error('Error a'));
+  });
+  Sentry.withScope(scope => {
+    scope.setTag('to', 'b');
+    Sentry.captureException(new Error('Error b'));
+  });
+}, 0);

dev-packages/browser-integration-tests/suites/transport/multiplexed/test.ts

@@ -0,0 +1,20 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/core';
+
+import { sentryTest } from '../../../utils/fixtures';
+import { getMultipleSentryEnvelopeRequests } from '../../../utils/helpers';
+
+sentryTest('sends event to DSNs specified in makeMultiplexedTransport', async ({ getLocalTestUrl, page }) => {
+  const url = await getLocalTestUrl({ testDir: __dirname });
+  const errorEvents = await getMultipleSentryEnvelopeRequests<Event>(page, 2, { envelopeType: 'event', url });
+
+  expect(errorEvents).toHaveLength(2);
+
+  const [evt1, evt2] = errorEvents;
+
+  const errorA = evt1?.tags?.to === 'a' ? evt1 : evt2;
+  const errorB = evt1?.tags?.to === 'b' ? evt1 : evt2;
+
+  expect(errorA.tags?.to).toBe('a');
+  expect(errorB.tags?.to).toBe('b');
+});

dev-packages/browser-integration-tests/utils/generatePlugin.ts

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import type { Package } from '@sentry/core';
+import { type Package } from '@sentry/core';
 import HtmlWebpackPlugin, { createHtmlTagObject } from 'html-webpack-plugin';
 import type { Compiler } from 'webpack';
 
@@ -38,6 +38,8 @@ const IMPORTED_INTEGRATION_CDN_BUNDLE_PATHS: Record<string, string> = {
   sessionTimingIntegration: 'sessiontiming',
   feedbackIntegration: 'feedback',
   moduleMetadataIntegration: 'modulemetadata',
+  // technically, this is not an integration, but let's add it anyway for simplicity
+  makeMultiplexedTransport: 'multiplexedtransport',
 };
 
 const BUNDLE_PATHS: Record<string, Record<string, string>> = {

packages/browser/rollup.bundle.config.mjs

@@ -37,6 +37,19 @@ reexportedPluggableIntegrationFiles.forEach(integrationName => {
   builds.push(...makeBundleConfigVariants(integrationsBundleConfig));
 });
 
+// Bundle config for additional exports we don't want to include in the main SDK bundle
+// if we need more of these, we can generalize the config as for pluggable integrations
+builds.push(
+  ...makeBundleConfigVariants(
+    makeBaseBundleConfig({
+      bundleType: 'addon',
+      entrypoints: ['src/pluggable-exports-bundle/index.multiplexedtransport.ts'],
+      licenseTitle: '@sentry/browser - multiplexedtransport',
+      outputFileBase: () => 'bundles/multiplexedtransport',
+    }),
+  ),
+);
+
 const baseBundleConfig = makeBaseBundleConfig({
   bundleType: 'standalone',
   entrypoints: ['src/index.bundle.ts'],

packages/browser/src/pluggable-exports-bundle/index.multiplexedtransport.ts

@@ -0,0 +1 @@
+export { makeMultiplexedTransport } from '@sentry/core';