@cedarai/session-replay-sdk 0.1.0

package/src/errors.test.ts

@@ -0,0 +1,146 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
+import { ErrorCapture } from './errors.js';
+import type { ErrorSessionEvent } from './types.js';
+
+describe('ErrorCapture', () => {
+  let capture: ErrorCapture;
+  let events: ErrorSessionEvent[];
+
+  beforeEach(() => {
+    events = [];
+  });
+
+  afterEach(() => {
+    capture?.stop();
+  });
+
+  // ── captureException (manual) ────────────────────────────────────────
+
+  describe('captureException', () => {
+    it('captures a manually reported error', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      const err = new Error('Something broke');
+      capture.captureException(err);
+
+      expect(events).toHaveLength(1);
+      expect(events[0].type).toBe('error');
+      expect(events[0].data.message).toBe('Something broke');
+      expect(events[0].data.type).toBe('manual');
+      expect(events[0].data.stack).toContain('Error: Something broke');
+    });
+
+    it('captures error with tags and extra', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      capture.captureException(new Error('fail'), {
+        tags: { component: 'Checkout' },
+        extra: { orderId: '123' },
+      });
+
+      expect(events[0].data.tags).toEqual({ component: 'Checkout' });
+      expect(events[0].data.extra).toEqual({ orderId: '123' });
+    });
+
+    it('adds timestamp', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      const before = Date.now();
+      capture.captureException(new Error('test'));
+      const after = Date.now();
+
+      expect(events[0].timestamp).toBeGreaterThanOrEqual(before);
+      expect(events[0].timestamp).toBeLessThanOrEqual(after);
+    });
+  });
+
+  // ── window.onerror (auto capture) ────────────────────────────────────
+
+  describe('window.onerror', () => {
+    it('captures uncaught errors via onerror handler', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      // Simulate window.onerror being called
+      const handler = globalThis.onerror as Function;
+      if (handler) {
+        handler('Uncaught Error: boom', 'app.js', 42, 10, new Error('boom'));
+      }
+
+      expect(events).toHaveLength(1);
+      expect(events[0].data.message).toBe('boom');
+      expect(events[0].data.type).toBe('uncaught');
+      expect(events[0].data.source).toBe('app.js');
+      expect(events[0].data.lineno).toBe(42);
+      expect(events[0].data.colno).toBe(10);
+    });
+
+    it('handles onerror without an Error object', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      const handler = globalThis.onerror as Function;
+      if (handler) {
+        handler('Script error.', '', 0, 0, undefined);
+      }
+
+      expect(events).toHaveLength(1);
+      expect(events[0].data.message).toBe('Script error.');
+      expect(events[0].data.stack).toBeUndefined();
+    });
+  });
+
+  // ── unhandledrejection ───────────────────────────────────────────────
+
+  describe('unhandledrejection', () => {
+    it('captures unhandled promise rejections', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      // Simulate unhandledrejection event
+      const event = new Event('unhandledrejection') as any;
+      event.reason = new Error('promise rejected');
+      globalThis.dispatchEvent(event);
+
+      expect(events).toHaveLength(1);
+      expect(events[0].data.message).toBe('promise rejected');
+      expect(events[0].data.type).toBe('unhandledrejection');
+    });
+
+    it('handles rejection with string reason', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+
+      const event = new Event('unhandledrejection') as any;
+      event.reason = 'string rejection';
+      globalThis.dispatchEvent(event);
+
+      expect(events).toHaveLength(1);
+      expect(events[0].data.message).toBe('string rejection');
+    });
+  });
+
+  // ── stop() ───────────────────────────────────────────────────────────
+
+  describe('stop()', () => {
+    it('removes event listeners on stop', () => {
+      capture = new ErrorCapture((e) => events.push(e));
+      capture.start();
+      capture.stop();
+
+      // Trigger onerror after stop — should not capture
+      const handler = globalThis.onerror;
+      if (handler) {
+        (handler as Function)('error', '', 0, 0, new Error('after stop'));
+      }
+
+      // If the listener was properly removed, events should still be from
+      // the handler we saved (which is now the original, not our capture)
+      // The test is mainly that stop() doesn't throw
+      expect(events).toHaveLength(0);
+    });
+  });
+});

