From 140fe64fea94bec3b0b88d2ede5c29a40b8610a4 Mon Sep 17 00:00:00 2001 From: Ray Tiley Date: Tue, 24 Feb 2015 11:51:34 -0500 Subject: [PATCH 1/2] [BUGFIX beta] Don't render attr if current value is same as new value --- packages/ember-views/lib/attr_nodes/attr_node.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/ember-views/lib/attr_nodes/attr_node.js b/packages/ember-views/lib/attr_nodes/attr_node.js index 31dcc45408f..17ba8b5d26c 100644 --- a/packages/ember-views/lib/attr_nodes/attr_node.js +++ b/packages/ember-views/lib/attr_nodes/attr_node.js @@ -50,6 +50,11 @@ AttrNode.prototype.render = function render(buffer) { if (this.attrName === 'value' && (value === null || value === undefined)) { value = ''; } + + // If user is typing in a value we don't want to rerender and loose cursor position. + if (this.attrName === 'value' && this._morph.element.value === value) { + return; + } if (this.lastValue !== null || value !== null) { this._morph.setContent(value); From 72fb390d5c591bcd2fa3c3a77e2fb2a73bd7408e Mon Sep 17 00:00:00 2001 From: Robert Jackson Date: Tue, 24 Feb 2015 22:47:49 -0500 Subject: [PATCH 2/2] [BUGFIX beta] Add test to confirm AttrNode does not loose cursor position. --- .../tests/helpers/input_test.js | 22 +++++++++++++++++++ .../ember-views/lib/attr_nodes/attr_node.js | 2 +- 2 files changed, 23 insertions(+), 1 deletion(-) diff --git a/packages/ember-htmlbars/tests/helpers/input_test.js b/packages/ember-htmlbars/tests/helpers/input_test.js index c2b520052ef..cd065e32501 100644 --- a/packages/ember-htmlbars/tests/helpers/input_test.js +++ b/packages/ember-htmlbars/tests/helpers/input_test.js @@ -81,6 +81,28 @@ QUnit.test("input tabindex is updated when setting tabindex property of view", f equal(view.$('input').attr('tabindex'), "3", "updates text field after tabindex changes"); }); +QUnit.test("cursor position is not lost when updating content", function() { + equal(view.$('input').val(), "hello", "precondition - renders text field with value"); + + var $input = view.$('input'); + var input = $input[0]; + + // set the cursor position to 3 (no selection) + run(function() { + input.value = 'derp'; + input.selectionStart = 3; + input.selectionEnd = 3; + }); + + run(null, set, controller, 'val', 'derp'); + + equal(view.$('input').val(), "derp", "updates text field after value changes"); + + equal(input.selectionStart, 3, 'cursor position was not lost'); + equal(input.selectionEnd, 3, 'cursor position was not lost'); +}); + + QUnit.module("{{input type='text'}} - static values", { setup: function() { controller = {}; diff --git a/packages/ember-views/lib/attr_nodes/attr_node.js b/packages/ember-views/lib/attr_nodes/attr_node.js index 17ba8b5d26c..db8cf381502 100644 --- a/packages/ember-views/lib/attr_nodes/attr_node.js +++ b/packages/ember-views/lib/attr_nodes/attr_node.js @@ -50,7 +50,7 @@ AttrNode.prototype.render = function render(buffer) { if (this.attrName === 'value' && (value === null || value === undefined)) { value = ''; } - + // If user is typing in a value we don't want to rerender and loose cursor position. if (this.attrName === 'value' && this._morph.element.value === value) { return;