title: React App is giving error when using context API
body: <p>I am learning React and right now trying to implement the old way of working with Context API but when I try to compile I get an error.</p>
  <p>It says :</p>
  <p><code>TypeError: context is undefined. Version is 17.0.1</code></p>
  <p>Here are the files I use:</p>
  <p><strong>Test0.js</strong></p>
  <pre><code>import React from 'react';
  const Test0 = React.createContext();
  export default Test0;
  </code></pre>
  <p><strong>Test1.js</strong></p>
  <pre><code>import React, { Component } from 'react';
  import Test0 from './Test0';
  
  class Test1 extends Component{
  render(){
      return (
              &lt;Test0.Consumer&gt;
                  {context =&gt; (&lt;p&gt;This is {context.name}&lt;/p&gt; )}
              &lt;/Test0.Consumer&gt;
          );
  }
  }
  export default Test1;
  </code></pre>
  <p><strong>Test2.js</strong></p>
  <pre><code>import React, { Component } from 'react';
  import Test0 from './Test0';
  import Test1 from './Test1';
  
  class Test2 extends Component{
  state = {
      name: 'James',
      age : 30
  }
  render(){
      return (
          &lt;Test0.Provider
              value={{
                  name : this.state.name,
                  age: this.state.age
              }}
          &gt;
              &lt;Test1 /&gt;
          &lt;/Test0.Provider&gt;
          );
  }
  }
  
  export default Test2;
  </code></pre>
  <p>I then render <code>&lt;Test1 /&gt;</code> in <strong>app.js</strong></p>