$button.addEventListener('click', () => {
  const context = $canvas.getContext('2d')

  context.drawImage($video, 0, 0, $canvas.width, $canvas.height)
})

navigator.mediaDevices.getUserMedia({video: true})
  .then(stream => $video.srcObject = stream)

It has to be https:

https://jsfiddle.net/gengns/emdjq8rh/