Webcam Zooms In when activating blur background

Description
I have a meeting preview page and when I activate the blur for the background the camera Zooms In. During this process, I’m changing the HTML Element from <video/> to <canvas/>
If the Canvas element is not being used. After the Zoom In is “applied” is doesn’t goes off

Browser Console Error
No Browser console error

Which Web Video SDK version?
1.12.12

Video SDK Code Snippets

const toggleBlur = async () => {
    if (isInVBMode) {
      if (isBlur) {
        await localVideoTrack?.updateVirtualBackground(undefined);
      } else {
        await localVideoTrack?.updateVirtualBackground('blur');
      }
      setIsBlur(!isBlur);
    } else if (!isBlur) {
      await localVideoTrack?.stop();
      if (canvasRef.current) {
        await localVideoTrack?.start(canvasRef.current, { imageUrl: 'blur' });
      }
      saveLocalPreferences('blur', !isBlur);
      setIsInVBMode(true);
      setIsBlur(!isBlur);
    }
  };

Screenshots
Screen Record - Dropbox link

Device (please complete the following information):

  • Device: Macbook PRO
  • OS: macOS 15.1
  • Browser: Chrome
  • Browser Version 131.0.6778.85 (Official Build) (arm64)

Additional context
This seems to only happen with the built-in Macbook webcam. External webcams or Windows built-in webcams is fine.

Hey @samuelhgf

Thanks for your feedback.

We can also occasionally reproduce this issue.
From the logs, the video capture aspect ratio might have changed. The blurred video was cropped from 4/3 ratio to 16/9, which makes the video appear slightly zoomed in.

We are still investigating the root cause of this issue.

Thanks
Vic

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.