HTML video component full screen -> smaller size (how to not stop play)

Hello,


I am building a webrtc calling app which will allow people to make calls from a mobile website to a native app. This question is about the website, which I am building in reactjs.


Everything is working fine on safari mobile, but I wanted to give the user the ability to see their interlocutor, full screen.


I have implemented a simple function which calls the webkitEnterFullscreen() on the html ref for the video container I have on the website. It goes full screen, just as I want.


However, when the user then clicks "x" to leave full screen mode, the video reverts to the container, but freezes. I have tried to add code calling .play() on the element but no such luck. It is only if I reload the entire page, that I can get the stream reattached and playing (after going through the WebRTC video and audio permissioning again).


Is this a permissioning issue? If, while the video is frozen, I again activate full screen mode, and then select the "play" button on safari's native controls, the stream plays.


So basically I am asking this: If I have already accepted the permissions to have a live audio/video WebRTC stream, and the participant stream appears video and audio, and I expand that video container to full screen, and then close the full screen option, how can I get the video to continue to play, and not freeze?


Thank you!