title: How to get the QueryRenderer to propagate parent prop changes?
body: <p>Using Relay Modern v.1.4.1, consider the following <code>List</code> component.</p>
  
  <p>It takes two props <code>foo</code> and <code>bar</code> and renders a <code>Table</code> component with these props and the result of the GraphQL query:</p>
  
  <pre><code>class List extends React.Component {
  
    constructor(props) {
      super(props);
      // I accept this.props.foo and this.props.bar
      this.renderQuery = this.renderQuery.bind(this);
    }
  
    render() {
      return &lt;QueryRenderer
        environment={this.props.relayEnvironment}
        query={SomeQuery}
        variables={{
          count: 20,
        }}
        render={this.renderQuery}
      /&gt;;
    }
  
    renderQuery(readyState) {
      console.log("List component props:");
      console.log(this.props);
      return &lt;Table 
        foo={this.props.foo} bar={this.props.bar} 
        data={readyState.data}
      /&gt;
    }
  
  }
  </code></pre>
  
  <p>Now, for the initial rendering of the <code>Table</code> component <code>foo</code> and <code>bar</code> are set correctly, however if <code>foo</code> or <code>bar</code> change afterwards the new values are not propagated to the <code>Table</code> component because of the <code>QueryRenderer</code>.</p>
  
  <p>Since the <code>QueryRenderer</code> only re-renders if the <code>variables</code> for <code>SomeQuery</code> change the <code>renderQuery</code> method is not triggered because the <code>QueryRenderer</code> does not see a need for it, so the <code>Table</code> component stays with the old prop values.</p>
  
  <p>Since passing down props to children is a very common task the fact that the <code>QueryRenderer</code> is oblivious to the parent's prop changes poses quite a problem. I've been wondering what the solution for this might be and came up with some options:</p>
  
  <ol>
  <li>Use <a href="https://reactjs.org/docs/context.html" rel="nofollow noreferrer">Context</a> to bypass this behaviour. However it is generally discouraged to use Context unless you have good reasons for it + it feels like a dirty hack to circumvent the issue.</li>
  <li>Force the <code>QueryRenderer</code> to re-render with the same <code>readyState</code> as before. This could perhaps be realized using <code>refs</code> but you would need to check when to re-render by yourself.</li>
  <li>Somehow make the <code>QueryRenderer</code> care about my props. This is obviously the right way but I didn't find anything in the documentation that allows this, so I would need to do something like creating a Higher Order Component from the <code>QueryRenderer</code> or a subclass of it that implements this behavious.</li>
  </ol>
  
  <p>Ideally I would like to have a native way to make the <code>QueryRenderer</code> look at prop changes, something like</p>
  
  <pre><code>&lt;QueryRenderer
    environment={this.props.relayEnvironment}
    query={SomeQuery}
    variables={{
      count: 20,
    }}
    render={this.renderQuery}
    propagateProps={this.props}
  /&gt;
  </code></pre>
  
  <p>or</p>
  
  <pre><code>&lt;QueryRenderer
    environment={this.props.relayEnvironment}
    query={SomeQuery}
    variables={{
      count: 20,
    }}
    render={this.renderQuery}
    {...this.props}
  /&gt;
  </code></pre>
  
  <p>Any ideas?</p>