@vidtreo/recorder 0.8.2 → 0.8.4

package/dist/index.d.ts

@@ -152,6 +152,30 @@ export type UploadResult = {
 
 export declare function calculateBarColor(position: number): string;
 
+declare const ANSI_COLORS: {
+    readonly reset: "\u001B[0m";
+    readonly bright: "\u001B[1m";
+    readonly dim: "\u001B[2m";
+    readonly red: "\u001B[31m";
+    readonly green: "\u001B[32m";
+    readonly yellow: "\u001B[33m";
+    readonly blue: "\u001B[34m";
+    readonly magenta: "\u001B[35m";
+    readonly cyan: "\u001B[36m";
+    readonly white: "\u001B[37m";
+    readonly gray: "\u001B[90m";
+};
+export declare const logger: {
+    readonly log: (message: string, ...args: unknown[]) => void;
+    readonly info: (message: string, ...args: unknown[]) => void;
+    readonly warn: (message: string, ...args: unknown[]) => void;
+    readonly error: (message: string, ...args: unknown[]) => void;
+    readonly debug: (message: string, ...args: unknown[]) => void;
+    readonly group: (label: string, color?: keyof typeof ANSI_COLORS) => void;
+    readonly groupEnd: () => void;
+};
+export {};
+
 export declare function extractErrorMessage(error: unknown): string;
 
 export declare const FILE_SIZE_UNITS: readonly ["Bytes", "KB", "MB", "GB"];
@@ -456,9 +480,26 @@ export declare class AudioTrackManager {
     private gainNode;
     private audioSource;
     private lastAudioTimestamp;
+    private pendingAddOperation;
     private isMuted;
     private isPaused;
     private onMuteStateChange?;
+    private readonly pendingAudioSamples;
+    private isCleanedUp;
+    private validateStreamAndConfig;
+    private prepareAudioTrack;
+    private getAudioContextClass;
+    private setupAudioContext;
+    private createAudioSource;
+    private addWorkletModule;
+    private createWorkletNode;
+    private setupWorkletMessageHandler;
+    private closeSampleSafely;
+    private closePendingAudioSamples;
+    private cleanupAudioNodes;
+    private cleanupAudioContext;
+    private cleanupAudioTrack;
+    private setupAudioNodes;
     setupAudioTrack(stream: MediaStream, config: TranscodeConfig): Promise<AudioSampleSource | null>;
     toggleMute(): void;
     isMutedState(): boolean;

package/dist/index.js

@@ -44,17 +44,22 @@ class AudioLevelAnalyzer {
     if (!AudioContextClass) {
       throw new Error("AudioContext is not supported in this browser");
     }
+    let audioContext;
     try {
-      this.audioContext = new AudioContextClass;
+      audioContext = new AudioContextClass;
     } catch (error) {
       throw new Error(`Failed to create AudioContext: ${extractErrorMessage(error)}`);
     }
+    this.audioContext = audioContext;
     const source = this.audioContext.createMediaStreamSource(stream);
     this.analyser = this.audioContext.createAnalyser();
     this.analyser.fftSize = FFT_SIZE;
     this.analyser.smoothingTimeConstant = SMOOTHING_TIME_CONSTANT;
     source.connect(this.analyser);
     const dataArray = new Uint8Array(this.analyser.fftSize);
+    this.audioLevel = 0;
+    const initialMutedState = this.checkMutedState();
+    callbacks.onLevelUpdate(0, initialMutedState);
     this.audioLevelIntervalId = window.setInterval(() => {
       if (!this.analyser) {
         return;
@@ -426,6 +431,84 @@ async function transcodeVideo(input, config = {}, onProgress) {
 // src/core/processor/stream-processor.ts
 import { CanvasSource } from "mediabunny";
 
+// src/core/utils/logger.ts
+var isDevelopment = typeof process !== "undefined" && process.env && true || typeof window !== "undefined" && window.__VIDTREO_DEV__ === true;
+var ANSI_COLORS = {
+  reset: "\x1B[0m",
+  bright: "\x1B[1m",
+  dim: "\x1B[2m",
+  red: "\x1B[31m",
+  green: "\x1B[32m",
+  yellow: "\x1B[33m",
+  blue: "\x1B[34m",
+  magenta: "\x1B[35m",
+  cyan: "\x1B[36m",
+  white: "\x1B[37m",
+  gray: "\x1B[90m"
+};
+function formatMessage(level, message, options) {
+  if (!isDevelopment) {
+    return "";
+  }
+  const prefix = options?.prefix || `[${level.toUpperCase()}]`;
+  const color = options?.color || getDefaultColor(level);
+  const colorCode = ANSI_COLORS[color];
+  const resetCode = ANSI_COLORS.reset;
+  return `${colorCode}${prefix}${resetCode} ${message}`;
+}
+function getDefaultColor(level) {
+  switch (level) {
+    case "error":
+      return "red";
+    case "warn":
+      return "yellow";
+    case "info":
+      return "cyan";
+    case "debug":
+      return "gray";
+    default:
+      return "white";
+  }
+}
+function log(level, message, ...args) {
+  if (!isDevelopment) {
+    return;
+  }
+  const formatted = formatMessage(level, message);
+  console[level](formatted, ...args);
+}
+var logger = {
+  log: (message, ...args) => {
+    log("log", message, ...args);
+  },
+  info: (message, ...args) => {
+    log("info", message, ...args);
+  },
+  warn: (message, ...args) => {
+    log("warn", message, ...args);
+  },
+  error: (message, ...args) => {
+    log("error", message, ...args);
+  },
+  debug: (message, ...args) => {
+    log("debug", message, ...args);
+  },
+  group: (label, color = "cyan") => {
+    if (!isDevelopment) {
+      return;
+    }
+    const colorCode = ANSI_COLORS[color];
+    const resetCode = ANSI_COLORS.reset;
+    console.group(`${colorCode}${label}${resetCode}`);
+  },
+  groupEnd: () => {
+    if (!isDevelopment) {
+      return;
+    }
+    console.groupEnd();
+  }
+};
+
 // src/core/processor/audio-track-manager.ts
 import { AudioSample, AudioSampleSource } from "mediabunny";
 
@@ -500,25 +583,31 @@ class AudioTrackManager {
   gainNode = null;
   audioSource = null;
   lastAudioTimestamp = 0;
+  pendingAddOperation = null;
   isMuted = false;
   isPaused = false;
   onMuteStateChange;
-  async setupAudioTrack(stream, config) {
+  pendingAudioSamples = new Set;
+  isCleanedUp = false;
+  validateStreamAndConfig(stream, config) {
     if (!stream) {
+      logger.debug("[AudioTrackManager] No stream provided");
       return null;
     }
     const audioTracks = stream.getAudioTracks();
+    logger.debug("[AudioTrackManager] Audio tracks found:", audioTracks.length);
     if (audioTracks.length === 0) {
+      logger.debug("[AudioTrackManager] No audio tracks in stream");
       return null;
     }
     const audioTrack = audioTracks[0];
     if (!audioTrack) {
+      logger.debug("[AudioTrackManager] First audio track is null");
       return null;
     }
-    this.originalAudioTrack = audioTrack;
-    this.lastAudioTimestamp = 0;
-    const AudioContextClass = window.AudioContext || window.webkitAudioContext;
-    if (!AudioContextClass) {
+    logger.debug("[AudioTrackManager] Audio track state:", audioTrack.readyState);
+    if (audioTrack.readyState !== "live") {
+      logger.debug("[AudioTrackManager] Audio track is not live");
       return null;
     }
     if (config.audioBitrate === undefined || config.audioBitrate === null) {
@@ -527,32 +616,114 @@ class AudioTrackManager {
     if (!config.audioCodec) {
       return null;
     }
-    this.audioContext = new AudioContextClass;
+    return audioTrack;
+  }
+  prepareAudioTrack(audioTrack) {
+    logger.debug("[AudioTrackManager] Cloning audio track to avoid stopping original");
+    let clonedTrack;
+    if (typeof audioTrack.clone === "function") {
+      clonedTrack = audioTrack.clone();
+      logger.debug("[AudioTrackManager] Audio track cloned successfully", {
+        clonedState: clonedTrack.readyState,
+        originalState: audioTrack.readyState
+      });
+    } else {
+      logger.debug("[AudioTrackManager] clone() not available, using original track");
+      clonedTrack = audioTrack;
+    }
+    this.originalAudioTrack = clonedTrack;
+    this.lastAudioTimestamp = 0;
+    this.pendingAddOperation = null;
+    this.isCleanedUp = false;
+    logger.debug("[AudioTrackManager] Reset state, originalAudioTrack set (cloned)");
+    return clonedTrack;
+  }
+  getAudioContextClass() {
+    const AudioContextClass = window.AudioContext || window.webkitAudioContext;
+    return AudioContextClass || null;
+  }
+  async setupAudioContext() {
+    const AudioContextClass = this.getAudioContextClass();
+    if (!AudioContextClass) {
+      return null;
+    }
+    if (!this.audioContext || this.audioContext.state === "closed") {
+      logger.debug("[AudioTrackManager] Creating new AudioContext");
+      this.audioContext = new AudioContextClass;
+    } else {
+      logger.debug("[AudioTrackManager] Reusing existing AudioContext", {
+        state: this.audioContext.state
+      });
+    }
     if (this.audioContext.state === "suspended") {
+      logger.debug("[AudioTrackManager] Resuming suspended AudioContext");
       await this.audioContext.resume();
     }
     if (!this.audioContext.audioWorklet) {
+      logger.debug("[AudioTrackManager] AudioContext has no audioWorklet support");
       await this.audioContext.close();
       this.audioContext = null;
       return null;
     }
+    return this.audioContext;
+  }
+  createAudioSource(config) {
     const audioBitrate = config.audioBitrate;
     const audioCodec = config.audioCodec;
-    this.audioSource = new AudioSampleSource({
+    logger.debug("[AudioTrackManager] Creating AudioSampleSource", {
       codec: audioCodec,
       bitrate: audioBitrate
     });
-    const audioOnlyStream = new MediaStream([this.originalAudioTrack]);
-    this.mediaStreamSource = this.audioContext.createMediaStreamSource(audioOnlyStream);
+    const audioSource = new AudioSampleSource({
+      codec: audioCodec,
+      bitrate: audioBitrate
+    });
+    logger.debug("[AudioTrackManager] AudioSampleSource created:", !!audioSource);
+    return audioSource;
+  }
+  async addWorkletModule() {
+    if (!this.audioContext) {
+      throw new Error("AudioContext not initialized");
+    }
     const processorUrl = getWorkletUrl();
-    await this.audioContext.audioWorklet.addModule(processorUrl);
+    logger.debug("[AudioTrackManager] Adding worklet module");
+    try {
+      await this.audioContext.audioWorklet.addModule(processorUrl);
+      logger.debug("[AudioTrackManager] Worklet module added successfully");
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : String(error);
+      logger.warn("[AudioTrackManager] Error adding worklet module:", errorMessage);
+      if (!(errorMessage.includes("already") || errorMessage.includes("duplicate") || errorMessage.includes("InvalidStateError"))) {
+        logger.error("[AudioTrackManager] Fatal error adding module, cleaning up");
+        this.audioSource = null;
+        this.mediaStreamSource = null;
+        throw error;
+      }
+      logger.debug("[AudioTrackManager] Module already loaded, continuing");
+    }
+  }
+  createWorkletNode() {
+    if (!this.audioContext) {
+      throw new Error("AudioContext not initialized");
+    }
+    logger.debug("[AudioTrackManager] Creating AudioWorkletNode");
     this.audioWorkletNode = new AudioWorkletNode(this.audioContext, "audio-capture-processor");
+    logger.debug("[AudioTrackManager] AudioWorkletNode created:", !!this.audioWorkletNode);
+  }
+  setupWorkletMessageHandler() {
+    if (!this.audioWorkletNode) {
+      throw new Error("AudioWorkletNode not initialized");
+    }
     this.audioWorkletNode.port.onmessage = (event) => {
-      if (this.isPaused || this.isMuted || !this.audioSource) {
+      if (this.isCleanedUp || this.isPaused || this.isMuted || !this.audioSource) {
         return;
       }
       const { data, sampleRate, numberOfChannels, duration, bufferLength } = event.data;
       const float32Data = new Float32Array(data, 0, bufferLength);
+      if (this.isCleanedUp || !this.audioSource) {
+        return;
+      }
+      const audioSource = this.audioSource;
       const audioSample = new AudioSample({
         data: float32Data,
         format: "f32-planar",
@@ -560,18 +731,151 @@ class AudioTrackManager {
         sampleRate,
         timestamp: this.lastAudioTimestamp
       });
-      this.audioSource.add(audioSample);
-      audioSample.close();
-      this.lastAudioTimestamp += duration;
+      this.pendingAudioSamples.add(audioSample);
+      const currentTimestamp = this.lastAudioTimestamp;
+      let addOperation;
+      if (this.pendingAddOperation) {
+        addOperation = this.pendingAddOperation.then(() => {
+          if (this.isCleanedUp || !this.audioSource) {
+            this.closeSampleSafely(audioSample);
+            return;
+          }
+          return audioSource.add(audioSample);
+        }).catch(() => {
+          if (this.isCleanedUp || !this.audioSource) {
+            this.closeSampleSafely(audioSample);
+            return;
+          }
+          return audioSource.add(audioSample);
+        });
+      } else if (this.isCleanedUp) {
+        this.closeSampleSafely(audioSample);
+        addOperation = Promise.resolve();
+      } else {
+        addOperation = audioSource.add(audioSample);
+      }
+      this.pendingAddOperation = addOperation.then(() => {
+        this.closeSampleSafely(audioSample);
+        if (!this.isCleanedUp) {
+          this.lastAudioTimestamp = currentTimestamp + duration;
+        }
+      }).catch(() => {
+        this.closeSampleSafely(audioSample);
+        if (!this.isCleanedUp) {
+          this.lastAudioTimestamp = currentTimestamp + duration;
+        }
+      });
     };
+    logger.debug("[AudioTrackManager] onmessage handler set");
+  }
+  closeSampleSafely(audioSample) {
+    if (this.pendingAudioSamples.has(audioSample)) {
+      audioSample.close();
+      this.pendingAudioSamples.delete(audioSample);
+    }
+  }
+  closePendingAudioSamples() {
+    for (const audioSample of this.pendingAudioSamples) {
+      try {
+        audioSample.close();
+      } catch (error) {
+        const errorMessage = error instanceof Error ? error.message : String(error);
+        logger.warn("[AudioTrackManager] Error closing AudioSample during cleanup:", errorMessage);
+      }
+    }
+    this.pendingAudioSamples.clear();
+  }
+  cleanupAudioNodes() {
+    if (this.audioWorkletNode) {
+      logger.debug("[AudioTrackManager] Disconnecting and closing worklet node");
+      this.audioWorkletNode.disconnect();
+      this.audioWorkletNode.port.close();
+      this.audioWorkletNode = null;
+    }
+    if (this.gainNode) {
+      logger.debug("[AudioTrackManager] Disconnecting gain node");
+      this.gainNode.disconnect();
+      this.gainNode = null;
+    }
+    if (this.mediaStreamSource) {
+      logger.debug("[AudioTrackManager] Disconnecting media stream source");
+      this.mediaStreamSource.disconnect();
+      this.mediaStreamSource = null;
+    }
+  }
+  cleanupAudioContext() {
+    if (this.audioContext && this.audioContext.state !== "closed") {
+      logger.debug("[AudioTrackManager] Suspending AudioContext (not closing)");
+      if (typeof this.audioContext.suspend === "function") {
+        this.audioContext.suspend().catch((err) => {
+          logger.warn("[AudioTrackManager] Error suspending AudioContext:", err);
+        });
+      }
+    }
+  }
+  cleanupAudioTrack() {
+    if (this.originalAudioTrack) {
+      logger.debug("[AudioTrackManager] Stopping cloned audio track", {
+        trackState: this.originalAudioTrack.readyState
+      });
+      if (this.originalAudioTrack.readyState === "live" && typeof this.originalAudioTrack.stop === "function") {
+        this.originalAudioTrack.stop();
+        logger.debug("[AudioTrackManager] Cloned audio track stopped");
+      }
+      this.originalAudioTrack = null;
+    }
+  }
+  setupAudioNodes() {
+    if (!(this.audioContext && this.audioWorkletNode && this.mediaStreamSource)) {
+      throw new Error("Audio nodes not initialized");
+    }
     this.gainNode = this.audioContext.createGain();
     this.gainNode.gain.value = 0;
+    logger.debug("[AudioTrackManager] GainNode created");
     this.mediaStreamSource.connect(this.audioWorkletNode);
     this.audioWorkletNode.connect(this.gainNode);
     this.gainNode.connect(this.audioContext.destination);
-    if (this.audioContext.state === "suspended") {
-      await this.audioContext.resume();
+    logger.debug("[AudioTrackManager] Audio nodes connected");
+  }
+  async setupAudioTrack(stream, config) {
+    logger.debug("[AudioTrackManager] setupAudioTrack called", {
+      hasStream: !!stream,
+      audioContextState: this.audioContext?.state,
+      hasAudioContext: !!this.audioContext,
+      hasAudioSource: !!this.audioSource
+    });
+    const audioTrack = this.validateStreamAndConfig(stream, config);
+    if (!audioTrack) {
+      return null;
+    }
+    this.prepareAudioTrack(audioTrack);
+    const audioContext = await this.setupAudioContext();
+    if (!audioContext) {
+      return null;
     }
+    this.audioSource = this.createAudioSource(config);
+    if (!this.originalAudioTrack) {
+      throw new Error("Original audio track not set");
+    }
+    const audioOnlyStream = new MediaStream([this.originalAudioTrack]);
+    this.mediaStreamSource = audioContext.createMediaStreamSource(audioOnlyStream);
+    logger.debug("[AudioTrackManager] MediaStreamSource created:", !!this.mediaStreamSource);
+    try {
+      await this.addWorkletModule();
+      this.createWorkletNode();
+    } catch (error) {
+      logger.error("[AudioTrackManager] Error creating AudioWorkletNode:", error);
+      this.audioSource = null;
+      this.mediaStreamSource = null;
+      throw error;
+    }
+    this.setupWorkletMessageHandler();
+    this.setupAudioNodes();
+    if (audioContext.state === "suspended") {
+      logger.debug("[AudioTrackManager] Resuming AudioContext after setup");
+      await audioContext.resume();
+    }
+    logger.debug("[AudioTrackManager] setupAudioTrack completed, returning audioSource:", !!this.audioSource);
     return this.audioSource;
   }
   toggleMute() {
@@ -624,32 +928,22 @@ class AudioTrackManager {
     this.onMuteStateChange = callback;
   }
   cleanup() {
+    logger.debug("[AudioTrackManager] cleanup called", {
+      hasAudioSource: !!this.audioSource,
+      hasAudioContext: !!this.audioContext,
+      audioContextState: this.audioContext?.state,
+      hasWorkletNode: !!this.audioWorkletNode,
+      pendingSamples: this.pendingAudioSamples.size
+    });
+    this.isCleanedUp = true;
+    this.closePendingAudioSamples();
     this.audioSource = null;
-    if (this.audioWorkletNode) {
-      this.audioWorkletNode.disconnect();
-      this.audioWorkletNode.port.close();
-      this.audioWorkletNode = null;
-    }
-    if (this.gainNode) {
-      this.gainNode.disconnect();
-      this.gainNode = null;
-    }
-    if (this.mediaStreamSource) {
-      this.mediaStreamSource.disconnect();
-      this.mediaStreamSource = null;
-    }
-    if (this.audioContext) {
-      this.audioContext.close();
-      this.audioContext = null;
-    }
-    if (this.originalAudioTrack) {
-      this.originalAudioTrack.stop();
-      this.originalAudioTrack = null;
-    }
-    if (workletBlobUrl) {
-      URL.revokeObjectURL(workletBlobUrl);
-      workletBlobUrl = null;
-    }
+    this.pendingAddOperation = null;
+    this.isMuted = false;
+    this.isPaused = false;
+    this.cleanupAudioNodes();
+    this.cleanupAudioContext();
+    this.cleanupAudioTrack();
     this.lastAudioTimestamp = 0;
   }
 }
@@ -916,6 +1210,9 @@ class VideoElementManager {
   isActive = false;
   isIntentionallyPaused = false;
   create(stream) {
+    if (this.videoElement) {
+      this.cleanup();
+    }
     const videoElement = document.createElement("video");
     videoElement.srcObject = stream;
     videoElement.autoplay = true;
@@ -965,9 +1262,17 @@ class VideoElementManager {
   }
   cleanup() {
     if (this.videoElement) {
+      if (typeof this.videoElement.pause === "function") {
+        this.videoElement.pause();
+      }
       this.videoElement.srcObject = null;
+      if (typeof this.videoElement.remove === "function") {
+        this.videoElement.remove();
+      }
       this.videoElement = null;
     }
+    this.isActive = false;
+    this.isIntentionallyPaused = false;
   }
   waitForVideoReady(shouldPlay) {
     if (!this.videoElement) {
@@ -975,21 +1280,30 @@ class VideoElementManager {
     }
     const videoElement = this.videoElement;
     return new Promise((resolve, reject) => {
+      let timeoutId;
       const cleanup = () => {
         videoElement.removeEventListener("loadedmetadata", onLoadedMetadata);
         videoElement.removeEventListener("error", onError);
+        if (timeoutId !== undefined) {
+          clearTimeout(timeoutId);
+          timeoutId = undefined;
+        }
       };
       const onLoadedMetadata = () => {
         cleanup();
         if (shouldPlay) {
-          videoElement.play().then(resolve).catch(reject);
+          videoElement.play().then(() => {
+            resolve();
+          }).catch((err) => {
+            reject(err);
+          });
         } else {
           resolve();
         }
       };
-      const onError = () => {
+      const onError = (event) => {
         cleanup();
-        reject(new Error("Failed to load video metadata"));
+        reject(new Error(`Failed to load video metadata: ${event.type}`));
       };
       if (videoElement.readyState >= READY_STATE_HAVE_CURRENT_DATA2) {
         if (shouldPlay) {
@@ -999,14 +1313,16 @@ class VideoElementManager {
         }
         return;
       }
-      videoElement.addEventListener("loadedmetadata", onLoadedMetadata);
-      videoElement.addEventListener("error", onError);
-      if (!shouldPlay) {
+      videoElement.addEventListener("loadedmetadata", onLoadedMetadata, {
+        once: true
+      });
+      videoElement.addEventListener("error", onError, { once: true });
+      if (shouldPlay) {
         videoElement.play().catch(reject);
       }
-      setTimeout(() => {
+      timeoutId = window.setTimeout(() => {
         cleanup();
-        reject(new Error("Timeout waiting for video to load"));
+        reject(new Error(`Timeout waiting for video to load. ReadyState: ${videoElement.readyState}, SrcObject: ${!!videoElement.srcObject}`));
       }, VIDEO_LOAD_TIMEOUT);
     });
   }
@@ -1066,9 +1382,20 @@ class StreamProcessor {
       latencyMode: REALTIME_LATENCY
     });
     output.addVideoTrack(this.canvasSource);
+    logger.debug("[StreamProcessor] Setting up audio track", {
+      hasStream: !!stream,
+      audioTracks: stream.getAudioTracks().length
+    });
     const audioSource = await this.audioTrackManager.setupAudioTrack(stream, config);
+    logger.debug("[StreamProcessor] Audio track setup result:", {
+      hasAudioSource: !!audioSource,
+      audioSourceType: audioSource?.constructor?.name
+    });
     if (audioSource) {
+      logger.debug("[StreamProcessor] Adding audio track to output");
       output.addAudioTrack(audioSource);
+    } else {
+      logger.warn("[StreamProcessor] No audio source, skipping audio track");
     }
     await output.start();
     if (!this.canvasRenderer) {
@@ -1100,9 +1427,12 @@ class StreamProcessor {
     return this.frameCapturer.isPausedState();
   }
   async finalize() {
+    logger.debug("[StreamProcessor] finalize called");
     this.frameCapturer.stop();
     await this.frameCapturer.waitForPendingFrames();
+    logger.debug("[StreamProcessor] Cleaning up video element manager");
     this.videoElementManager.cleanup();
+    logger.debug("[StreamProcessor] Cleaning up audio track manager");
     this.audioTrackManager.cleanup();
     if (this.canvasSource) {
       this.canvasSource.close();
@@ -1257,38 +1587,70 @@ class RecordingManager {
       this.callbacks.onCountdownUpdate(this.recordingState, this.countdownRemaining);
     }, COUNTDOWN_UPDATE_INTERVAL);
     this.countdownTimeoutId = window.setTimeout(async () => {
-      await this.doStartRecording();
+      await this.doStartRecording().catch(() => {});
     }, this.countdownDuration);
   }
   async doStartRecording() {
-    try {
-      this.cancelCountdown();
-      this.recordingState = RECORDING_STATE_RECORDING;
+    logger.debug("[RecordingManager] doStartRecording called");
+    this.cancelCountdown();
+    this.recordingState = RECORDING_STATE_RECORDING;
+    this.callbacks.onStateChange(this.recordingState);
+    this.resetRecordingState();
+    const currentStream = this.streamManager.getStream();
+    logger.debug("[RecordingManager] Current stream:", {
+      hasStream: !!currentStream,
+      audioTracks: currentStream?.getAudioTracks().length || 0,
+      videoTracks: currentStream?.getVideoTracks().length || 0
+    });
+    if (!currentStream) {
+      logger.warn("[RecordingManager] No stream available");
+      this.handleError(new Error("No stream available for recording"));
+      this.recordingState = RECORDING_STATE_IDLE;
       this.callbacks.onStateChange(this.recordingState);
-      this.resetRecordingState();
-      const currentStream = this.streamManager.getStream();
-      if (!currentStream) {
-        throw new Error("No stream available for recording");
-      }
-      this.originalCameraStream = currentStream;
-      this.streamProcessor = new StreamProcessor;
-      const config = await this.callbacks.onGetConfig();
-      await this.streamManager.startRecording(this.streamProcessor, config);
-      this.startRecordingTimer();
-      if (this.maxRecordingTime && this.maxRecordingTime > 0) {
-        this.maxTimeTimer = window.setTimeout(async () => {
-          if (this.recordingState === RECORDING_STATE_RECORDING) {
-            await this.stopRecording();
-          }
-        }, this.maxRecordingTime);
-      }
-    } catch (error) {
-      this.handleError(error);
+      return;
+    }
+    this.originalCameraStream = currentStream;
+    logger.debug("[RecordingManager] Creating new StreamProcessor");
+    this.streamProcessor = new StreamProcessor;
+    logger.debug("[RecordingManager] StreamProcessor created:", !!this.streamProcessor);
+    const configResult = await this.callbacks.onGetConfig().then((config) => ({ config, error: null })).catch((error) => ({ config: null, error }));
+    if (configResult.error) {
+      this.handleError(configResult.error);
+      this.recordingState = RECORDING_STATE_IDLE;
+      this.callbacks.onStateChange(this.recordingState);
+      return;
+    }
+    if (!configResult.config) {
+      this.handleError(new Error("Failed to get recording config"));
       this.recordingState = RECORDING_STATE_IDLE;
       this.callbacks.onStateChange(this.recordingState);
+      return;
+    }
+    logger.debug("[RecordingManager] Starting recording with stream manager");
+    const recordingError = await this.streamManager.startRecording(this.streamProcessor, configResult.config).then(() => {
+      logger.info("[RecordingManager] Recording started successfully");
+      return null;
+    }).catch((error) => {
+      logger.error("[RecordingManager] Error starting recording:", error);
+      return error;
+    });
+    if (recordingError) {
+      this.handleError(recordingError);
+      this.recordingState = RECORDING_STATE_IDLE;
+      this.callbacks.onStateChange(this.recordingState);
+      return;
+    }
+    this.startRecordingTimer();
+    if (this.maxRecordingTime && this.maxRecordingTime > 0) {
+      this.maxTimeTimer = window.setTimeout(async () => {
+        if (this.recordingState === RECORDING_STATE_RECORDING) {
+          await this.stopRecording();
+        }
+      }, this.maxRecordingTime);
     }
   }
   async stopRecording() {
+    logger.debug("[RecordingManager] stopRecording called");
     try {
       this.cancelCountdown();
       this.clearTimer(this.recordingIntervalId, clearInterval);
@@ -1297,7 +1659,9 @@ class RecordingManager {
       this.maxTimeTimer = null;
       this.resetPauseState();
       this.callbacks.onStopAudioTracking();
+      logger.debug("[RecordingManager] Stopping recording in stream manager");
       const blob = await this.streamManager.stopRecording();
+      logger.info("[RecordingManager] Recording stopped, blob size:", blob.size);
       this.recordingState = RECORDING_STATE_IDLE;
       this.callbacks.onStateChange(this.recordingState);
       this.recordingSeconds = 0;
@@ -2630,14 +2994,23 @@ class CameraStreamManager {
     this.mediaRecorder.stop();
   }
   async startRecording(processor, config) {
+    logger.debug("[CameraStreamManager] startRecording called", {
+      hasMediaStream: !!this.mediaStream,
+      isRecording: this.isRecording(),
+      hasProcessor: !!processor,
+      audioTracks: this.mediaStream?.getAudioTracks().length || 0
+    });
     if (!this.mediaStream) {
       throw new Error("Stream must be started before recording");
     }
     if (this.isRecording()) {
+      logger.debug("[CameraStreamManager] Already recording, returning");
       return;
     }
     this.streamProcessor = processor;
+    logger.debug("[CameraStreamManager] StreamProcessor assigned, starting processing");
     await processor.startProcessing(this.mediaStream, config);
+    logger.info("[CameraStreamManager] Processing started");
     this.bufferSizeUpdateInterval = window.setInterval(() => {
       if (!this.streamProcessor) {
         return;
@@ -2658,6 +3031,10 @@ class CameraStreamManager {
     this.startRecordingTimer();
   }
   async stopRecording() {
+    logger.debug("[CameraStreamManager] stopRecording called", {
+      hasStreamProcessor: !!this.streamProcessor,
+      isRecording: this.isRecording()
+    });
     if (!(this.streamProcessor && this.isRecording())) {
       throw new Error("Not currently recording");
     }
@@ -2665,13 +3042,19 @@ class CameraStreamManager {
     this.clearRecordingTimer();
     this.clearBufferSizeInterval();
     this.resetPauseState();
+    logger.debug("[CameraStreamManager] Finalizing stream processor");
     const result = await this.streamProcessor.finalize();
+    logger.info("[CameraStreamManager] Stream processor finalized", {
+      blobSize: result.blob.size,
+      hasBlob: !!result.blob
+    });
     this.setState("active");
     this.emit("recordingstop", {
       blob: result.blob,
       mimeType: "video/mp4"
     });
     this.streamProcessor = null;
+    logger.debug("[CameraStreamManager] StreamProcessor cleared");
     return result.blob;
   }
   pauseRecording() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vidtreo/recorder",
-  "version": "0.8.2",
+  "version": "0.8.4",
   "type": "module",
   "description": "Vidtreo SDK for browser-based video recording and transcoding. Features include camera/screen recording, real-time MP4 transcoding, audio level analysis, mute/pause controls, source switching, device selection, and automatic backend uploads. Similar to Ziggeo and Addpipe, Vidtreo provides enterprise-grade video processing capabilities for web applications.",
   "main": "./dist/index.js",