package/src/errors.ts

@@ -0,0 +1,99 @@
+import type { ErrorSessionEvent } from './types.js';
+
+interface CaptureExceptionOptions {
+  tags?: Record<string, string>;
+  extra?: Record<string, unknown>;
+}
+
+export class ErrorCapture {
+  private onEvent: (event: ErrorSessionEvent) => void;
+  private started = false;
+  private prevOnError: OnErrorEventHandler | null = null;
+  private rejectionHandler: ((event: PromiseRejectionEvent) => void) | null = null;
+
+  constructor(onEvent: (event: ErrorSessionEvent) => void) {
+    this.onEvent = onEvent;
+  }
+
+  start(): void {
+    if (this.started) return;
+    this.started = true;
+
+    // Capture window.onerror
+    this.prevOnError = globalThis.onerror;
+    globalThis.onerror = (
+      message: string | Event,
+      source?: string,
+      lineno?: number,
+      colno?: number,
+      error?: Error,
+    ) => {
+      this.onEvent({
+        type: 'error',
+        timestamp: Date.now(),
+        data: {
+          message: error?.message ?? String(message),
+          stack: error?.stack,
+          source: source || undefined,
+          lineno,
+          colno,
+          type: 'uncaught',
+        },
+      });
+    };
+
+    // Capture unhandledrejection
+    this.rejectionHandler = (event: PromiseRejectionEvent) => {
+      const reason = event.reason;
+      const message =
+        reason instanceof Error ? reason.message : String(reason);
+      const stack = reason instanceof Error ? reason.stack : undefined;
+
+      this.onEvent({
+        type: 'error',
+        timestamp: Date.now(),
+        data: {
+          message,
+          stack,
+          type: 'unhandledrejection',
+        },
+      });
+    };
+    globalThis.addEventListener(
+      'unhandledrejection',
+      this.rejectionHandler as EventListener,
+    );
+  }
+
+  stop(): void {
+    if (!this.started) return;
+    this.started = false;
+
+    globalThis.onerror = this.prevOnError;
+    this.prevOnError = null;
+
+    if (this.rejectionHandler) {
+      globalThis.removeEventListener(
+        'unhandledrejection',
+        this.rejectionHandler as EventListener,
+      );
+      this.rejectionHandler = null;
+    }
+  }
+
+  captureException(error: Error, options?: CaptureExceptionOptions): void {
+    if (!this.started) return;
+
+    this.onEvent({
+      type: 'error',
+      timestamp: Date.now(),
+      data: {
+        message: error.message,
+        stack: error.stack,
+        type: 'manual',
+        tags: options?.tags,
+        extra: options?.extra,
+      },
+    });
+  }
+}

package/src/global.ts

@@ -0,0 +1,3 @@
+import { CedarReplay } from './index.js';
+
+(globalThis as any).CedarReplay = CedarReplay;

package/src/index.test.ts

