@getmicdrop/svelte-components 5.19.0 → 5.20.1

package/dist/telemetry.spec.js

@@ -1,1173 +1,1273 @@
-// @ts-nocheck
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-
-// Vitest 4.x requires class syntax for constructor mocks
-// Mock all OpenTelemetry modules before importing telemetry
-vi.mock('@opentelemetry/sdk-trace-web', () => ({
-  WebTracerProvider: class MockWebTracerProvider {
-    constructor() {
-      this.addSpanProcessor = vi.fn();
-      this.register = vi.fn();
-      this.shutdown = vi.fn().mockResolvedValue(undefined);
-    }
-    getTracer() {
-      return {
-        startSpan: vi.fn().mockReturnValue({
-          setAttribute: vi.fn(),
-          setStatus: vi.fn(),
-          recordException: vi.fn(),
-          end: vi.fn(),
-          name: 'test-span',
-        }),
-      };
-    }
-  },
-}));
-
-vi.mock('@opentelemetry/sdk-trace-base', () => ({
-  BatchSpanProcessor: class MockBatchSpanProcessor {},
-}));
-
-vi.mock('@opentelemetry/exporter-trace-otlp-http', () => ({
-  OTLPTraceExporter: class MockOTLPTraceExporter {},
-}));
-
-vi.mock('@opentelemetry/resources', () => ({
-  resourceFromAttributes: vi.fn((attrs) => attrs),
-}));
-
-vi.mock('@opentelemetry/semantic-conventions', () => ({
-  ATTR_SERVICE_NAME: 'service.name',
-  ATTR_SERVICE_VERSION: 'service.version',
-}));
-
-vi.mock('@opentelemetry/instrumentation-document-load', () => ({
-  DocumentLoadInstrumentation: class MockDocumentLoadInstrumentation {
-    constructor() {
-      this.enable = vi.fn();
-    }
-  },
-}));
-
-vi.mock('@opentelemetry/instrumentation-fetch', () => ({
-  FetchInstrumentation: class MockFetchInstrumentation {
-    constructor() {
-      this.enable = vi.fn();
-    }
-  },
-}));
-
-vi.mock('@opentelemetry/instrumentation-xml-http-request', () => ({
-  XMLHttpRequestInstrumentation: class MockXMLHttpRequestInstrumentation {
-    constructor() {
-      this.enable = vi.fn();
-    }
-  },
-}));
-
-vi.mock('@opentelemetry/instrumentation-user-interaction', () => ({
-  UserInteractionInstrumentation: class MockUserInteractionInstrumentation {
-    constructor() {
-      this.enable = vi.fn();
-    }
-  },
-}));
-
-vi.mock('@opentelemetry/instrumentation', () => ({
-  registerInstrumentations: vi.fn(),
-}));
-
-
-vi.mock('@opentelemetry/context-zone', () => ({
-  ZoneContextManager: class MockZoneContextManager {},
-}));
-
-vi.mock('@opentelemetry/propagator-b3', () => ({
-  B3Propagator: class MockB3Propagator {},
-}));
-
-describe('Telemetry Module', () => {
-  let telemetry;
-  let originalWindow;
-  let originalDocument;
-  let mockSpan;
-  let mockTracer;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    // Save original globals
-    originalWindow = global.window;
-    originalDocument = global.document;
-
-    // Create mock span
-    mockSpan = {
-      setAttribute: vi.fn(),
-      setStatus: vi.fn(),
-      recordException: vi.fn(),
-      end: vi.fn(),
-      name: 'test-span',
-    };
-
-    // Create mock tracer
-    mockTracer = {
-      startSpan: vi.fn().mockReturnValue(mockSpan),
-    };
-
-    // Setup mock window
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '?test=1',
-        hash: '#section',
-        href: 'http://localhost/performers?test=1#section',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test Page',
-      referrer: 'http://localhost/',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test-agent',
-      language: 'en-US',
-      platform: 'test-platform',
-    };
-
-    // Re-import with fresh mocks
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    global.window = originalWindow;
-    global.document = originalDocument;
-    vi.clearAllMocks();
-  });
-
-  describe('initTelemetry', () => {
-    it('exports initTelemetry function', () => {
-      expect(telemetry.initTelemetry).toBeDefined();
-      expect(typeof telemetry.initTelemetry).toBe('function');
-    });
-
-    it('can be called without errors', () => {
-      expect(() => telemetry.initTelemetry()).not.toThrow();
-    });
-  });
-
-  describe('startSpan', () => {
-    it('exports startSpan function', () => {
-      expect(telemetry.startSpan).toBeDefined();
-      expect(typeof telemetry.startSpan).toBe('function');
-    });
-
-    it('returns null when tracer is not initialized', async () => {
-      vi.resetModules();
-      const tempWindow = global.window;
-      delete global.window;
-
-      const freshTelemetry = await import('./telemetry.js');
-      global.window = tempWindow;
-
-      const result = freshTelemetry.startSpan('test-span');
-      expect(result).toBeNull();
-    });
-
-    it('can be called with name only', () => {
-      telemetry.initTelemetry();
-      const result = telemetry.startSpan('test-span');
-      expect(result === null || typeof result === 'object').toBe(true);
-    });
-
-    it('can be called with name and options', () => {
-      telemetry.initTelemetry();
-      const result = telemetry.startSpan('test-span', { attributes: { key: 'value' } });
-      expect(result === null || typeof result === 'object').toBe(true);
-    });
-  });
-
-  describe('endSpan', () => {
-    it('exports endSpan function', () => {
-      expect(telemetry.endSpan).toBeDefined();
-      expect(typeof telemetry.endSpan).toBe('function');
-    });
-
-    it('handles null span gracefully', () => {
-      expect(() => telemetry.endSpan(null)).not.toThrow();
-    });
-
-    it('handles undefined span gracefully', () => {
-      expect(() => telemetry.endSpan(undefined)).not.toThrow();
-    });
-
-    it('can end a span with default status', () => {
-      expect(() => telemetry.endSpan(mockSpan)).not.toThrow();
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 0 });
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('can end a span with custom status', () => {
-      expect(() => telemetry.endSpan(mockSpan, { code: 2, message: 'error' })).not.toThrow();
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2, message: 'error' });
-    });
-  });
-
-  describe('trackPageView', () => {
-    it('exports trackPageView function', () => {
-      expect(telemetry.trackPageView).toBeDefined();
-      expect(typeof telemetry.trackPageView).toBe('function');
-    });
-
-    it('can be called without errors', () => {
-      expect(() => telemetry.trackPageView('/test-page')).not.toThrow();
-    });
-
-    it('can be called with page path and title', () => {
-      expect(() => telemetry.trackPageView('/test-page', 'Test Page Title')).not.toThrow();
-    });
-
-    it('returns early when tracer is not initialized', () => {
-      const result = telemetry.trackPageView('/test');
-      expect(result).toBeUndefined();
-    });
-  });
-
-  describe('trackEvent', () => {
-    it('exports trackEvent function', () => {
-      expect(telemetry.trackEvent).toBeDefined();
-      expect(typeof telemetry.trackEvent).toBe('function');
-    });
-
-    it('can be called with event name only', () => {
-      expect(() => telemetry.trackEvent('button_click')).not.toThrow();
-    });
-
-    it('can be called with event name and attributes', () => {
-      expect(() => telemetry.trackEvent('button_click', { button_id: 'submit' })).not.toThrow();
-    });
-  });
-
-  describe('trackPerformerAction', () => {
-    it('exports trackPerformerAction function', () => {
-      expect(telemetry.trackPerformerAction).toBeDefined();
-      expect(typeof telemetry.trackPerformerAction).toBe('function');
-    });
-
-    it('can be called with action only', () => {
-      expect(() => telemetry.trackPerformerAction('profile_update')).not.toThrow();
-    });
-
-    it('can be called with action and metadata', () => {
-      expect(() => telemetry.trackPerformerAction('profile_update', { field: 'bio' })).not.toThrow();
-    });
-  });
-
-  describe('trackError', () => {
-    it('exports trackError function', () => {
-      expect(telemetry.trackError).toBeDefined();
-      expect(typeof telemetry.trackError).toBe('function');
-    });
-
-    it('can be called with Error object', () => {
-      const error = new Error('Test error');
-      expect(() => telemetry.trackError(error)).not.toThrow();
-    });
-
-    it('can be called with Error and context', () => {
-      const error = new Error('Test error');
-      expect(() => telemetry.trackError(error, { component: 'TestComponent' })).not.toThrow();
-    });
-
-    it('handles error without stack trace', () => {
-      const error = { message: 'Simple error', name: 'SimpleError' };
-      expect(() => telemetry.trackError(error)).not.toThrow();
-    });
-
-    it('handles string error', () => {
-      expect(() => telemetry.trackError('String error message')).not.toThrow();
-    });
-  });
-
-  describe('trackAPICall', () => {
-    it('exports trackAPICall function', () => {
-      expect(telemetry.trackAPICall).toBeDefined();
-      expect(typeof telemetry.trackAPICall).toBe('function');
-    });
-
-    it('can be called with basic parameters', () => {
-      expect(() => telemetry.trackAPICall('GET', '/api/users', 200, 150)).not.toThrow();
-    });
-
-    it('can be called with additional attributes', () => {
-      expect(() => telemetry.trackAPICall('POST', '/api/users', 201, 200, { user_id: '123' })).not.toThrow();
-    });
-
-    it('handles error status codes', () => {
-      expect(() => telemetry.trackAPICall('GET', '/api/users', 500, 100)).not.toThrow();
-    });
-
-    it('handles 4xx status codes', () => {
-      expect(() => telemetry.trackAPICall('GET', '/api/users', 404, 50)).not.toThrow();
-    });
-  });
-
-  describe('trackUserAction', () => {
-    it('exports trackUserAction function', () => {
-      expect(telemetry.trackUserAction).toBeDefined();
-      expect(typeof telemetry.trackUserAction).toBe('function');
-    });
-
-    it('can be called with action only', () => {
-      expect(() => telemetry.trackUserAction('login')).not.toThrow();
-    });
-
-    it('can be called with action and metadata', () => {
-      expect(() => telemetry.trackUserAction('login', { method: 'email' })).not.toThrow();
-    });
-  });
-
-  describe('shutdownTelemetry', () => {
-    it('exports shutdownTelemetry function', () => {
-      expect(telemetry.shutdownTelemetry).toBeDefined();
-      expect(typeof telemetry.shutdownTelemetry).toBe('function');
-    });
-
-    it('can be called without errors', async () => {
-      await expect(telemetry.shutdownTelemetry()).resolves.not.toThrow();
-    });
-
-    it('handles shutdown when not initialized', async () => {
-      vi.resetModules();
-      const tempWindow = global.window;
-      delete global.window;
-
-      const freshTelemetry = await import('./telemetry.js');
-      global.window = tempWindow;
-
-      await expect(freshTelemetry.shutdownTelemetry()).resolves.not.toThrow();
-    });
-  });
-
-  describe('Module auto-initialization', () => {
-    it('adds DOMContentLoaded listener when document is loading', async () => {
-      vi.resetModules();
-
-      global.document = {
-        readyState: 'loading',
-        addEventListener: vi.fn(),
-        title: 'Test',
-        referrer: '',
-      };
-
-      await import('./telemetry.js');
-
-      expect(global.document.addEventListener).toHaveBeenCalledWith(
-        'DOMContentLoaded',
-        expect.any(Function)
-      );
-    });
-
-    it('initializes immediately when document is ready', async () => {
-      vi.resetModules();
-
-      global.document = {
-        readyState: 'complete',
-        title: 'Test',
-        referrer: '',
-        addEventListener: vi.fn(),
-      };
-
-      await import('./telemetry.js');
-    });
-
-    it('adds beforeunload listener for cleanup', async () => {
-      vi.resetModules();
-
-      global.window.addEventListener = vi.fn();
-
-      await import('./telemetry.js');
-
-      expect(global.window.addEventListener).toHaveBeenCalledWith(
-        'beforeunload',
-        expect.any(Function)
-      );
-    });
-  });
-
-  describe('SSR trace context connection', () => {
-    it('handles missing SSR trace context', async () => {
-      vi.resetModules();
-
-      global.window.__TRACE_CONTEXT__ = null;
-
-      await expect(import('./telemetry.js')).resolves.not.toThrow();
-    });
-
-    it('handles SSR trace context when present', async () => {
-      vi.resetModules();
-
-      global.window.__TRACE_CONTEXT__ = {
-        traceId: 'test-trace-id',
-        spanId: 'test-span-id',
-        traceFlags: 1,
-      };
-
-      await expect(import('./telemetry.js')).resolves.not.toThrow();
-    });
-  });
-});
-
-describe('Telemetry with traces disabled', () => {
-  let telemetry;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    vi.stubEnv('VITE_OTEL_TRACES_ENABLED', 'false');
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('initTelemetry returns early when tracing is disabled', () => {
-    // Should return early without throwing when traces are disabled
-    expect(() => telemetry.initTelemetry({ tracesEnabled: false })).not.toThrow();
-    // Verify tracer is not initialized (trackPageView should be a no-op)
-    expect(() => telemetry.trackPageView('/test')).not.toThrow();
-  });
-});
-
-describe('Telemetry debug mode', () => {
-  let telemetry;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    vi.stubEnv('VITE_OTEL_DEBUG', 'true');
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('can initialize with debug mode enabled', () => {
-    expect(() => telemetry.initTelemetry()).not.toThrow();
-  });
-});
-
-describe('Telemetry shutdown error handling', () => {
-  let telemetry;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    // Mock shutdown to throw error - Vitest 4.x requires class syntax
-    vi.mock('@opentelemetry/sdk-trace-web', () => ({
-      WebTracerProvider: class MockWebTracerProviderWithError {
-        constructor() {
-          this.addSpanProcessor = vi.fn();
-          this.register = vi.fn();
-          this.shutdown = vi.fn().mockRejectedValue(new Error('Shutdown failed'));
-        }
-        getTracer() {
-          return {
-            startSpan: vi.fn().mockReturnValue({
-              setAttribute: vi.fn(),
-              setStatus: vi.fn(),
-              recordException: vi.fn(),
-              end: vi.fn(),
-              name: 'test-span',
-            }),
-          };
-        }
-      },
-    }));
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('handles shutdown error gracefully', async () => {
-    const consoleErrorSpy = vi.spyOn(console, 'error');
-    telemetry.initTelemetry();
-    await telemetry.shutdownTelemetry();
-    // Should not throw, just log error
-    expect(consoleErrorSpy).toBeDefined();
-  });
-});
-
-describe('Telemetry DOMContentLoaded event', () => {
-  let telemetry;
-  let domContentLoadedCallback;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    // Mock document with loading state
-    global.document = {
-      readyState: 'loading',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn((event, callback) => {
-        if (event === 'DOMContentLoaded') {
-          domContentLoadedCallback = callback;
-        }
-      }),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('registers DOMContentLoaded event listener when document is loading', () => {
-    expect(document.addEventListener).toHaveBeenCalledWith('DOMContentLoaded', expect.any(Function));
-  });
-
-  it('calls initTelemetry and connectWithSSRTrace when DOMContentLoaded fires', () => {
-    // Trigger the DOMContentLoaded callback
-    if (domContentLoadedCallback) {
-      expect(() => domContentLoadedCallback()).not.toThrow();
-    }
-  });
-});
-
-describe('Telemetry beforeunload event', () => {
-  let beforeUnloadCallback;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn((event, callback) => {
-        if (event === 'beforeunload') {
-          beforeUnloadCallback = callback;
-        }
-      }),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('registers beforeunload event listener', () => {
-    expect(window.addEventListener).toHaveBeenCalledWith('beforeunload', expect.any(Function));
-  });
-
-  it('calls shutdownTelemetry when beforeunload fires', () => {
-    if (beforeUnloadCallback) {
-      expect(() => beforeUnloadCallback()).not.toThrow();
-    }
-  });
-});
-
-describe('getTelemetryConfig', () => {
-  let telemetry;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('exports getTelemetryConfig function', () => {
-    expect(telemetry.getTelemetryConfig).toBeDefined();
-    expect(typeof telemetry.getTelemetryConfig).toBe('function');
-  });
-
-  it('returns telemetry configuration object', () => {
-    const config = telemetry.getTelemetryConfig();
-    expect(config).toBeDefined();
-    expect(config).toHaveProperty('serviceName');
-    expect(config).toHaveProperty('serviceVersion');
-    expect(config).toHaveProperty('environment');
-    expect(config).toHaveProperty('tracesEnabled');
-  });
-});
-
-describe('setupAutoTelemetry', () => {
-  let telemetry;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test',
-      referrer: '',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test',
-      language: 'en',
-      platform: 'test',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.unstubAllEnvs();
-    vi.clearAllMocks();
-  });
-
-  it('exports setupAutoTelemetry function', () => {
-    expect(telemetry.setupAutoTelemetry).toBeDefined();
-    expect(typeof telemetry.setupAutoTelemetry).toBe('function');
-  });
-
-  it('can be called without errors', () => {
-    expect(() => telemetry.setupAutoTelemetry()).not.toThrow();
-  });
-
-  it('does not throw when window is undefined', () => {
-    const tempWindow = global.window;
-    delete global.window;
-
-    expect(() => telemetry.setupAutoTelemetry()).not.toThrow();
-
-    global.window = tempWindow;
-  });
-});
-
-describe('Telemetry tracking with initialized tracer', () => {
-  let telemetry;
-  let mockSpan;
-  let mockTracer;
-  let mockTracerProvider;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    // Create mock span
-    mockSpan = {
-      setAttribute: vi.fn().mockReturnThis(),
-      setStatus: vi.fn().mockReturnThis(),
-      recordException: vi.fn().mockReturnThis(),
-      end: vi.fn(),
-      name: 'test-span',
-    };
-
-    // Create mock tracer
-    mockTracer = {
-      startSpan: vi.fn().mockReturnValue(mockSpan),
-    };
-
-    // Create mock tracer provider
-    mockTracerProvider = {
-      addSpanProcessor: vi.fn(),
-      register: vi.fn(),
-      getTracer: vi.fn().mockReturnValue(mockTracer),
-      shutdown: vi.fn().mockResolvedValue(undefined),
-    };
-
-    // Mock WebTracerProvider to return our mock - Vitest 4.x requires class syntax
-    vi.doMock('@opentelemetry/sdk-trace-web', () => ({
-      WebTracerProvider: class MockWebTracerProviderForTracking {
-        constructor() {
-          Object.assign(this, mockTracerProvider);
-        }
-      },
-    }));
-
-    // Mock registerInstrumentations to avoid instrumentation errors
-    vi.doMock('@opentelemetry/instrumentation', () => ({
-      registerInstrumentations: vi.fn(),
-    }));
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '?test=1',
-        hash: '#section',
-        href: 'http://localhost/performers?test=1#section',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: null,
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test Page',
-      referrer: 'http://localhost/',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test-agent',
-      language: 'en-US',
-      platform: 'test-platform',
-    };
-
-    telemetry = await import('./telemetry.js');
-
-    // Initialize telemetry to set up tracer
-    telemetry.initTelemetry();
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-    vi.doUnmock('@opentelemetry/sdk-trace-web');
-    vi.doUnmock('@opentelemetry/instrumentation');
-  });
-
-  describe('trackPageView with tracer', () => {
-    it('creates a span with page attributes', () => {
-      telemetry.trackPageView('/test-page', 'Test Title');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('page_view', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'page.path': '/test-page',
-          'page.title': 'Test Title',
-        }),
-      }));
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('uses document title when pageTitle is not provided', () => {
-      telemetry.trackPageView('/test-page');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('page_view', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'page.title': 'Test Page',
-        }),
-      }));
-    });
-  });
-
-  describe('trackEvent with tracer', () => {
-    it('creates a span with event attributes', () => {
-      telemetry.trackEvent('button_click', { button_id: 'submit' });
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('event.button_click', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'event.name': 'button_click',
-          'button_id': 'submit',
-        }),
-      }));
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('creates a span without additional attributes', () => {
-      telemetry.trackEvent('page_load');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('event.page_load', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'event.name': 'page_load',
-        }),
-      }));
-    });
-  });
-
-  describe('trackError with tracer', () => {
-    it('creates a span with error details', () => {
-      const error = new Error('Test error');
-      error.stack = 'Error: Test error\n    at line 1';
-
-      telemetry.trackError(error, { component: 'TestComponent' });
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'error.message': 'Test error',
-          'error.stack': error.stack,
-          'error.type': 'Error',
-        }),
-      }));
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2, message: 'Test error' });
-      expect(mockSpan.recordException).toHaveBeenCalledWith(error);
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('handles error without stack trace', () => {
-      const error = { message: 'Simple error', name: 'SimpleError' };
-
-      telemetry.trackError(error);
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'error.message': 'Simple error',
-          'error.type': 'SimpleError',
-        }),
-      }));
-    });
-
-    it('handles string error', () => {
-      telemetry.trackError('String error');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'error.message': 'String error',
-        }),
-      }));
-    });
-  });
-
-  describe('trackAPICall with tracer', () => {
-    it('creates a span for successful API call', () => {
-      telemetry.trackAPICall('GET', '/api/users', 200, 150, { user_id: '123' });
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('api_call', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'http.method': 'GET',
-          'http.url': '/api/users',
-          'http.status_code': 200,
-          'http.duration_ms': 150,
-          'user_id': '123',
-        }),
-      }));
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 0 });
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('creates a span for failed API call with 4xx', () => {
-      telemetry.trackAPICall('GET', '/api/users', 404, 50);
-
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2 });
-    });
-
-    it('creates a span for failed API call with 5xx', () => {
-      telemetry.trackAPICall('POST', '/api/users', 500, 100);
-
-      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2 });
-    });
-  });
-
-  describe('trackUserAction with tracer', () => {
-    it('creates a span for user action', () => {
-      telemetry.trackUserAction('login', { method: 'email' });
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('user.login', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'user.action': 'login',
-          'user.metadata': JSON.stringify({ method: 'email' }),
-        }),
-      }));
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('creates a span without metadata', () => {
-      telemetry.trackUserAction('logout');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('user.logout', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'user.action': 'logout',
-        }),
-      }));
-    });
-  });
-
-  describe('trackPerformerAction with tracer', () => {
-    it('creates a span for performer action', () => {
-      telemetry.trackPerformerAction('profile_update', { field: 'bio' });
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('performer.profile_update', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'performer.action': 'profile_update',
-          'performer.metadata': JSON.stringify({ field: 'bio' }),
-        }),
-      }));
-      expect(mockSpan.end).toHaveBeenCalled();
-    });
-
-    it('creates a span without metadata', () => {
-      telemetry.trackPerformerAction('gig_accepted');
-
-      expect(mockTracer.startSpan).toHaveBeenCalledWith('performer.gig_accepted', expect.objectContaining({
-        attributes: expect.objectContaining({
-          'performer.action': 'gig_accepted',
-        }),
-      }));
-    });
-  });
-
-  describe('shutdownTelemetry with tracer', () => {
-    it('shuts down successfully', async () => {
-      await telemetry.shutdownTelemetry();
-
-      expect(mockTracerProvider.shutdown).toHaveBeenCalled();
-      // Debug logging is now controlled by consoleDebug config flag
-    });
-  });
-});
-
-describe('connectWithSSRTrace functionality', () => {
-  let telemetry;
-  let mockSpan;
-  let mockTracer;
-  let mockTracerProvider;
-
-  beforeEach(async () => {
-    vi.resetModules();
-
-    // Create mock span
-    mockSpan = {
-      setAttribute: vi.fn().mockReturnThis(),
-      setStatus: vi.fn().mockReturnThis(),
-      recordException: vi.fn().mockReturnThis(),
-      end: vi.fn(),
-      name: 'client.init',
-    };
-
-    // Create mock tracer
-    mockTracer = {
-      startSpan: vi.fn().mockReturnValue(mockSpan),
-    };
-
-    // Create mock tracer provider
-    mockTracerProvider = {
-      addSpanProcessor: vi.fn(),
-      register: vi.fn(),
-      getTracer: vi.fn().mockReturnValue(mockTracer),
-      shutdown: vi.fn().mockResolvedValue(undefined),
-    };
-
-    // Mock WebTracerProvider to return our mock - Vitest 4.x requires class syntax
-    vi.doMock('@opentelemetry/sdk-trace-web', () => ({
-      WebTracerProvider: class MockWebTracerProviderForSSR {
-        constructor() {
-          Object.assign(this, mockTracerProvider);
-        }
-      },
-    }));
-
-    // Mock registerInstrumentations
-    vi.doMock('@opentelemetry/instrumentation', () => ({
-      registerInstrumentations: vi.fn(),
-    }));
-
-    global.window = {
-      location: {
-        pathname: '/performers',
-        search: '',
-        hash: '',
-        href: 'http://localhost/performers',
-      },
-      addEventListener: vi.fn(),
-      __TRACE_CONTEXT__: {
-        traceId: 'test-trace-123',
-        spanId: 'test-span-456',
-        traceFlags: 1,
-      },
-    };
-
-    global.document = {
-      readyState: 'complete',
-      title: 'Test Page',
-      referrer: 'http://localhost/',
-      addEventListener: vi.fn(),
-    };
-
-    global.navigator = {
-      userAgent: 'test-agent',
-      language: 'en-US',
-      platform: 'test-platform',
-    };
-
-    telemetry = await import('./telemetry.js');
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-    vi.doUnmock('@opentelemetry/sdk-trace-web');
-    vi.doUnmock('@opentelemetry/instrumentation');
-  });
-
-  it('connects with SSR trace context when available', () => {
-    // Manually call initTelemetry which should also trigger connectWithSSRTrace
-    telemetry.initTelemetry();
-    telemetry.setupAutoTelemetry();
-
-    // Check that a span was created with SSR trace context
-    expect(mockTracer.startSpan).toHaveBeenCalledWith('client.init', expect.objectContaining({
-      attributes: expect.objectContaining({
-        'span.kind': 'client',
-        'client.type': 'browser',
-        'ssr.trace_id': 'test-trace-123',
-        'ssr.span_id': 'test-span-456',
-      }),
-      links: expect.arrayContaining([
-        expect.objectContaining({
-          context: expect.objectContaining({
-            traceId: 'test-trace-123',
-            spanId: 'test-span-456',
-            traceFlags: 1,
-          }),
-        }),
-      ]),
-    }));
-    expect(mockSpan.end).toHaveBeenCalled();
-  });
-});
+// @ts-nocheck
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+
+// Vitest 4.x requires class syntax for constructor mocks
+// Mock all OpenTelemetry modules before importing telemetry
+vi.mock('@opentelemetry/sdk-trace-web', () => ({
+  WebTracerProvider: class MockWebTracerProvider {
+    constructor() {
+      this.addSpanProcessor = vi.fn();
+      this.register = vi.fn();
+      this.shutdown = vi.fn().mockResolvedValue(undefined);
+    }
+    getTracer() {
+      return {
+        startSpan: vi.fn().mockReturnValue({
+          setAttribute: vi.fn(),
+          setStatus: vi.fn(),
+          recordException: vi.fn(),
+          end: vi.fn(),
+          name: 'test-span',
+        }),
+      };
+    }
+  },
+}));
+
+vi.mock('@opentelemetry/sdk-trace-base', () => ({
+  BatchSpanProcessor: class MockBatchSpanProcessor {},
+}));
+
+vi.mock('@opentelemetry/exporter-trace-otlp-http', () => ({
+  OTLPTraceExporter: class MockOTLPTraceExporter {},
+}));
+
+vi.mock('@opentelemetry/resources', () => ({
+  resourceFromAttributes: vi.fn((attrs) => attrs),
+}));
+
+vi.mock('@opentelemetry/semantic-conventions', () => ({
+  ATTR_SERVICE_NAME: 'service.name',
+  ATTR_SERVICE_VERSION: 'service.version',
+}));
+
+vi.mock('@opentelemetry/instrumentation-document-load', () => ({
+  DocumentLoadInstrumentation: class MockDocumentLoadInstrumentation {
+    constructor() {
+      this.enable = vi.fn();
+    }
+  },
+}));
+
+vi.mock('@opentelemetry/instrumentation-fetch', () => ({
+  FetchInstrumentation: class MockFetchInstrumentation {
+    constructor() {
+      this.enable = vi.fn();
+    }
+  },
+}));
+
+vi.mock('@opentelemetry/instrumentation-xml-http-request', () => ({
+  XMLHttpRequestInstrumentation: class MockXMLHttpRequestInstrumentation {
+    constructor() {
+      this.enable = vi.fn();
+    }
+  },
+}));
+
+vi.mock('@opentelemetry/instrumentation-user-interaction', () => ({
+  UserInteractionInstrumentation: class MockUserInteractionInstrumentation {
+    constructor() {
+      this.enable = vi.fn();
+    }
+  },
+}));
+
+vi.mock('@opentelemetry/instrumentation', () => ({
+  registerInstrumentations: vi.fn(),
+}));
+
+
+vi.mock('@opentelemetry/context-zone', () => ({
+  ZoneContextManager: class MockZoneContextManager {},
+}));
+
+vi.mock('@opentelemetry/propagator-b3', () => ({
+  B3Propagator: class MockB3Propagator {},
+}));
+
+describe('Telemetry Module', () => {
+  let telemetry;
+  let originalWindow;
+  let originalDocument;
+  let mockSpan;
+  let mockTracer;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    // Save original globals
+    originalWindow = global.window;
+    originalDocument = global.document;
+
+    // Create mock span
+    mockSpan = {
+      setAttribute: vi.fn(),
+      setStatus: vi.fn(),
+      recordException: vi.fn(),
+      end: vi.fn(),
+      name: 'test-span',
+    };
+
+    // Create mock tracer
+    mockTracer = {
+      startSpan: vi.fn().mockReturnValue(mockSpan),
+    };
+
+    // Setup mock window
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '?test=1',
+        hash: '#section',
+        href: 'http://localhost/performers?test=1#section',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test Page',
+      referrer: 'http://localhost/',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test-agent',
+      language: 'en-US',
+      platform: 'test-platform',
+    };
+
+    // Re-import with fresh mocks
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    global.window = originalWindow;
+    global.document = originalDocument;
+    vi.clearAllMocks();
+  });
+
+  describe('initTelemetry', () => {
+    it('exports initTelemetry function', () => {
+      expect(telemetry.initTelemetry).toBeDefined();
+      expect(typeof telemetry.initTelemetry).toBe('function');
+    });
+
+    it('can be called without errors', () => {
+      expect(() => telemetry.initTelemetry()).not.toThrow();
+    });
+  });
+
+  describe('startSpan', () => {
+    it('exports startSpan function', () => {
+      expect(telemetry.startSpan).toBeDefined();
+      expect(typeof telemetry.startSpan).toBe('function');
+    });
+
+    it('returns null when tracer is not initialized', async () => {
+      vi.resetModules();
+      const tempWindow = global.window;
+      delete global.window;
+
+      const freshTelemetry = await import('./telemetry.js');
+      global.window = tempWindow;
+
+      const result = freshTelemetry.startSpan('test-span');
+      expect(result).toBeNull();
+    });
+
+    it('can be called with name only', () => {
+      telemetry.initTelemetry();
+      const result = telemetry.startSpan('test-span');
+      expect(result === null || typeof result === 'object').toBe(true);
+    });
+
+    it('can be called with name and options', () => {
+      telemetry.initTelemetry();
+      const result = telemetry.startSpan('test-span', { attributes: { key: 'value' } });
+      expect(result === null || typeof result === 'object').toBe(true);
+    });
+  });
+
+  describe('endSpan', () => {
+    it('exports endSpan function', () => {
+      expect(telemetry.endSpan).toBeDefined();
+      expect(typeof telemetry.endSpan).toBe('function');
+    });
+
+    it('handles null span gracefully', () => {
+      expect(() => telemetry.endSpan(null)).not.toThrow();
+    });
+
+    it('handles undefined span gracefully', () => {
+      expect(() => telemetry.endSpan(undefined)).not.toThrow();
+    });
+
+    it('can end a span with default status', () => {
+      expect(() => telemetry.endSpan(mockSpan)).not.toThrow();
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 0 });
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('can end a span with custom status', () => {
+      expect(() => telemetry.endSpan(mockSpan, { code: 2, message: 'error' })).not.toThrow();
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2, message: 'error' });
+    });
+  });
+
+  describe('trackPageView', () => {
+    it('exports trackPageView function', () => {
+      expect(telemetry.trackPageView).toBeDefined();
+      expect(typeof telemetry.trackPageView).toBe('function');
+    });
+
+    it('can be called without errors', () => {
+      expect(() => telemetry.trackPageView('/test-page')).not.toThrow();
+    });
+
+    it('can be called with page path and title', () => {
+      expect(() => telemetry.trackPageView('/test-page', 'Test Page Title')).not.toThrow();
+    });
+
+    it('returns early when tracer is not initialized', () => {
+      const result = telemetry.trackPageView('/test');
+      expect(result).toBeUndefined();
+    });
+  });
+
+  describe('trackEvent', () => {
+    it('exports trackEvent function', () => {
+      expect(telemetry.trackEvent).toBeDefined();
+      expect(typeof telemetry.trackEvent).toBe('function');
+    });
+
+    it('can be called with event name only', () => {
+      expect(() => telemetry.trackEvent('button_click')).not.toThrow();
+    });
+
+    it('can be called with event name and attributes', () => {
+      expect(() => telemetry.trackEvent('button_click', { button_id: 'submit' })).not.toThrow();
+    });
+  });
+
+  describe('trackPerformerAction', () => {
+    it('exports trackPerformerAction function', () => {
+      expect(telemetry.trackPerformerAction).toBeDefined();
+      expect(typeof telemetry.trackPerformerAction).toBe('function');
+    });
+
+    it('can be called with action only', () => {
+      expect(() => telemetry.trackPerformerAction('profile_update')).not.toThrow();
+    });
+
+    it('can be called with action and metadata', () => {
+      expect(() => telemetry.trackPerformerAction('profile_update', { field: 'bio' })).not.toThrow();
+    });
+  });
+
+  describe('trackError', () => {
+    it('exports trackError function', () => {
+      expect(telemetry.trackError).toBeDefined();
+      expect(typeof telemetry.trackError).toBe('function');
+    });
+
+    it('can be called with Error object', () => {
+      const error = new Error('Test error');
+      expect(() => telemetry.trackError(error)).not.toThrow();
+    });
+
+    it('can be called with Error and context', () => {
+      const error = new Error('Test error');
+      expect(() => telemetry.trackError(error, { component: 'TestComponent' })).not.toThrow();
+    });
+
+    it('handles error without stack trace', () => {
+      const error = { message: 'Simple error', name: 'SimpleError' };
+      expect(() => telemetry.trackError(error)).not.toThrow();
+    });
+
+    it('handles string error', () => {
+      expect(() => telemetry.trackError('String error message')).not.toThrow();
+    });
+  });
+
+  describe('trackAPICall', () => {
+    it('exports trackAPICall function', () => {
+      expect(telemetry.trackAPICall).toBeDefined();
+      expect(typeof telemetry.trackAPICall).toBe('function');
+    });
+
+    it('can be called with basic parameters', () => {
+      expect(() => telemetry.trackAPICall('GET', '/api/users', 200, 150)).not.toThrow();
+    });
+
+    it('can be called with additional attributes', () => {
+      expect(() => telemetry.trackAPICall('POST', '/api/users', 201, 200, { user_id: '123' })).not.toThrow();
+    });
+
+    it('handles error status codes', () => {
+      expect(() => telemetry.trackAPICall('GET', '/api/users', 500, 100)).not.toThrow();
+    });
+
+    it('handles 4xx status codes', () => {
+      expect(() => telemetry.trackAPICall('GET', '/api/users', 404, 50)).not.toThrow();
+    });
+  });
+
+  describe('trackUserAction', () => {
+    it('exports trackUserAction function', () => {
+      expect(telemetry.trackUserAction).toBeDefined();
+      expect(typeof telemetry.trackUserAction).toBe('function');
+    });
+
+    it('can be called with action only', () => {
+      expect(() => telemetry.trackUserAction('login')).not.toThrow();
+    });
+
+    it('can be called with action and metadata', () => {
+      expect(() => telemetry.trackUserAction('login', { method: 'email' })).not.toThrow();
+    });
+  });
+
+  describe('shutdownTelemetry', () => {
+    it('exports shutdownTelemetry function', () => {
+      expect(telemetry.shutdownTelemetry).toBeDefined();
+      expect(typeof telemetry.shutdownTelemetry).toBe('function');
+    });
+
+    it('can be called without errors', async () => {
+      await expect(telemetry.shutdownTelemetry()).resolves.not.toThrow();
+    });
+
+    it('handles shutdown when not initialized', async () => {
+      vi.resetModules();
+      const tempWindow = global.window;
+      delete global.window;
+
+      const freshTelemetry = await import('./telemetry.js');
+      global.window = tempWindow;
+
+      await expect(freshTelemetry.shutdownTelemetry()).resolves.not.toThrow();
+    });
+  });
+
+  describe('Module auto-initialization', () => {
+    it('adds DOMContentLoaded listener when document is loading', async () => {
+      vi.resetModules();
+
+      global.document = {
+        readyState: 'loading',
+        addEventListener: vi.fn(),
+        title: 'Test',
+        referrer: '',
+      };
+
+      await import('./telemetry.js');
+
+      expect(global.document.addEventListener).toHaveBeenCalledWith(
+        'DOMContentLoaded',
+        expect.any(Function)
+      );
+    });
+
+    it('initializes immediately when document is ready', async () => {
+      vi.resetModules();
+
+      global.document = {
+        readyState: 'complete',
+        title: 'Test',
+        referrer: '',
+        addEventListener: vi.fn(),
+      };
+
+      await import('./telemetry.js');
+    });
+
+    it('adds beforeunload listener for cleanup', async () => {
+      vi.resetModules();
+
+      global.window.addEventListener = vi.fn();
+
+      await import('./telemetry.js');
+
+      expect(global.window.addEventListener).toHaveBeenCalledWith(
+        'beforeunload',
+        expect.any(Function)
+      );
+    });
+  });
+
+  describe('SSR trace context connection', () => {
+    it('handles missing SSR trace context', async () => {
+      vi.resetModules();
+
+      global.window.__TRACE_CONTEXT__ = null;
+
+      await expect(import('./telemetry.js')).resolves.not.toThrow();
+    });
+
+    it('handles SSR trace context when present', async () => {
+      vi.resetModules();
+
+      global.window.__TRACE_CONTEXT__ = {
+        traceId: 'test-trace-id',
+        spanId: 'test-span-id',
+        traceFlags: 1,
+      };
+
+      await expect(import('./telemetry.js')).resolves.not.toThrow();
+    });
+  });
+});
+
+describe('Telemetry with traces disabled', () => {
+  let telemetry;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    vi.stubEnv('VITE_OTEL_TRACES_ENABLED', 'false');
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('initTelemetry returns early when tracing is disabled', () => {
+    // Should return early without throwing when traces are disabled
+    expect(() => telemetry.initTelemetry({ tracesEnabled: false })).not.toThrow();
+    // Verify tracer is not initialized (trackPageView should be a no-op)
+    expect(() => telemetry.trackPageView('/test')).not.toThrow();
+  });
+});
+
+describe('Telemetry debug mode', () => {
+  let telemetry;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    vi.stubEnv('VITE_OTEL_DEBUG', 'true');
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('can initialize with debug mode enabled', () => {
+    expect(() => telemetry.initTelemetry()).not.toThrow();
+  });
+});
+
+describe('Telemetry shutdown error handling', () => {
+  let telemetry;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    // Mock shutdown to throw error - Vitest 4.x requires class syntax
+    vi.mock('@opentelemetry/sdk-trace-web', () => ({
+      WebTracerProvider: class MockWebTracerProviderWithError {
+        constructor() {
+          this.addSpanProcessor = vi.fn();
+          this.register = vi.fn();
+          this.shutdown = vi.fn().mockRejectedValue(new Error('Shutdown failed'));
+        }
+        getTracer() {
+          return {
+            startSpan: vi.fn().mockReturnValue({
+              setAttribute: vi.fn(),
+              setStatus: vi.fn(),
+              recordException: vi.fn(),
+              end: vi.fn(),
+              name: 'test-span',
+            }),
+          };
+        }
+      },
+    }));
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('handles shutdown error gracefully', async () => {
+    const consoleErrorSpy = vi.spyOn(console, 'error');
+    telemetry.initTelemetry();
+    await telemetry.shutdownTelemetry();
+    // Should not throw, just log error
+    expect(consoleErrorSpy).toBeDefined();
+  });
+});
+
+describe('Telemetry DOMContentLoaded event', () => {
+  let telemetry;
+  let domContentLoadedCallback;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    // Mock document with loading state
+    global.document = {
+      readyState: 'loading',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn((event, callback) => {
+        if (event === 'DOMContentLoaded') {
+          domContentLoadedCallback = callback;
+        }
+      }),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('registers DOMContentLoaded event listener when document is loading', () => {
+    expect(document.addEventListener).toHaveBeenCalledWith('DOMContentLoaded', expect.any(Function));
+  });
+
+  it('calls initTelemetry and connectWithSSRTrace when DOMContentLoaded fires', () => {
+    // Trigger the DOMContentLoaded callback
+    if (domContentLoadedCallback) {
+      expect(() => domContentLoadedCallback()).not.toThrow();
+    }
+  });
+});
+
+describe('Telemetry beforeunload event', () => {
+  let beforeUnloadCallback;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn((event, callback) => {
+        if (event === 'beforeunload') {
+          beforeUnloadCallback = callback;
+        }
+      }),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('registers beforeunload event listener', () => {
+    expect(window.addEventListener).toHaveBeenCalledWith('beforeunload', expect.any(Function));
+  });
+
+  it('calls shutdownTelemetry when beforeunload fires', () => {
+    if (beforeUnloadCallback) {
+      expect(() => beforeUnloadCallback()).not.toThrow();
+    }
+  });
+});
+
+describe('getTelemetryConfig', () => {
+  let telemetry;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('exports getTelemetryConfig function', () => {
+    expect(telemetry.getTelemetryConfig).toBeDefined();
+    expect(typeof telemetry.getTelemetryConfig).toBe('function');
+  });
+
+  it('returns telemetry configuration object', () => {
+    const config = telemetry.getTelemetryConfig();
+    expect(config).toBeDefined();
+    expect(config).toHaveProperty('serviceName');
+    expect(config).toHaveProperty('serviceVersion');
+    expect(config).toHaveProperty('environment');
+    expect(config).toHaveProperty('tracesEnabled');
+  });
+});
+
+describe('setupAutoTelemetry', () => {
+  let telemetry;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test',
+      referrer: '',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test',
+      language: 'en',
+      platform: 'test',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.unstubAllEnvs();
+    vi.clearAllMocks();
+  });
+
+  it('exports setupAutoTelemetry function', () => {
+    expect(telemetry.setupAutoTelemetry).toBeDefined();
+    expect(typeof telemetry.setupAutoTelemetry).toBe('function');
+  });
+
+  it('can be called without errors', () => {
+    expect(() => telemetry.setupAutoTelemetry()).not.toThrow();
+  });
+
+  it('does not throw when window is undefined', () => {
+    const tempWindow = global.window;
+    delete global.window;
+
+    expect(() => telemetry.setupAutoTelemetry()).not.toThrow();
+
+    global.window = tempWindow;
+  });
+});
+
+describe('Telemetry tracking with initialized tracer', () => {
+  let telemetry;
+  let mockSpan;
+  let mockTracer;
+  let mockTracerProvider;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    // Create mock span
+    mockSpan = {
+      setAttribute: vi.fn().mockReturnThis(),
+      setStatus: vi.fn().mockReturnThis(),
+      recordException: vi.fn().mockReturnThis(),
+      end: vi.fn(),
+      name: 'test-span',
+    };
+
+    // Create mock tracer
+    mockTracer = {
+      startSpan: vi.fn().mockReturnValue(mockSpan),
+    };
+
+    // Create mock tracer provider
+    mockTracerProvider = {
+      addSpanProcessor: vi.fn(),
+      register: vi.fn(),
+      getTracer: vi.fn().mockReturnValue(mockTracer),
+      shutdown: vi.fn().mockResolvedValue(undefined),
+    };
+
+    // Mock all OpenTelemetry dependencies needed by initTelemetry
+    vi.doMock('@opentelemetry/sdk-trace-web', () => ({
+      WebTracerProvider: class MockWebTracerProviderForTracking {
+        constructor() {
+          Object.assign(this, mockTracerProvider);
+        }
+      },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation', () => ({
+      registerInstrumentations: vi.fn(),
+    }));
+
+    vi.doMock('@opentelemetry/resources', () => ({
+      resourceFromAttributes: vi.fn().mockReturnValue({}),
+    }));
+
+    vi.doMock('@opentelemetry/exporter-trace-otlp-http', () => ({
+      OTLPTraceExporter: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/sdk-trace-base', () => ({
+      BatchSpanProcessor: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/context-zone', () => ({
+      ZoneContextManager: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/propagator-b3', () => ({
+      B3Propagator: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/semantic-conventions', () => ({
+      ATTR_SERVICE_NAME: 'service.name',
+      ATTR_SERVICE_VERSION: 'service.version',
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-document-load', () => ({
+      DocumentLoadInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-fetch', () => ({
+      FetchInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-user-interaction', () => ({
+      UserInteractionInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-xml-http-request', () => ({
+      XMLHttpRequestInstrumentation: class { constructor() {} },
+    }));
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '?test=1',
+        hash: '#section',
+        href: 'http://localhost/performers?test=1#section',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: null,
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test Page',
+      referrer: 'http://localhost/',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test-agent',
+      language: 'en-US',
+      platform: 'test-platform',
+    };
+
+    telemetry = await import('./telemetry.js');
+
+    // Initialize telemetry with tracing enabled to set up tracer
+    telemetry.initTelemetry({ tracesEnabled: true });
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    vi.doUnmock('@opentelemetry/sdk-trace-web');
+    vi.doUnmock('@opentelemetry/instrumentation');
+    vi.doUnmock('@opentelemetry/resources');
+    vi.doUnmock('@opentelemetry/exporter-trace-otlp-http');
+    vi.doUnmock('@opentelemetry/sdk-trace-base');
+    vi.doUnmock('@opentelemetry/context-zone');
+    vi.doUnmock('@opentelemetry/propagator-b3');
+    vi.doUnmock('@opentelemetry/semantic-conventions');
+    vi.doUnmock('@opentelemetry/instrumentation-document-load');
+    vi.doUnmock('@opentelemetry/instrumentation-fetch');
+    vi.doUnmock('@opentelemetry/instrumentation-user-interaction');
+    vi.doUnmock('@opentelemetry/instrumentation-xml-http-request');
+  });
+
+  describe('trackPageView with tracer', () => {
+    it('creates a span with page attributes', () => {
+      telemetry.trackPageView('/test-page', 'Test Title');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('page_view', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'page.path': '/test-page',
+          'page.title': 'Test Title',
+        }),
+      }));
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('uses document title when pageTitle is not provided', () => {
+      telemetry.trackPageView('/test-page');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('page_view', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'page.title': 'Test Page',
+        }),
+      }));
+    });
+  });
+
+  describe('trackEvent with tracer', () => {
+    it('creates a span with event attributes', () => {
+      telemetry.trackEvent('button_click', { button_id: 'submit' });
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('event.button_click', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'event.name': 'button_click',
+          'button_id': 'submit',
+        }),
+      }));
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('creates a span without additional attributes', () => {
+      telemetry.trackEvent('page_load');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('event.page_load', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'event.name': 'page_load',
+        }),
+      }));
+    });
+  });
+
+  describe('trackError with tracer', () => {
+    it('creates a span with error details', () => {
+      const error = new Error('Test error');
+      error.stack = 'Error: Test error\n    at line 1';
+
+      telemetry.trackError(error, { component: 'TestComponent' });
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'error.message': 'Test error',
+          'error.stack': error.stack,
+          'error.type': 'Error',
+        }),
+      }));
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2, message: 'Test error' });
+      expect(mockSpan.recordException).toHaveBeenCalledWith(error);
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('handles error without stack trace', () => {
+      const error = { message: 'Simple error', name: 'SimpleError' };
+
+      telemetry.trackError(error);
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'error.message': 'Simple error',
+          'error.type': 'SimpleError',
+        }),
+      }));
+    });
+
+    it('handles string error', () => {
+      telemetry.trackError('String error');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('error', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'error.message': 'String error',
+        }),
+      }));
+    });
+  });
+
+  describe('trackAPICall with tracer', () => {
+    it('creates a span for successful API call', () => {
+      telemetry.trackAPICall('GET', '/api/users', 200, 150, { user_id: '123' });
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('api_call', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'http.method': 'GET',
+          'http.url': '/api/users',
+          'http.status_code': 200,
+          'http.duration_ms': 150,
+          'user_id': '123',
+        }),
+      }));
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 0 });
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('creates a span for failed API call with 4xx', () => {
+      telemetry.trackAPICall('GET', '/api/users', 404, 50);
+
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2 });
+    });
+
+    it('creates a span for failed API call with 5xx', () => {
+      telemetry.trackAPICall('POST', '/api/users', 500, 100);
+
+      expect(mockSpan.setStatus).toHaveBeenCalledWith({ code: 2 });
+    });
+  });
+
+  describe('trackUserAction with tracer', () => {
+    it('creates a span for user action', () => {
+      telemetry.trackUserAction('login', { method: 'email' });
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('user.login', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'user.action': 'login',
+          'user.metadata': JSON.stringify({ method: 'email' }),
+        }),
+      }));
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('creates a span without metadata', () => {
+      telemetry.trackUserAction('logout');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('user.logout', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'user.action': 'logout',
+        }),
+      }));
+    });
+  });
+
+  describe('trackPerformerAction with tracer', () => {
+    it('creates a span for performer action', () => {
+      telemetry.trackPerformerAction('profile_update', { field: 'bio' });
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('performer.profile_update', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'performer.action': 'profile_update',
+          'performer.metadata': JSON.stringify({ field: 'bio' }),
+        }),
+      }));
+      expect(mockSpan.end).toHaveBeenCalled();
+    });
+
+    it('creates a span without metadata', () => {
+      telemetry.trackPerformerAction('gig_accepted');
+
+      expect(mockTracer.startSpan).toHaveBeenCalledWith('performer.gig_accepted', expect.objectContaining({
+        attributes: expect.objectContaining({
+          'performer.action': 'gig_accepted',
+        }),
+      }));
+    });
+  });
+
+  describe('shutdownTelemetry with tracer', () => {
+    it('shuts down successfully', async () => {
+      await telemetry.shutdownTelemetry();
+
+      expect(mockTracerProvider.shutdown).toHaveBeenCalled();
+      // Debug logging is now controlled by consoleDebug config flag
+    });
+  });
+});
+
+describe('connectWithSSRTrace functionality', () => {
+  let telemetry;
+  let mockSpan;
+  let mockTracer;
+  let mockTracerProvider;
+
+  beforeEach(async () => {
+    vi.resetModules();
+
+    // Create mock span
+    mockSpan = {
+      setAttribute: vi.fn().mockReturnThis(),
+      setStatus: vi.fn().mockReturnThis(),
+      recordException: vi.fn().mockReturnThis(),
+      end: vi.fn(),
+      name: 'client.init',
+    };
+
+    // Create mock tracer
+    mockTracer = {
+      startSpan: vi.fn().mockReturnValue(mockSpan),
+    };
+
+    // Create mock tracer provider
+    mockTracerProvider = {
+      addSpanProcessor: vi.fn(),
+      register: vi.fn(),
+      getTracer: vi.fn().mockReturnValue(mockTracer),
+      shutdown: vi.fn().mockResolvedValue(undefined),
+    };
+
+    // Mock all OpenTelemetry dependencies needed by initTelemetry
+    vi.doMock('@opentelemetry/sdk-trace-web', () => ({
+      WebTracerProvider: class MockWebTracerProviderForSSR {
+        constructor() {
+          Object.assign(this, mockTracerProvider);
+        }
+      },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation', () => ({
+      registerInstrumentations: vi.fn(),
+    }));
+
+    vi.doMock('@opentelemetry/resources', () => ({
+      resourceFromAttributes: vi.fn().mockReturnValue({}),
+    }));
+
+    vi.doMock('@opentelemetry/exporter-trace-otlp-http', () => ({
+      OTLPTraceExporter: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/sdk-trace-base', () => ({
+      BatchSpanProcessor: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/context-zone', () => ({
+      ZoneContextManager: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/propagator-b3', () => ({
+      B3Propagator: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/semantic-conventions', () => ({
+      ATTR_SERVICE_NAME: 'service.name',
+      ATTR_SERVICE_VERSION: 'service.version',
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-document-load', () => ({
+      DocumentLoadInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-fetch', () => ({
+      FetchInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-user-interaction', () => ({
+      UserInteractionInstrumentation: class { constructor() {} },
+    }));
+
+    vi.doMock('@opentelemetry/instrumentation-xml-http-request', () => ({
+      XMLHttpRequestInstrumentation: class { constructor() {} },
+    }));
+
+    global.window = {
+      location: {
+        pathname: '/performers',
+        search: '',
+        hash: '',
+        href: 'http://localhost/performers',
+      },
+      addEventListener: vi.fn(),
+      __TRACE_CONTEXT__: {
+        traceId: 'test-trace-123',
+        spanId: 'test-span-456',
+        traceFlags: 1,
+      },
+    };
+
+    global.document = {
+      readyState: 'complete',
+      title: 'Test Page',
+      referrer: 'http://localhost/',
+      addEventListener: vi.fn(),
+    };
+
+    global.navigator = {
+      userAgent: 'test-agent',
+      language: 'en-US',
+      platform: 'test-platform',
+    };
+
+    telemetry = await import('./telemetry.js');
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    vi.doUnmock('@opentelemetry/sdk-trace-web');
+    vi.doUnmock('@opentelemetry/instrumentation');
+    vi.doUnmock('@opentelemetry/resources');
+    vi.doUnmock('@opentelemetry/exporter-trace-otlp-http');
+    vi.doUnmock('@opentelemetry/sdk-trace-base');
+    vi.doUnmock('@opentelemetry/context-zone');
+    vi.doUnmock('@opentelemetry/propagator-b3');
+    vi.doUnmock('@opentelemetry/semantic-conventions');
+    vi.doUnmock('@opentelemetry/instrumentation-document-load');
+    vi.doUnmock('@opentelemetry/instrumentation-fetch');
+    vi.doUnmock('@opentelemetry/instrumentation-user-interaction');
+    vi.doUnmock('@opentelemetry/instrumentation-xml-http-request');
+  });
+
+  it('connects with SSR trace context when available', () => {
+    // Manually call initTelemetry with tracing enabled
+    telemetry.initTelemetry({ tracesEnabled: true });
+    telemetry.setupAutoTelemetry();
+
+    // Check that a span was created with SSR trace context
+    expect(mockTracer.startSpan).toHaveBeenCalledWith('client.init', expect.objectContaining({
+      attributes: expect.objectContaining({
+        'span.kind': 'client',
+        'client.type': 'browser',
+        'ssr.trace_id': 'test-trace-123',
+        'ssr.span_id': 'test-span-456',
+      }),
+      links: expect.arrayContaining([
+        expect.objectContaining({
+          context: expect.objectContaining({
+            traceId: 'test-trace-123',
+            spanId: 'test-span-456',
+            traceFlags: 1,
+          }),
+        }),
+      ]),
+    }));
+    expect(mockSpan.end).toHaveBeenCalled();
+  });
+});