Black box remains on canvas after stopping render

After calling mediaStream.stopRenderVideo(...) a black box remains.

I’ve tried doing mediaStream.stopRenderVideo(...).then(() => mediaStream.clearVideoCanvas(..)) which resolves without error, but the black box remains.

Browser Console Error
No errors

Which Web Video SDK version?

Device (please complete the following information):
macOS Big Sur
Chrome 94

Hey @nickuk ,

It looks like we did push an update that fixed this issue:

However, maybe it is a different issue. As a workaround you can try to hide / destroy the canvas with CSS or JS.

Can you provide a screenshot and a screenshot of the black box canvas in the browser DOM ?

CC @vic.yang


Hi @tommy / @vic.yang,

Sure, see below:

Dev tools screenshot:
Screenshot 2021-10-06 at 11.31.22

The canvas is positioned absolutely to 0, 0, has a width of 100vw, a height of 100vh, and a background color of transparent via stylesheet.



Thanks @nickuk .

@vic.yang , is there a recommend way to destroy the canvas, or is this a bug we can fix?


Hi @tommy / @vic.yang,

Just an extra note to help you along on this…

It appears as though maybe the buffer for the canvas isn’t being flushed or something similar. The reason I say this is that when you resize the window, which adjusts the canvas’ height and width, then the black box disappears.



Thanks for sharing that @nickuk !

We will take a look. :slight_smile: (ZOOM-315217)