Method captureFrame

app/src/utils/streamManager.ts:386–467

* Capture a frame from a video stream. Returns base64 PNG or null. * * For Tauri screen capture: uses raw frame bytes from the channel directly. * This bypasses the canvas-backed video element which can freeze when iOS * backgrounds the app. The broadcast extension continues sending fram

(
    streamType: 'camera' | 'screen',
    agentId?: string
  )

   * For camera/browser: uses persistent video elements for instant capture.
   */
  public async captureFrame(
    streamType: 'camera' | 'screen',
    agentId?: string
  ): Promise<string | null> {
    // For Tauri screen capture, use raw frame bytes from channel
    // This is more reliable than canvas-backed video element (especially on iOS)
    if (!isWeb() && streamType === 'screen') {
      const rawFrame = tauriStreamCapture.getLatestBase64Frame();
      if (!rawFrame) {
        Logger.warn("StreamManager", "Cannot capture screen: no raw frame available from channel");
        return null;
      }

      const crop = agentId ? getAgentCrop(agentId, streamType) : null;

      // If no crop, return raw frame directly (more efficient - no re-encoding)
      if (!crop) {
        return rawFrame;
      }

      // Apply crop by decoding, cropping, and re-encoding.
      // crop is normalized (0–1); resolve it against the real frame pixels here.
      try {
        const blob = await fetch(`data:image/jpeg;base64,${rawFrame}`).then(r => r.blob());
        const bitmap = await createImageBitmap(blob);

        const px = resolveCrop(crop, bitmap.width, bitmap.height);
        const canvas = document.createElement('canvas');
        canvas.width = px.width;
        canvas.height = px.height;
        const ctx = canvas.getContext('2d');
        if (!ctx) {
          bitmap.close();
          return rawFrame; // Fallback to uncropped
        }

        ctx.drawImage(bitmap, px.x, px.y, px.width, px.height, 0, 0, canvas.width, canvas.height);
        bitmap.close();

        return canvas.toDataURL('image/png').split(',')[1];
      } catch (e) {
        Logger.warn("StreamManager", `Failed to apply crop to raw frame: ${e}`);
        return rawFrame; // Fallback to uncropped
      }
    }

    // For camera or browser, use persistent video element
    const video = streamType === 'camera'
      ? this.cameraVideoElement
      : this.screenVideoElement;

    if (!video || video.readyState < 2 || video.videoWidth === 0) {
      Logger.warn("StreamManager", `Cannot capture ${streamType}: video not ready`);
      return null;
    }

    const canvas = document.createElement('canvas');
    const crop = agentId ? getAgentCrop(agentId, streamType) : null;