Description
On iOS Safari, when rendering the local video using startVideo() on a video-player element, turning the camera off using stopVideo() and then turning it back on causes the local video to remain black.
Note: The remote participant can still see the video after the second startVideo(), so this seems to affect local rendering only.
Browser Console Error
An error appears in the console when calling stopVideo():
Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
at removeChild (http://localhost:5000/static/js/main.c3d2455b.js:240089:22)
at commitDeletionEffectsOnFiber (http://localhost:5000/static/js/main.c3d2455b.js:251117:19)
...
If I comment out the video-player DOM element, the error disappears (but of course, no video is displayed at all).
Which Web Video SDK version?
2.1.10
**Video SDK Code Snippets **
I’m using the official videosdk-web-sample with minimal changes.
To Reproduce(If applicable)
Steps to reproduce the behavior:
- Open the sample app on iOS Safari
2. Call startVideo() → local video is displayed
3. Call stopVideo() → console logs removeChild error
4. Call startVideo() again → local video remains black
5. Remote participant still receives the video stream normally
Screenshots
none
Troubleshooting Routes Tried
-
Tried using stopRenderVideo() → No improvement
-
Tried hiding video-player with display: none or visibility: hidden
Removes the removeChild error
But video still fails to render on second startVideo()
-
Verified the issue only happens on iOS Safari. Other browsers and platforms are unaffected.
Device (please complete the following information):
• | Device: iPhone | |
---|---|---|
• | OS: Latest iOS (e.g., iOS 18.5) | |
• | Browser: Safari | |
• | Browser Version: Latest |
Additional context
The code is based on videosdk-web-sample.