@cedarai/session-replay-sdk 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,43 @@
+interface SDKConfig {
+    serverUrl: string;
+    cedarSessionId: string;
+    batchIntervalMs?: number;
+    batchMaxSize?: number;
+    console?: ConsoleConfig;
+}
+interface ConsoleConfig {
+    log?: boolean;
+    info?: boolean;
+    warn?: boolean;
+    error?: boolean;
+    debug?: boolean;
+}
+interface RecorderConfig {
+    checkoutEveryNms?: number;
+    blockSelector?: string;
+    maskAllInputs?: boolean;
+    inlineStylesheet?: boolean;
+    sampling?: Record<string, unknown>;
+}
+
+interface InitConfig {
+    serverUrl: string;
+    cedarSessionId: string;
+    batchIntervalMs?: number;
+    batchMaxSize?: number;
+    console?: SDKConfig['console'];
+    recorder?: RecorderConfig;
+}
+declare const CedarReplay: {
+    init(initConfig: InitConfig): void;
+    stop(): void;
+    captureException(error: Error, options?: {
+        tags?: Record<string, string>;
+        extra?: Record<string, unknown>;
+    }): void;
+    track(name: string, properties?: Record<string, unknown>): void;
+    identify(userId: string, traits?: Record<string, unknown>): void;
+    getSessionURL(): string | null;
+};
+
+export { CedarReplay };

package/dist/index.js

