Description
Users are saying they’re not seeing the picture in picture after their partner joins. When they join the meeting, they can see themselves, when the other person joins they can only see them and the popover of the local video feed is not visible.
Is there a setting to enable this that I’ve mised?
Error
No Picture in Picture window with local stream.
Which version?
1.7.6
To Reproduce(If applicable)
Steps to reproduce the behavior:
Happening with any meeting we create.
We see this in the Web Client but not in the SDK which seems odd.
To be clear: when the host is sharing his/her screen the video of the host is no longer displayed in a small draggable window. But this DOES work if you use the zoom hosted web client. It has stopped working, suddenly, on 1.7.5 and above versions of the Web SDK.
And to add to the confusion, I’ve noticed the if you leave web Web SDK running for a while (again, while someone is screen sharing with their video enabled) sometimes their video will in fact appear. I’ve only seen it happen once though, otherwise it does not appear.
And finally, it seems to be an issue with where the camera feed is placed. When going full screen you can find it and see it, but when not in full screen mode it’s not visible, presumably because its offscreen somewhere.
Update, we found the broken box which shows the sizing buttons, but the picture is not visible and it only shows up when you enter fullscreen mode and exit it then the corner is right under the fullscreen button which I only noticed by accident since it flashed when my mouse brushed over it.
To be clear: when the host is sharing his/her screen the video of the host is no longer displayed in a small draggable window. But this DOES work if you use the zoom hosted web client. It has stopped working, suddenly, on 1.7.5 and above versions of the Web SDK.
After investigating this issue with our Web SDK engineers, we want you to check if you are importing / linking the Zoom Web SDK CSS files more then once. This seems to cause the issue.
Can you email us your index.js file along with marketplace developer email and meeting ID used at developersupport@zoom.us? We want to make sure nothing is overriding the imported files.
I commented out the 2, heavily prefixed, styles we had on the page, cleared the cache and confimed the page source was updated, and this is still exhibiting the same behaviour.
Anyone else having this issue should ensure they have a <!DOCTYPE html> tag at the top of the page. I’m not sure why this breaks the PiP, and only PiP, but after stripping the minimal, prefixed, css that controlled a loading spinner overlay, to make our HTML look like a stripped down version of what was in the Sample App, the only difference was the missing DOCTYPE and until we added that the PiP would not work.
This is the weirdest issue I’ve ever seen. Browsers have been gracefully handling a missing DocType for a very long time. Any idea what specifically with the Zoom Web SDK would break because it was missing?
When I view the page source (in FF at least) the DocType is added automatically at the top for the pages where it was not added explicitly.
While glad this is resolved, I’m more confused about the solution than the problem.
Hello, this is NOT due to incorrect CSS usage. I have conclusive proof this is intentionally done by the Zoom Web SDK and I’m kind of surprised no one seems to know about it.
Using the WebSDK when the viewport goes below a certain width the DIV which containers the speaker video (while the speaker is screen-sharing) has its class name change from “suspension-content2” to “suspension-canvas-hide”. As the viewport increases in width, the reverse happens. When the “suspension-canvas-hide” class name is used, the PiP window is hidden.
It did NOT use to work this way, around 1.7.5 and before. We very much prefer the old way this worked or at least the option to disable or adjust the width being used.
