Place the cursor at the end on focus

Author: MartinRiese

src/richText.js

@@ -526,6 +526,18 @@ define([
             }
         });
 
+        inputElement.addEventListener('focus', function () {
+            const lastChild = inputElement.lastChild;
+            if (lastChild && lastChild.length > 0) { // should always be true because of the tailing ZWSP
+                const selection = window.getSelection();
+                const range = document.createRange();
+                range.setStart(lastChild, lastChild.length - 1);
+                range.collapse(true);
+                selection.removeAllRanges();
+                selection.addRange(range);
+            }
+        });
+
         function insertHTML(html) {
             if (window.getSelection) {
                 const sel = window.getSelection();

tests/atwho.js

@@ -186,7 +186,7 @@ define([
             }
 
             it("should show questions with #form", function() {
-                displayAtwho('#form', function(mug) {
+                displayAtwho('#form\u200B', function(mug) {
                     var atwhoEntries = getDisplayedAtwhoViews().find('li'),
                         tags = _.map(atwhoEntries, function(li) {
                             return $.trim($(li).text()).replace(/\n[^]*$/, "");
@@ -200,7 +200,7 @@ define([
             });
 
             it("should show questions after a dash", function () {
-                displayAtwho('#dash-dash', function(mug) {
+                displayAtwho('#dash-dash\u200B', function(mug) {
                     var atwhoEntries = getDisplayedAtwhoViews().find('li'),
                         tags = _.map(atwhoEntries, function(li) {
                             return $.trim($(li).text()).replace(/\n[^]*$/, "");
@@ -210,7 +210,7 @@ define([
             });
 
             it("should show case properties with #case", function() {
-                displayAtwho('#case', function(mug) {
+                displayAtwho('#case\u200B', function(mug) {
                     var atwhoEntries = getDisplayedAtwhoViews().find('li'),
                         tags = _.map(atwhoEntries, function(li) {
                             return $.trim($(li).text()).replace(/\n[^]*$/, "");
@@ -220,7 +220,7 @@ define([
             });
 
             it("should show case properties and form questions with #", function() {
-                displayAtwho('#', function(mug) {
+                displayAtwho('#\u200B', function(mug) {
                     var atwhoEntries = getDisplayedAtwhoViews().find('li'),
                         tags = _.map(atwhoEntries, function(li) {
                             return $.trim($(li).text()).replace(/\n[^]*$/, "");

tests/richText.js

@@ -638,18 +638,22 @@ define([
                     util.assertXmlEqual(call('createXML'), BURPEE_XML);
                 });
 
-                // it("cursor should be at end of input on focus", function () {
-                //     var editor = richText.editor(widget.input),
-                //         value = 'testing cursor';
-                //     widget.setValue(value);
-                //     // Make sure focus is elsewhere, then focus on the rich text input
-                //     // editor.on('instanceReady', function() {
-                //     $('[name=property-nodeID]').focus();
-                //     editor.focus();
-                //     var selection = editor.getSelection(true);
-                //     assert.strictEqual(selection.getNative().focusOffset, value.length);
-                //     // });
-                // });
+                it("cursor should be at end of input on focus", function () {
+                    var editor = richText.editor(widget.input),
+                        value = 'testing cursor';
+                    widget.setValue(value);
+                    // Make sure focus is elsewhere, then focus on the rich text input
+                    // editor.on('instanceReady', function() {
+                    $('[name=property-nodeID]').focus();
+                    editor.focus();
+                    var selection = window.getSelection();
+                    assert.exists(selection);
+                    var range = selection.getRangeAt(0);
+                    assert.exists(range);
+                    assert.isTrue(range.collapsed);
+                    assert.strictEqual(range.startContainer, range.startContainer.parentNode.lastChild);
+                    assert.strictEqual(range.startContainer.textContent, "\u200B");
+                });
 
 
                 it("should change output ref to output value", function () {