@@ -0,0 +1,420 @@
+// src/transport.ts
+var Transport = class {
+  config;
+  queue = [];
+  timer = null;
+  started = false;
+  startedAt = Date.now();
+  fetchFn;
+  /**
+   * @param config SDK configuration
+   * @param originalFetch Original fetch reference to avoid self-interception.
+   *   If not provided, uses globalThis.fetch.
+   */
+  constructor(config2, originalFetch) {
+    this.config = config2;
+    const fn = originalFetch ?? globalThis.fetch;
+    this.fetchFn = fn.bind(globalThis);
+  }
+  start() {
+    if (this.started) return;
+    this.started = true;
+    this.startedAt = Date.now();
+    const interval = this.config.batchIntervalMs ?? 5e3;
+    this.timer = setInterval(() => {
+      this.flush();
+    }, interval);
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    if (this.timer !== null) {
+      clearInterval(this.timer);
+      this.timer = null;
+    }
+    this.flush();
+  }
+  enqueue(event) {
+    if (!this.started) return;
+    this.queue.push(event);
+    const maxSize = this.config.batchMaxSize ?? 1024 * 512;
+    const estimatedSize = this.estimateQueueSize();
+    if (estimatedSize >= maxSize) {
+      this.flush();
+    }
+  }
+  flush() {
+    if (this.queue.length === 0) return;
+    const events = this.queue.splice(0);
+    const payload = this.buildPayload(events);
+    this.fetchFn(`${this.config.serverUrl}/api/ingest`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(payload)
+    }).catch(() => {
+    });
+  }
+  /**
+   * Flush via sendBeacon for page unload. sendBeacon cannot set custom headers,
+   * so we send as a Blob and indicate gzip via query param.
+   */
+  flushOnUnload() {
+    if (this.queue.length === 0) return;
+    const events = this.queue.splice(0);
+    const payload = this.buildPayload(events);
+    const body = JSON.stringify(payload);
+    const blob = new Blob([body], { type: "application/json" });
+    const url = `${this.config.serverUrl}/api/ingest?encoding=gzip`;
+    navigator.sendBeacon(url, blob);
+  }
+  buildPayload(events) {
+    return {
+      sessionId: this.config.cedarSessionId,
+      batchTimestamp: Date.now(),
+      startedAt: this.startedAt,
+      userAgent: typeof navigator !== "undefined" ? navigator.userAgent : "",
+      viewportWidth: typeof window !== "undefined" ? window.innerWidth : 0,
+      viewportHeight: typeof window !== "undefined" ? window.innerHeight : 0,
+      url: typeof window !== "undefined" ? window.location.href : "",
+      events
+    };
+  }
+  estimateQueueSize() {
+    let size = 0;
+    for (const event of this.queue) {
+      size += JSON.stringify(event).length;
+    }
+    return size;
+  }
+};
+
+// src/console.ts
+var LEVELS = ["log", "warn", "error", "info", "debug"];
+var ConsoleCapture = class {
+  onEvent;
+  config;
+  originals = {};
+  started = false;
+  constructor(onEvent2, config2) {
+    this.onEvent = onEvent2;
+    this.config = config2 ?? {};
+  }
+  start() {
+    if (this.started) return;
+    this.started = true;
+    for (const level of LEVELS) {
+      if (this.config[level] === false) continue;
+      const original = console[level];
+      this.originals[level] = original;
+      console[level] = (...args) => {
+        original.apply(console, args);
+        this.onEvent({
+          type: "console",
+          timestamp: Date.now(),
+          data: {
+            level,
+            args: args.map((a) => typeof a === "string" ? a : JSON.stringify(a))
+          }
+        });
+      };
+    }
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    for (const level of LEVELS) {
+      const orig = this.originals[level];
+      if (orig) {
+        console[level] = orig;
+      }
+    }
+    this.originals = {};
+  }
+};
+
+// src/errors.ts
+var ErrorCapture = class {
+  onEvent;
+  started = false;
+  prevOnError = null;
+  rejectionHandler = null;
+  constructor(onEvent2) {
+    this.onEvent = onEvent2;
+  }
+  start() {
+    if (this.started) return;
+    this.started = true;
+    this.prevOnError = globalThis.onerror;
+    globalThis.onerror = (message, source, lineno, colno, error) => {
+      this.onEvent({
+        type: "error",
+        timestamp: Date.now(),
+        data: {
+          message: error?.message ?? String(message),
+          stack: error?.stack,
+          source: source || void 0,
+          lineno,
+          colno,
+          type: "uncaught"
+        }
+      });
+    };
+    this.rejectionHandler = (event) => {
+      const reason = event.reason;
+      const message = reason instanceof Error ? reason.message : String(reason);
+      const stack = reason instanceof Error ? reason.stack : void 0;
+      this.onEvent({
+        type: "error",
+        timestamp: Date.now(),
+        data: {
+          message,
+          stack,
+          type: "unhandledrejection"
+        }
+      });
+    };
+    globalThis.addEventListener(
+      "unhandledrejection",
+      this.rejectionHandler
+    );
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    globalThis.onerror = this.prevOnError;
+    this.prevOnError = null;
+    if (this.rejectionHandler) {
+      globalThis.removeEventListener(
+        "unhandledrejection",
+        this.rejectionHandler
+      );
+      this.rejectionHandler = null;
+    }
+  }
+  captureException(error, options) {
+    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
+      }
+    });
+  }
+};
+
+// src/network.ts
+var nextId = 0;
+var NetworkCapture = class {
+  onEvent;
+  serverUrl;
+  originalFetch = null;
+  started = false;
+  constructor(onEvent2, serverUrl) {
+    this.onEvent = onEvent2;
+    this.serverUrl = serverUrl;
+  }
+  start() {
+    if (this.started) return;
+    this.started = true;
+    this.originalFetch = globalThis.fetch;
+    globalThis.fetch = async (input, init) => {
+      const url = typeof input === "string" ? input : input instanceof URL ? input.href : input.url;
+      if (url.startsWith(this.serverUrl)) {
+        return this.originalFetch(input, init);
+      }
+      const method = init?.method?.toUpperCase() ?? "GET";
+      const requestBody = init?.body ? String(init.body) : void 0;
+      const startTime = performance.now();
+      const id = String(++nextId);
+      let graphqlOperationName;
+      if (requestBody) {
+        try {
+          const parsed = JSON.parse(requestBody);
+          if (parsed.operationName) {
+            graphqlOperationName = parsed.operationName;
+          }
+        } catch {
+        }
+      }
+      try {
+        const response = await this.originalFetch(input, init);
+        const endTime = performance.now();
+        let responseBody;
+        try {
+          const cloned = response.clone();
+          responseBody = await cloned.text();
+        } catch {
+        }
+        this.onEvent({
+          type: "network",
+          timestamp: Date.now(),
+          data: {
+            id,
+            method,
+            url,
+            graphqlOperationName,
+            requestBody,
+            status: response.status,
+            responseBody,
+            startTime,
+            endTime,
+            duration: endTime - startTime
+          }
+        });
+        return response;
+      } catch (err) {
+        const endTime = performance.now();
+        this.onEvent({
+          type: "network",
+          timestamp: Date.now(),
+          data: {
+            id,
+            method,
+            url,
+            graphqlOperationName,
+            requestBody,
+            startTime,
+            endTime,
+            duration: endTime - startTime,
+            error: err instanceof Error ? err.message : String(err)
+          }
+        });
+        throw err;
+      }
+    };
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    if (this.originalFetch) {
+      globalThis.fetch = this.originalFetch;
+      this.originalFetch = null;
+    }
+  }
+};
+
+// src/recorder.ts
+import { record } from "rrweb";
+var RecorderCapture = class {
+  onEvent;
+  config;
+  stopFn = null;
+  started = false;
+  constructor(onEvent2, config2) {
+    this.onEvent = onEvent2;
+    this.config = config2 ?? {};
+  }
+  start() {
+    if (this.started) return;
+    this.started = true;
+    const { checkoutEveryNms, blockSelector, maskAllInputs, inlineStylesheet, sampling } = this.config;
+    const result = record({
+      emit: (event) => {
+        if (!this.started) return;
+        this.onEvent({
+          type: "rrweb",
+          data: event
+        });
+      },
+      ...checkoutEveryNms !== void 0 && { checkoutEveryNms },
+      ...blockSelector !== void 0 && { blockSelector },
+      ...maskAllInputs !== void 0 && { maskAllInputs },
+      ...inlineStylesheet !== void 0 && { inlineStylesheet },
+      ...sampling !== void 0 && { sampling }
+    });
+    this.stopFn = result ?? null;
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    this.stopFn?.();
+    this.stopFn = null;
+  }
+};
+
+// src/index.ts
+var config = null;
+var transport = null;
+var consoleCapture = null;
+var errorCapture = null;
+var networkCapture = null;
+var recorderCapture = null;
+function onEvent(event) {
+  transport?.enqueue(event);
+}
+var CedarReplay = {
+  init(initConfig) {
+    if (config) {
+      CedarReplay.stop();
+    }
+    config = initConfig;
+    const originalFetch = globalThis.fetch;
+    transport = new Transport(
+      {
+        serverUrl: config.serverUrl,
+        cedarSessionId: config.cedarSessionId,
+        batchIntervalMs: config.batchIntervalMs,
+        batchMaxSize: config.batchMaxSize
+      },
+      originalFetch
+    );
+    transport.start();
+    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() {
+    recorderCapture?.stop();
+    recorderCapture = null;
+    networkCapture?.stop();
+    networkCapture = null;
+    errorCapture?.stop();
+    errorCapture = null;
+    consoleCapture?.stop();
+    consoleCapture = null;
+    transport?.stop();
+    transport = null;
+    config = null;
+  },
+  captureException(error, options) {
+    errorCapture?.captureException(error, options);
+  },
+  track(name, properties) {
+    if (!transport) return;
+    const event = {
+      type: "custom",
+      timestamp: Date.now(),
+      data: { name, properties }
+    };
+    transport.enqueue(event);
+  },
+  identify(userId, traits) {
+    if (!transport) return;
+    const event = {
+      type: "custom",
+      timestamp: Date.now(),
+      data: {
+        name: "__cedar_identify",
+        properties: { userId, ...traits }
+      }
+    };
+    transport.enqueue(event);
+  },
+  getSessionURL() {
+    if (!config) return null;
+    return `${config.serverUrl}/sessions/${config.cedarSessionId}`;
+  }
+};
+export {
+  CedarReplay
+};

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@cedarai/session-replay-sdk",
+  "version": "0.1.0",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "prepare": "tsup src/index.ts --format esm --dts",
+    "build": "tsup src/index.ts --format esm --dts",
+    "build:iife": "tsup src/global.ts --format iife --outDir dist",
+    "dev": "tsup src/index.ts --format esm --dts --watch",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {
+    "rrweb": "^2.0.0-alpha.4"
+  },
+  "devDependencies": {
+    "@vitest/browser": "^4.0.18",
+    "happy-dom": "^20.7.0",
+    "jsdom": "^27.0.1",
+    "tsup": "^8.5.1"
+  }
+}

