JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<button id="start" type="button">Start</button>
<video autoplay></video>

CSS

video {
    width: 100%;
    background: #fed;
}

JavaScript

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

var constraints = {
    video: {
        mandatory: {
            chromeMediaSource: "screen"
        }
    }
};
var video = document.querySelector("video");

function successCallback(stream) {
    if (window.URL) {
        video.src = window.URL.createObjectURL(stream);
    } else {
        video.src = stream;
    }
    video.play();
}

function errorCallback(error) {
    console.log("navigator.getUserMedia error: ", error);
}

$("#start").on("click", function () {
    navigator.getUserMedia(constraints, successCallback, errorCallback);
});