<p dir="auto"><strong>What is the current behavior?</strong><br>
Using <code class="notranslate">.stopPropagation</code> in an <code class="notranslate">onFocus</code> event on a textarea or its parent causes the cursor to disappear or render at an incorrect location in Firefox.</p>
<p dir="auto">You can see the vanishing cursor <a href="https://jsfiddle.net/aq59me3d/3/" rel="nofollow">at this fiddle</a>. There are no issues on Chrome and Edge, but FireFox 50.1.0 has this problem. In my full app, the cursor doesn't vanish but rather moves elsewhere (italics are placeholder text):</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/2739312/21473053/83e67f52-cac5-11e6-8b6c-1e1f98289bb6.png"><img width="118" alt="2016-12-25" src="https://cloud.githubusercontent.com/assets/2739312/21473053/83e67f52-cac5-11e6-8b6c-1e1f98289bb6.png" style="max-width: 100%;"></a></p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/2739312/21473058/a0e1f168-cac5-11e6-872e-70d8e6d83c93.png"><img width="88" alt="2016-12-25 1" src="https://cloud.githubusercontent.com/assets/2739312/21473058/a0e1f168-cac5-11e6-872e-70d8e6d83c93.png" style="max-width: 100%;"></a></p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/2739312/21473055/8836dc5a-cac5-11e6-8adc-4edb65763104.png"><img width="66" alt="2016-12-25 2" src="https://cloud.githubusercontent.com/assets/2739312/21473055/8836dc5a-cac5-11e6-8adc-4edb65763104.png" style="max-width: 100%;"></a></p>
<p dir="auto">I have not reproduced this behavior in the fiddle.</p>
<p dir="auto"><strong>What is the expected behavior?</strong><br>
It's hard to say what the expected behavior is, since the real <code class="notranslate">focus</code> event does not bubble. <a href="https://jsfiddle.net/axacmxfv/" rel="nofollow">Here</a>'s a fiddle to show that the cursor position is not affected when the event is stopped in a vanilla-JS environment.</p>
<p dir="auto"><strong>Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?</strong><br>
The fiddle shows the issue with <code class="notranslate">15.4.1</code> on FF (on Windows 10).  I saw the same issue on <code class="notranslate">15.3</code>.</p>
<p dir="auto"><strong>Why stopPropagation</strong><br>
Before I get eaten alive for using this, I'll just say that having a non-bubbling focus event simplifies one of the interactions I'm setting up. Specifically, my app has a bunch of widgets that can be marked active. When a user clicks into a field in the widget, that widget should be marked active. However, widgets can be nested in other widgets, in which only the inner-most widget should be marked active.</p>
<p dir="auto"><strong>Do you want to request a <em>feature</em> or report a <em>bug</em>?</strong><br>
Bug</p>
<p dir="auto"><strong>What is the current behavior?</strong><br>
When the onFocus event handler of an  element calls stopPropagation, the cursor of the  element as well as the selection is not shown in Firefox 54.0.1 64 Bit.</p>
<p dir="auto"><strong>Steps to reproduce</strong><br>
Create an  element and call stopPropation() in the onFocus event handler.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="handleOnFocus(e) {
  e.stopPropagation();
}
render() {
  return &lt;input onFocus={this.handleOnFocus} type=&quot;text&quot; /&gt;;
}"><pre class="notranslate"><code class="notranslate">handleOnFocus(e) {
  e.stopPropagation();
}
render() {
  return &lt;input onFocus={this.handleOnFocus} type="text" /&gt;;
}
</code></pre></div>
<p dir="auto"><a href="https://jsfiddle.net/y36vcoLb/1/" rel="nofollow">JSFiddle</a></p>
<p dir="auto"><strong>What is the expected behavior?</strong><br>
Expected is that the cursor and the selection of text is visible in the  element, as seen in Chrome 58 64-Bit and Edge 38.</p>
<p dir="auto"><strong>Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?</strong><br>
I have seen this issue in React 15.5.4 and 15.6.1 in Firefox 54.0.1 64-Bit on Windows 10</p>