package/src/console.test.ts

@@ -0,0 +1,148 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
+import { ConsoleCapture } from './console.js';
+import type { ConsoleSessionEvent, ConsoleConfig } from './types.js';
+
+describe('ConsoleCapture', () => {
+  let capture: ConsoleCapture;
+  let events: ConsoleSessionEvent[];
+  let originalLog: typeof console.log;
+  let originalWarn: typeof console.warn;
+  let originalError: typeof console.error;
+
+  beforeEach(() => {
+    events = [];
+    originalLog = console.log;
+    originalWarn = console.warn;
+    originalError = console.error;
+  });
+
+  afterEach(() => {
+    capture?.stop();
+    // Restore originals in case stop() didn't
+    console.log = originalLog;
+    console.warn = originalWarn;
+    console.error = originalError;
+  });
+
+  it('captures console.log calls', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.log('hello', 'world');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].type).toBe('console');
+    expect(events[0].data.level).toBe('log');
+    expect(events[0].data.args).toEqual(['hello', 'world']);
+  });
+
+  it('captures console.warn calls', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.warn('warning!');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('warn');
+  });
+
+  it('captures console.error calls', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.error('error!');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('error');
+  });
+
+  it('captures console.info calls', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.info('info');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('info');
+  });
+
+  it('captures console.debug calls', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.debug('debug');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('debug');
+  });
+
+  it('still calls the original console method', () => {
+    const origLog = vi.fn();
+    console.log = origLog;
+
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.log('test');
+
+    expect(origLog).toHaveBeenCalledWith('test');
+    expect(events).toHaveLength(1);
+  });
+
+  it('serializes non-string arguments', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    console.log('count:', 42, { key: 'val' }, [1, 2]);
+
+    expect(events[0].data.args).toEqual(['count:', '42', '{"key":"val"}', '[1,2]']);
+  });
+
+  it('respects per-level config (disable log)', () => {
+    capture = new ConsoleCapture((e) => events.push(e), { log: false });
+    capture.start();
+
+    console.log('ignored');
+    console.warn('captured');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('warn');
+  });
+
+  it('respects per-level config (disable debug)', () => {
+    capture = new ConsoleCapture((e) => events.push(e), { debug: false });
+    capture.start();
+
+    console.debug('ignored');
+    console.info('captured');
+
+    expect(events).toHaveLength(1);
+    expect(events[0].data.level).toBe('info');
+  });
+
+  it('restores original console methods on stop()', () => {
+    const origLog = console.log;
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    // console.log is now patched
+    expect(console.log).not.toBe(origLog);
+
+    capture.stop();
+
+    // Should be restored
+    expect(console.log).toBe(origLog);
+  });
+
+  it('adds timestamp to events', () => {
+    capture = new ConsoleCapture((e) => events.push(e));
+    capture.start();
+
+    const before = Date.now();
+    console.log('test');
+    const after = Date.now();
+
+    expect(events[0].timestamp).toBeGreaterThanOrEqual(before);
+    expect(events[0].timestamp).toBeLessThanOrEqual(after);
+  });
+});

