React js - How to mock Context when testing component : <p>I'm trying to test a component which inherits context from a root component, without loading/rendering everything from the root down. I've tried and searched for examples on how to mock the context but can't find anything (at least that doesn't use jest).</p>

<p>Here's a simplified example of what I'm trying to achieve.</p>

<p>Is there a simple way I can mock reactEl.context for the test?</p>

<pre><code>/**
* Root Element that sets up &amp; shares context
*/
class Root extends Component {
  getChildContext() {
    return { 
      language: { text: 'A String'} 
    };
  }

  render() {
    return (
      &lt;div&gt;
        &lt;ElWithContext /&gt;
      &lt;/div&gt;
    );
  }
}

Root.childContextTypes = { language: React.PropTypes.object };

/**
 * Child Element which uses context
 */
class ElWithContext extends React.Component{
  render() {
    const {language} = this.context;
    return &lt;p&gt;{language.text}&lt;/p&gt;
  }
}

ElWithContext.contextTypes = { language: React.PropTypes.object }



/**
 * Example test where context is unavailable.
 */
let el = React.createElement(ElWithContext)

element = TestUtils.renderIntoDocument(el);
// ERROR: undefined is not an object (evaluating 'language.text')

describe("ElWithContext", () =&gt; {
  it('should contain textContent from context', () =&gt; {
    const node = ReactDOM.findDOMNode(element);
    expect(node.textContent).to.equal('A String');
  });
})
</code></pre>
