title: TypeError: Cannot read property 'contentWindow' of undefined
body: <p>I am trying to make a rich text editor using React.js and I am using iframe with the designMode property set to 'ON'. I want to make the selected text bold on click of a button. I want to use the execCommand() function but I keep getting this error: <strong>TypeError: Cannot read property 'contentWindow' of undefined.</strong> I am a beginner in React and I'm unable to figure out how to tackle this problem.</p>
  <p>I've attached my code for your reference.</p>
  <pre><code>import React, { Component } from 'react'
  import 'font-awesome/css/font-awesome.css'
  
  
  export default class Editor extends Component {
  
      constructor(){
          super()
          this.execComd = this.execComd.bind(this)
      }
  
      componentDidMount(){
         let editor = this.textField.contentWindow.document
         editor.designMode = 'on'
      }
  
      execComd(command){
          this.textField.contentWindow.execCommand(command, false, null)   
      }
  
      render() {
          return (
              &lt;&gt; 
                  &lt;div&gt;
                      &lt;button onClick={this.execComd('bold')}&gt;&lt;i className=&quot;fa fa-bold&quot;&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;/div&gt;
                  &lt;iframe 
                      ref={textField =&gt; this.textField = textField} 
                      id=&quot;textField&quot; 
                      name=&quot;textField&quot; 
                      style={{width: &quot;1000px&quot;,height: &quot;500px&quot;}} 
                      frameborder=&quot;1&quot;&gt;
                  &lt;/iframe&gt;
              &lt;/&gt;
          )
      }
  }
  </code></pre>