12

I just noticed this on stackoverflow.com now when editing (a) question(s) and meta (so far):

When I click on the "edit" option for a question, that the cursor now goes to the bottom of the question rather than on top.

I also cleared my cache and restarted my browser; same result.

I am using Firefox 51.0.1. Doing a Firefox upgrade to version 51 is what seems to be the issue here. The problem is happening on my Windows 7 machine but not on my Linux Mint machine with the same version of Firefox (51).

From comments:

"Just tried this on a UBUNTU VM running on Windows 7. FF50 opened at top of edit box. Upgraded to FF51 and edit box opens with the cursor at the bottom of the text – RiggsFolly"

and

"This also happens in Firefox 52 on windows 7 – Tiny Giant"

I just tried a few other areas of the network that I am subscribed to and the cursor focuses/stays in the "Title" input as opposed to the textarea of what seems to only be affected at stackoverflow.com and meta.stackoverflow.com.

24
  • 1
    No repro, either with the inline editor or when opening it on a new page. What browser are you using?
    – Cody Gray Mod
    Commented Jan 27, 2017 at 15:11
  • @CodyGray Firefox 51.0.1 Commented Jan 27, 2017 at 15:12
  • Reproduced as well when trying to edit this question with the same Firefox version on Vista...
    – Tunaki
    Commented Jan 27, 2017 at 15:13
  • well that is most bizarre Commented Jan 27, 2017 at 15:15
  • Ahh, yes, it happens when editing this question!
    – RiggsFolly
    Commented Jan 27, 2017 at 15:19
  • Now its happening on SO as well
    – RiggsFolly
    Commented Jan 27, 2017 at 15:20
  • @RiggsFolly So, this is a recent thing then. It may not have caught up with the others then yet. Commented Jan 27, 2017 at 15:20
  • I tried it on FF 50 and it did not happen. Then I did the FF51 upgrade and it started happening
    – RiggsFolly
    Commented Jan 27, 2017 at 15:21
  • @RiggsFolly so it's a Firefox related thing which will makes this all that much more harder to figure out why and if it is related to only Firefox and/or Stack. Commented Jan 27, 2017 at 15:25
  • 8
    @Tunaki Vista?!? :) Commented Jan 27, 2017 at 15:27
  • 4
    can someone tell me why this got a downvote? I'm obviously not the only person experiencing this. Commented Jan 27, 2017 at 15:35
  • 1
    Just tried this on a UBUNTU VM running on Windows 7. FF50 opened at top of edit box. Upgraded to FF51 and edit box opens with the cursor at the bottom of the text
    – RiggsFolly
    Commented Jan 27, 2017 at 16:21
  • This also happens in FireFox 52 on windows 7
    – user4639281
    Commented Jan 27, 2017 at 16:29
  • @TinyGiant I didn't know there was a version 52; so this all seems to have started with 51 and keeps on going then; this one risks in getting very hard to resolve; thanks for that btw. Commented Jan 27, 2017 at 16:31
  • 9
    People complain about browsers not following standards, but the one time a browser vendor takes steps to improve their product's standards compliance, things go bananas. This is why we can't have nice things.
    – BoltClock Mod
    Commented Jan 27, 2017 at 17:56

2 Answers 2

12

Beginning in version 51, Firefox changed the behavior of HTMLElement#focus so that the caret is placed at the end of the text instead of the start of the text. After reviewing the definition of how focus should behave, it does not seem that there is any specification for where the caret should be placed.

The code which causes this in the inline editor is:

$('#wmd-input-342386').focus();

The jQuery part is irrelevant, because using the non-jQuery version does the same thing. This is an implementation change introduced by Firefox, and is not due to anything on Stack Overflow's end.

I have included the following MCVE for reference.

<textarea cols="50" rows="10">The caret should be placed at the start of the text, but in Firefox 51+ it is placed at the end of the text instead.</textarea>
<script>
  setTimeout(function() {
    window.focus(); // Give the focus to the frame
    document.querySelector('textarea').focus();
  }, 15);
</script>

To reconcile the behavior in all modern browsers (IE9+), you can set the selectionEnd property of the element to 0, which is the equivalent of calling setSelectionRange(0,0).

<textarea cols="50" rows="10">The caret should be placed at the start of the text in all modern browsers now.</textarea>
<script>
  setTimeout(function() {
    window.focus();
    var textarea = document.querySelector('textarea')
    textarea.focus(); // Give the focus to the frame
    textarea.selectionEnd = 0;
  }, 15);
</script>

