Ensure selection range exists

The selection object doesn't always have ranges. In Chrome the selection is not updated before 'focus' event handlers are fired. See http://jsfiddle.net/t4DYA/ for example. The selection will have rangeCount of 0 and calling getRangeAt(0) will throw error "Uncaught IndexSizeError: Index or size was negative, or greater than the allowed value."

Josh Duck committed Sep 14, 2013 at 05:59 UTC 1a38cb9e07cc904f079ab7743aa893949994c7aa

1 file changed +11 -9

src/core/ReactInputSelection.js

+11 -9

@@ -87,16 +87,18 @@ var ReactInputSelection = {

87 getSelection: function(input) {

88 var range;

89 if (input.contentEditable === 'true' && window.getSelection) {

90 - range = window.getSelection().getRangeAt(0);

91 - var commonAncestor = range.commonAncestorContainer;

92 - if (commonAncestor && commonAncestor.nodeType === 3) {

93 - commonAncestor = commonAncestor.parentNode;

94 - }

95 - if (commonAncestor !== input) {

96 - return {start: 0, end: 0};

97 - } else {

98 - return {start: range.startOffset, end: range.endOffset};

90 + var selection = window.getSelection();

91 + if (selection.rangeCount > 0) {

92 + range = selection.getRangeAt(0);

93 + var commonAncestor = range.commonAncestorContainer;

94 + if (commonAncestor && commonAncestor.nodeType === 3) {

95 + commonAncestor = commonAncestor.parentNode;

96 + }

97 + if (commonAncestor === input) {

98 + return {start: range.startOffset, end: range.endOffset};

99 + }

100 }

101 + return {start: 0, end: 0};

102 }

103

104 if (!document.selection) {