Stop ReactInputSelection breaking in IE8
In the IE code path the method assumed that the input.value property was non-null. A quick fix is to use either value or innerText; which means the same code can be shared for textarea and contentEditable components. The code is slightly buggy because the range.parentElement() !== input check will fail for contentEditable components when the focus within a deep DOM tree.
Josh Duck committed
Sep 14, 2013 at 05:59 UTC
ed7fa0ed225522009e5560dac08fcff356e2098f
1 file changed
+8
-4
src/core/ReactInputSelection.js
+8
-4
@@ -18,6 +18,8 @@
18
19
"use strict";
20
21
+var getTextContentAccessor = require('getTextContentAccessor');
22
+
23
// It is not safe to read the document.activeElement property in IE if there's
24
// nothing focused.
25
function getActiveElement() {
@@ -80,8 +82,9 @@ var ReactInputSelection = {
82
},
83
84
/**
83
- * @getSelection: Gets the selection bounds of a textarea or input.
84
- * -@input: Look up selection bounds of this input or textarea
85
+ * @getSelection: Gets the selection bounds of a focused textarea, input or
86
+ * contentEditable node.
87
+ * -@input: Look up selection bounds of this input
88
* -@return {start: selectionStart, end: selectionEnd}
89
*/
90
getSelection: function(input) {
@@ -114,7 +117,8 @@ var ReactInputSelection = {
117
return {start: 0, end: 0};
118
}
119
117
- var length = input.value.length;
120
+ var value = input.value || input[getTextContentAccessor()];
121
+ var length = value.length;
122
123
if (input.nodeName === 'INPUT') {
124
return {
@@ -129,7 +133,7 @@ var ReactInputSelection = {
133
range2.setEndPoint('StartToStart', range);
134
return {
135
start: length - range2.text.length,
132
- end: end
136
+ end: end
137
};
138
}
139
},