6
  • Thanks again for all you did. I'm sure there are others who are faced with the same problem as I (or will as soon as they upgrade to the newest version). Did you by any chance submit a bug report to Mozilla? I was thinking of doing it earlier, but didn't know quite what to tell them. Commented Jan 27, 2017 at 23:47
  • 2
    No, I haven't submitted a bug report. I'm allergic to bugzilla.
    – user4639281
    Commented Jan 27, 2017 at 23:49
  • Hahaha! I get ya. I'll send one and keep you posted, cheers Commented Jan 27, 2017 at 23:51
  • Sounds good :-)
    – user4639281
    Commented Jan 27, 2017 at 23:52
  • I have filed the following bug report on bugzilla bugzilla.mozilla.org/show_bug.cgi?id=1334723 Commented Jan 28, 2017 at 13:24
  • @RiggsFolly There is more activity in the bug report where someone did post a jsfiddle that behaves the same way jsfiddle.net/zevp3dpa Commented Jan 28, 2017 at 14:21
3

This behavior was intentionally changed in bug 1287655 - input/textarea selectionStart, selectionEnd should return cursor position when selection is empty

data:text/html,<script>window.onload = function() { var i = document.createElement("input"); i.value="foo"; document.body.appendChild(i); i.focus();  }</script>

shows where cursor is put. We have it at 0, Chrome puts it at the end of text.

Also see Firefox Site Compatibility:

Previously, when an <input> or <textarea> element received a focus with the focus method, a caret was initially placed at the beginning of the text, and therefore, both the selectionStart and selectionEnd properties on the form control would always be 0.

Firefox 51 has changed the behaviour to follow the HTML spec, so that a caret will be placed at the end of the text, and these properties will be the same value as the text length. The setSelectionRange method can be used to specify the selection range if needed.

18
  • "This behavior was intentionally changed" - I take it that Stack didn't foresee that. If Stack doesn't have a fix for that behaviour in some browsers, I take it that I/we will just have to get used to it and live with it. Thanks for this btw. Am wondering if the "feature request" tag should be added to the question at this point? Commented Jan 28, 2017 at 14:38
  • @Fred-ii- You can ask a feature request about using setSelectionRange(0,0) to move the cursor to the beginning. But Chrome users might be used to have the cursor at the end, and oppose the change.
    – Oriol
    Commented Jan 28, 2017 at 14:44
  • "But Chrome users might be used to have the cursor at the end, and oppose the change" - I don't quite understand what you meant by that, but the way I look at it is: when editing in any browser, one would think that it would only make sense to have the cursor be at the upper left should the beginning of what stands to be a long question, that code and/or text needs to be edited at the top, rather than the pointer be at the bottom and then having to go all the way back up to edit those parts, if you know what I mean ;-) Commented Jan 28, 2017 at 14:48
  • Here's a related bug report btw bugzilla.mozilla.org/show_bug.cgi?id=1287655 which seems to also explain everything. I had a feeling about that actually, about if a textarea was "empty". Funny how my instinct works at times. Commented Jan 28, 2017 at 14:50
  • "You can ask a feature request about using setSelectionRange(0,0) to move the cursor to the beginning" - I take it that I should be asking another question and add a reference link to this question? Or, should I edit my question? Commented Jan 28, 2017 at 14:52
  • 1
    @Fred-ii- Yes, I would ask a new question tagged [feature-request], and explain why you think it's better to move the cursor to the beginning
    – Oriol
    Commented Jan 28, 2017 at 14:56
  • I posted a new question meta.stackoverflow.com/q/342417/1415724 Commented Jan 28, 2017 at 15:29
  • ...to which I received 2 negative votes; lovely. ^ Commented Jan 28, 2017 at 15:39
  • @Fred-ii- Probably they are from Chrome users who don't want to change
    – Oriol
    Commented Jan 28, 2017 at 15:46
  • Yeah, I guess so. Personally, I'm no fan of Chrome. It messes with my OS which I don't particularly appreciate. Commented Jan 28, 2017 at 16:18
  • @Fred does your issue with Google Chrome extend to Chromium based browsers? I'm one of the six users of Vivaldi, and I love it.
    – user4639281
    Commented Jan 28, 2017 at 17:18
  • @TinyGiant My issue isn't with Google Chrome; I don't have it installed, I only have FF (and IE 11). Also FF 51 on Linux, unless I didn't grasp your comment. Commented Jan 28, 2017 at 17:19
  • @Fred I was replying to "Personally, I'm no fan of Chrome. It messes with my OS which I don't particularly appreciate."
    – user4639281
    Commented Jan 28, 2017 at 17:21
  • @Oriol I don't really understand how they got from "selectionStart and selectionEnd must return the offset (in logical order) to the character that immediately follows the text entry cursor" to "the HTML spec says that the cursor must be inserted at the end of the text". That makes very little sense. I realize this has nothing to do with you, but I don't like commenting on bugzilla.
    – user4639281
    Commented Jan 28, 2017 at 17:25
  • 1
    For what it's worth, Chrome only does set the focus to the end of text on <input> element, not on textarea, so chrome SO users wouldn't be affected by an setSelectionRange(0) fix.
    – Kaiido
    Commented Jan 29, 2017 at 14:04

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .