title: Viewing video feed from WebRTC in react
body: <p>Here is the HTML code</p>
  <pre><code>&lt;video ref={videos}  autoPlay &gt;&lt;/video&gt;
  
     &lt;Button onClick={() =&gt; 
  navigator.mediaDevices.getUserMedia({audio: true, video: true}).then((mediaStream) =&gt; {
  
    videos.srcObject = mediaStream;
    videos.onloadedmetadata = function(e) {
      videos.play();
    };
  }
  )}&gt;Record&lt;/Button&gt;
  </code></pre>
  <p>JS</p>
  <pre><code>const videos = createRef(null);
  </code></pre>
  <p><strong>Error</strong></p>
  <p><em>Unhandled Rejection (TypeError): Cannot add property srcObject, object is not extensible</em></p>
  <pre><code> 353 |    &lt;Button onClick={() =&gt; 
    354 | navigator.mediaDevices.getUserMedia({audio: true, video: true}).then((mediaStream) =&gt; {
    355 | 
  &gt; 356 |   videos.srcObject= mediaStream;
    357 |   videos.onloadedmetadata = function(e) {
    358 |     videos.play();
    359 |   };
  </code></pre>