title: React onTransitionEnd event gets called frequently
body: <p>I have React code like this:</p>
  
  <pre><code>handleTransitionEnd() {
      console.log('ended');
  }
  
  &lt;div onTransitionEnd={(ev) =&gt; this.handleTransitionEnd(ev)}....
  </code></pre>
  
  <p>The peculiar thing is that my logs are filling up with <code>ended</code>. Even if I don't have any transition css logic tied to the element at all. It seems to be firing on every state change or re render. Is this normal? I would expect it to only fire when a css transition ends.</p>
  
  <p>Is there some other way this callback should be achieved?</p>
  
  <p>Thanks</p>
  
  <p>UPDATE:</p>
  
  <p>here is a sandbox showing some strangeness: <a href="https://codesandbox.io/s/vy5wwyq5v3" rel="nofollow noreferrer">https://codesandbox.io/s/vy5wwyq5v3</a></p>
  
  <p>Clicking the first button causes the callback to be called 3 times, then if you click the second button it gets called another 2 times even tho a transition doesn't happen. My app is even more extreme than this with it getting called a lot more often.</p>