package/src/console.ts

@@ -0,0 +1,54 @@
+import type { ConsoleSessionEvent, ConsoleConfig } from './types.js';
+
+type ConsoleLevel = 'log' | 'warn' | 'error' | 'info' | 'debug';
+
+const LEVELS: ConsoleLevel[] = ['log', 'warn', 'error', 'info', 'debug'];
+
+export class ConsoleCapture {
+  private onEvent: (event: ConsoleSessionEvent) => void;
+  private config: ConsoleConfig;
+  private originals: Partial<Record<ConsoleLevel, (...args: unknown[]) => void>> = {};
+  private started = false;
+
+  constructor(onEvent: (event: ConsoleSessionEvent) => void, config?: ConsoleConfig) {
+    this.onEvent = onEvent;
+    this.config = config ?? {};
+  }
+
+  start(): void {
+    if (this.started) return;
+    this.started = true;
+
+    for (const level of LEVELS) {
+      if (this.config[level] === false) continue;
+
+      const original = console[level];
+      this.originals[level] = original;
+
+      console[level] = (...args: unknown[]) => {
+        original.apply(console, args);
+        this.onEvent({
+          type: 'console',
+          timestamp: Date.now(),
+          data: {
+            level,
+            args: args.map((a) => (typeof a === 'string' ? a : JSON.stringify(a))),
+          },
+        });
+      };
+    }
+  }
+
+  stop(): void {
+    if (!this.started) return;
+    this.started = false;
+
+    for (const level of LEVELS) {
+      const orig = this.originals[level];
+      if (orig) {
+        console[level] = orig;
+      }
+    }
+    this.originals = {};
+  }
+}