title: Parsing error: missing semicolon on render()
body: <p>I am currently following a ReactJS tutorial and got an parsing error where the render is missing a semicolon. I can't find any missing curly braces or anything regarding this missing semicolon error and I don't think that render even needs a semicolon. Here's the code, please guide me in fixing this.</p>
  <pre><code>import React, { Component } from &quot;react&quot;
  import io from 'socket.io-client'
  
  class App extends Component{
    constructor(props){
      super(props)
  
      this.localVideoref = React.createRef()
      this.remoteVideoref = React.createRef()
  
      this.socket = null
    }
  
    componentDidMount = () =&gt;{
      this.socket = io(
        '/webrtcPeer',
        {
          path: '/webrtc',
          query: {}
        }
      )
  
      this.socket.on('connection-success', success =&gt; {
        console.log(success)
      })
  
      this.socket.on('offerOrAnswer', (sdp) =&gt; {
        this.textref.value = JSON.stringify(sdp)
  
        this.pc.setRemoteDescription(new RTCSessionDescription(sdp))
      })
  
      this.socket.on('candidate', (candidate) =&gt; {
        this.pc.addIceCandidate(new RTCIceCandidate(candidate))
      })
  
      const pc_config = {
        &quot;iceServers&quot;: [
          {
            urls : 'stun:stun.l.google.com:19302'
          }
        ]
      }
  
      this.pc = new RTCPeerConnection(pc_config)
  
      this.pc.onicecandidate = (e) =&gt; {
        if (e.candidate) {
          this.sendToPeer('candidate', e.candidate)
      }
  
      this.pc.oniceconnectionstatechange = (e) =&gt; {
        console.log(e)
      }
  
      this.pc.onaddstream = (e) =&gt; {
        this.remoteVideoref.current.srcObject = e.stream
      }
  
      const constraints = {
        video: true,
        audio: false
      }
  
      const success = (stream) =&gt; {
        window.localStream = stream
        this.localVideoref.current.srcObject = stream
        this.pc.addStream(stream)
      }
  
      const failure = (e) =&gt; {
        console.log('getUserMedia Error: ', e)
      }
  
      navigator.mediaDevices.getUserMedia(constraints)
      .then(success)
      .catch(failure)
    }
  
    createOffer = () =&gt; {
      console.log('Offer')
      this.pc.createOffer({offerToReceiveVideo: 1})
      .then(sdp =&gt; {
        // console.log(JSON.stringify(sdp))
        this.pc.setLocalDescription(sdp)
        this.sendToPeer('offerOrAnswer', sdp)
      })
    }
    
    setRemoteDescription = () =&gt; {
      const desc = JSON.parse(this.textref.value)
  
      this.pc.setRemoteDescription(new RTCSessionDescription(desc))
    }
  
    createAnswer = () =&gt; {
      console.log('Answer')
      this.pc.createAnswer({offerToReceiveVideo: 1})
      .then(sdp =&gt; {
        // console.log(JSON.stringify(sdp))
        this.pc.setLocalDescription(sdp)
        this.sendToPeer('offerOrAnswer', sdp)
      }, e =&gt; {})
    }
  
    addCandidate = () =&gt; {
      this.candidate.forEach(candidate =&gt; {
        console.log(JSON.stringify(candidate))
        this.pc.addIceCandidate(new RTCIceCandidate(candidate))
      })
    }
    
  render() {
    return (
      &lt;div&gt;
        &lt;video
          style={{
            width: 240,
            height: 240,
            margin: 5,
            backgroundColor: 'black'
          }}
          ref={ this.localVideoref }
          autoPlay&gt;
        &lt;/video&gt;
        &lt;video
          style={{
            width: 240,
            height: 240,
            margin: 5,
            backgroundColor: 'black'
          }}
          ref={ this.remoteVideoref }
          autoPlay&gt;
        &lt;/video&gt;
        &lt;br /&gt;
  
        &lt;button onClick={this.createOffer}&gt;Offer&lt;/button&gt;
        &lt;button onClick={this.createAnswer}&gt;Answer&lt;/button&gt;
  
        &lt;br /&gt;
        &lt;textarea style={{ width: 450, height:40 }} ref={ref =&gt; { this.textref = ref }} /&gt;
      &lt;/div&gt;
      )}
    }
  }  
  
  export default App 
  </code></pre>