@@ -0,0 +1,207 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
+
+// Mock rrweb so RecorderCapture doesn't try to use real DOM recording
+const { mockRecordStopFn, mockRecord } = vi.hoisted(() => ({
+  mockRecordStopFn: vi.fn(),
+  mockRecord: vi.fn(),
+}));
+
+vi.mock('rrweb', () => ({
+  record: mockRecord,
+}));
+
+import { CedarReplay } from './index.js';
+
+describe('CedarReplay', () => {
+  let mockFetch: ReturnType<typeof vi.fn>;
+
+  beforeEach(() => {
+    mockFetch = vi.fn().mockResolvedValue({
+      ok: true,
+      status: 200,
+      headers: new Headers({ 'content-type': 'application/json' }),
+      clone: () => ({
+        text: () => Promise.resolve('{}'),
+        headers: new Headers({ 'content-type': 'application/json' }),
+      }),
+      text: () => Promise.resolve('{}'),
+    });
+    vi.stubGlobal('fetch', mockFetch);
+    mockRecord.mockClear();
+    mockRecordStopFn.mockClear();
+    mockRecord.mockReturnValue(mockRecordStopFn);
+  });
+
+  afterEach(() => {
+    CedarReplay.stop();
+    vi.restoreAllMocks();
+  });
+
+  // ── init / stop ──────────────────────────────────────────────
+
+  it('starts capture modules on init()', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    // After init, console capture should be active (patched)
+    // We can verify by logging and checking that fetch is called on flush
+    console.log('test-after-init');
+
+    // Transport should be started — verify by triggering a flush
+    // (We'll test more specific behavior in integration tests)
+    expect(CedarReplay.getSessionURL()).toBe(
+      'https://replay.getcedar.ai/sessions/sess-123',
+    );
+  });
+
+  it('returns null for getSessionURL() before init', () => {
+    expect(CedarReplay.getSessionURL()).toBeNull();
+  });
+
+  it('returns session URL after init', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-abc',
+    });
+
+    expect(CedarReplay.getSessionURL()).toBe(
+      'https://replay.getcedar.ai/sessions/sess-abc',
+    );
+  });
+
+  it('stop() cleans up all captures', () => {
+    const origLog = console.log;
+    const origFetch = globalThis.fetch;
+
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    // After init, console.log and fetch should be patched
+    expect(console.log).not.toBe(origLog);
+    expect(globalThis.fetch).not.toBe(origFetch);
+
+    CedarReplay.stop();
+
+    // After stop, originals should be restored
+    expect(console.log).toBe(origLog);
+    // fetch is restored by NetworkCapture.stop()
+    expect(globalThis.fetch).toBe(origFetch);
+  });
+
+  it('is idempotent — double init does not crash', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-1',
+    });
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-2',
+    });
+
+    // Should use the latest session
+    expect(CedarReplay.getSessionURL()).toBe(
+      'https://replay.getcedar.ai/sessions/sess-2',
+    );
+  });
+
+  // ── captureException ─────────────────────────────────────────
+
+  it('exposes captureException() that delegates to ErrorCapture', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    // Should not throw
+    CedarReplay.captureException(new Error('manual error'), {
+      tags: { page: 'checkout' },
+    });
+  });
+
+  it('captureException is no-op before init', () => {
+    // Should not throw even if not initialized
+    expect(() => {
+      CedarReplay.captureException(new Error('noop'));
+    }).not.toThrow();
+  });
+
+  // ── track (custom events) ───────────────────────────────────
+
+  it('exposes track() for custom events', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    // Should not throw
+    CedarReplay.track('button_clicked', { buttonId: 'checkout' });
+  });
+
+  it('track is no-op before init', () => {
+    expect(() => {
+      CedarReplay.track('event_name');
+    }).not.toThrow();
+  });
+
+  // ── identify ─────────────────────────────────────────────────
+
+  it('exposes identify() to tag the session with user info', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    // Should not throw
+    CedarReplay.identify('user-456', {
+      email: 'user@example.com',
+      name: 'Test User',
+    });
+  });
+
+  it('identify is no-op before init', () => {
+    expect(() => {
+      CedarReplay.identify('user-456');
+    }).not.toThrow();
+  });
+
+  // ── recorder integration ────────────────────────────────────
+
+  it('init() starts rrweb recording', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    expect(mockRecord).toHaveBeenCalledTimes(1);
+    expect(typeof mockRecord.mock.calls[0][0].emit).toBe('function');
+  });
+
+  it('stop() calls rrweb stop function', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+    });
+
+    CedarReplay.stop();
+    expect(mockRecordStopFn).toHaveBeenCalledTimes(1);
+  });
+
+  it('passes recorder config to rrweb.record()', () => {
+    CedarReplay.init({
+      serverUrl: 'https://replay.getcedar.ai',
+      cedarSessionId: 'sess-123',
+      recorder: {
+        blockSelector: '.secret',
+        maskAllInputs: true,
+      },
+    });
+
+    const opts = mockRecord.mock.calls[0][0];
+    expect(opts.blockSelector).toBe('.secret');
+    expect(opts.maskAllInputs).toBe(true);
+  });
+});

