title: how can I know what triggered render in React?
body: <p>I have a very big application with higher order components everywhere. I am in a situation where one of my controls gets the right props and renders right, and then immediately gets wrong props and rerenders again. I cannot figure out what triggers the second rerender. It's not because of a new round of props at that a parent component got, but more like some of the higher order components calls <code>setState</code></p>
  
  <p>anyway so I have my debugger at a break point inside the <code>render</code> method, how can I know what triggered it on a higher level?</p>
  
  <p>the stack doesn't help much, all i see is the internal React calls:</p>
  
  <pre><code>render (value-picker.tsx:218)
  finishClassComponent (react-dom.js:8415)
  updateClassComponent (react-dom.js:8392)
  beginWork (react-dom.js:8767)
  performUnitOfWork (react-dom.js:10766)
  workLoop (react-dom.js:10830)
  callCallback (react-dom.js:580)
  invokeGuardedCallbackDev (react-dom.js:619)
  invokeGuardedCallback (react-dom.js:476)
  renderRoot (react-dom.js:10908)
  performWorkOnRoot (react-dom.js:11556)
  performWork (react-dom.js:11509)
  batchedUpdates (react-dom.js:11628)
  batchedUpdates (react-dom.js:2504)
  dispatchEvent (react-dom.js:3668)
  </code></pre>