Please tell me what is wrong in my javascript code or some other way in which this can be done.

See more:

Javascript

video

I am making a kind of proctoring website and for it I needed access to the user's screen and display it as a video to the proctor, so that he can monitor it. here is my code:

<div id="userscreen"></div>
<script>
document.getElementById('userscreen').innerHTML =
'<video src="' + navigator.mediaDevices.getDisplayMedia({cursor:true}); + '" autoplay>video not available</video>';
</script>
I have also tried to use the following approach:

<video id="userscreen" autoplay></video>
<script>
document.getElementById('userscreen').innerHTML = navigator.mediaDevices.getDisplayMedia({cursor:true});
</script>
What I want is to:

1- start capturing the user's screen(done)
2- display the screen as a video in the video tag


I am not able to do the second step. I have tried to do this in many ways, but none of them are working. I am able to capture the screen and display it as a video after the recording stops, but I want the live video to upload it side by side. this method should have worked according to me (I have used it for adding photos from camera to a webpage), but its not working for videos maybe. I have tried this on all browsers, its not working on any.


So please tell me what is wrong in my code or some other way in which it can be done.

What I have tried:

i have tried everything i could think of