package/src/index.ts

@@ -0,0 +1,122 @@
+import type { SDKConfig, SessionEvent, CustomSessionEvent, RecorderConfig } from './types.js';
+import { Transport } from './transport.js';
+import { ConsoleCapture } from './console.js';
+import { ErrorCapture } from './errors.js';
+import { NetworkCapture } from './network.js';
+import { RecorderCapture } from './recorder.js';
+
+interface InitConfig {
+  serverUrl: string;
+  cedarSessionId: string;
+  batchIntervalMs?: number;
+  batchMaxSize?: number;
+  console?: SDKConfig['console'];
+  recorder?: RecorderConfig;
+}
+
+let config: InitConfig | null = null;
+let transport: Transport | null = null;
+let consoleCapture: ConsoleCapture | null = null;
+let errorCapture: ErrorCapture | null = null;
+let networkCapture: NetworkCapture | null = null;
+let recorderCapture: RecorderCapture | null = null;
+
+function onEvent(event: SessionEvent): void {
+  transport?.enqueue(event);
+}
+
+export const CedarReplay = {
+  init(initConfig: InitConfig): void {
+    // If already running, stop first (idempotent re-init)
+    if (config) {
+      CedarReplay.stop();
+    }
+
+    config = initConfig;
+
+    // Save reference to original fetch before network capture patches it
+    const originalFetch = globalThis.fetch;
+
+    // Start transport (uses original fetch to avoid self-interception)
+    transport = new Transport(
+      {
+        serverUrl: config.serverUrl,
+        cedarSessionId: config.cedarSessionId,
+        batchIntervalMs: config.batchIntervalMs,
+        batchMaxSize: config.batchMaxSize,
+      },
+      originalFetch,
+    );
+    transport.start();
+
+    // Start capture modules
+    consoleCapture = new ConsoleCapture(onEvent, config.console);
+    consoleCapture.start();
+
+    errorCapture = new ErrorCapture(onEvent);
+    errorCapture.start();
+
+    networkCapture = new NetworkCapture(onEvent, config.serverUrl);
+    networkCapture.start();
+
+    recorderCapture = new RecorderCapture(onEvent, config.recorder);
+    recorderCapture.start();
+  },
+
+  stop(): void {
+    recorderCapture?.stop();
+    recorderCapture = null;
+
+    networkCapture?.stop();
+    networkCapture = null;
+
+    errorCapture?.stop();
+    errorCapture = null;
+
+    consoleCapture?.stop();
+    consoleCapture = null;
+
+    transport?.stop();
+    transport = null;
+
+    config = null;
+  },
+
+  captureException(
+    error: Error,
+    options?: { tags?: Record<string, string>; extra?: Record<string, unknown> },
+  ): void {
+    errorCapture?.captureException(error, options);
+  },
+
+  track(name: string, properties?: Record<string, unknown>): void {
+    if (!transport) return;
+
+    const event: CustomSessionEvent = {
+      type: 'custom',
+      timestamp: Date.now(),
+      data: { name, properties },
+    };
+    transport.enqueue(event);
+  },
+
+  identify(userId: string, traits?: Record<string, unknown>): void {
+    if (!transport) return;
+
+    // Send identify as a custom event that the server can use to tag the session
+    const event: CustomSessionEvent = {
+      type: 'custom',
+      timestamp: Date.now(),
+      data: {
+        name: '__cedar_identify',
+        properties: { userId, ...traits },
+      },
+    };
+    transport.enqueue(event);
+  },
+
+  getSessionURL(): string | null {
+    if (!config) return null;
+    return `${config.serverUrl}/sessions/${config.cedarSessionId}`;
+  },
+};