From 0d4dddc44b8e4fce3c43303c8434e0279fcee359 Mon Sep 17 00:00:00 2001 From: Andrew Patton Date: Tue, 24 Oct 2017 16:18:51 -0700 Subject: [PATCH] Remove ReactInputSelection plugin --- packages/react-dom/src/client/ReactDOM.js | 5 - .../src/client/ReactInputSelection.js | 132 ------------------ .../react-dom/src/events/SelectEventPlugin.js | 19 ++- 3 files changed, 17 insertions(+), 139 deletions(-) delete mode 100644 packages/react-dom/src/client/ReactInputSelection.js diff --git a/packages/react-dom/src/client/ReactDOM.js b/packages/react-dom/src/client/ReactDOM.js index 384327b6b9f2c..ccde6220d77f8 100644 --- a/packages/react-dom/src/client/ReactDOM.js +++ b/packages/react-dom/src/client/ReactDOM.js @@ -22,7 +22,6 @@ var ReactDOMFiberComponent = require('ReactDOMFiberComponent'); var ReactDOMFrameScheduling = require('ReactDOMFrameScheduling'); var ReactGenericBatching = require('ReactGenericBatching'); var ReactFiberReconciler = require('react-reconciler'); -var ReactInputSelection = require('ReactInputSelection'); var ReactInstanceMap = require('ReactInstanceMap'); var ReactPortal = require('ReactPortal'); var ReactVersion = require('ReactVersion'); @@ -113,7 +112,6 @@ type HostContextProd = string; type HostContext = HostContextDev | HostContextProd; let eventsEnabled: ?boolean = null; -let selectionInformation: ?mixed = null; /** * True if the supplied DOM node is a valid node element. @@ -216,13 +214,10 @@ var DOMRenderer = ReactFiberReconciler({ prepareForCommit(): void { eventsEnabled = ReactBrowserEventEmitter.isEnabled(); - selectionInformation = ReactInputSelection.getSelectionInformation(); ReactBrowserEventEmitter.setEnabled(false); }, resetAfterCommit(): void { - ReactInputSelection.restoreSelection(selectionInformation); - selectionInformation = null; ReactBrowserEventEmitter.setEnabled(eventsEnabled); eventsEnabled = null; }, diff --git a/packages/react-dom/src/client/ReactInputSelection.js b/packages/react-dom/src/client/ReactInputSelection.js deleted file mode 100644 index 81f788aa5c8d6..0000000000000 --- a/packages/react-dom/src/client/ReactInputSelection.js +++ /dev/null @@ -1,132 +0,0 @@ -/** - * Copyright (c) 2013-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @providesModule ReactInputSelection - */ - -'use strict'; - -var ReactDOMSelection = require('ReactDOMSelection'); -var {ELEMENT_NODE} = require('HTMLNodeType'); - -var containsNode = require('fbjs/lib/containsNode'); -var focusNode = require('fbjs/lib/focusNode'); -var getActiveElement = require('fbjs/lib/getActiveElement'); - -function isInDocument(node) { - return containsNode(document.documentElement, node); -} - -/** - * @ReactInputSelection: React input selection module. Based on Selection.js, - * but modified to be suitable for react and has a couple of bug fixes (doesn't - * assume buttons have range selections allowed). - * Input selection module for React. - */ -var ReactInputSelection = { - hasSelectionCapabilities: function(elem) { - var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); - return ( - nodeName && - ((nodeName === 'input' && elem.type === 'text') || - nodeName === 'textarea' || - elem.contentEditable === 'true') - ); - }, - - getSelectionInformation: function() { - var focusedElem = getActiveElement(); - return { - focusedElem: focusedElem, - selectionRange: ReactInputSelection.hasSelectionCapabilities(focusedElem) - ? ReactInputSelection.getSelection(focusedElem) - : null, - }; - }, - - /** - * @restoreSelection: If any selection information was potentially lost, - * restore it. This is useful when performing operations that could remove dom - * nodes and place them back in, resulting in focus being lost. - */ - restoreSelection: function(priorSelectionInformation) { - var curFocusedElem = getActiveElement(); - var priorFocusedElem = priorSelectionInformation.focusedElem; - var priorSelectionRange = priorSelectionInformation.selectionRange; - if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) { - if (ReactInputSelection.hasSelectionCapabilities(priorFocusedElem)) { - ReactInputSelection.setSelection(priorFocusedElem, priorSelectionRange); - } - - // Focusing a node can change the scroll position, which is undesirable - const ancestors = []; - let ancestor = priorFocusedElem; - while ((ancestor = ancestor.parentNode)) { - if (ancestor.nodeType === ELEMENT_NODE) { - ancestors.push({ - element: ancestor, - left: ancestor.scrollLeft, - top: ancestor.scrollTop, - }); - } - } - - focusNode(priorFocusedElem); - - for (let i = 0; i < ancestors.length; i++) { - const info = ancestors[i]; - info.element.scrollLeft = info.left; - info.element.scrollTop = info.top; - } - } - }, - - /** - * @getSelection: Gets the selection bounds of a focused textarea, input or - * contentEditable node. - * -@input: Look up selection bounds of this input - * -@return {start: selectionStart, end: selectionEnd} - */ - getSelection: function(input) { - var selection; - - if ('selectionStart' in input) { - // Modern browser with input or textarea. - selection = { - start: input.selectionStart, - end: input.selectionEnd, - }; - } else { - // Content editable or old IE textarea. - selection = ReactDOMSelection.getOffsets(input); - } - - return selection || {start: 0, end: 0}; - }, - - /** - * @setSelection: Sets the selection bounds of a textarea or input and focuses - * the input. - * -@input Set selection bounds of this input or textarea - * -@offsets Object of same form that is returned from get* - */ - setSelection: function(input, offsets) { - var start = offsets.start; - var end = offsets.end; - if (end === undefined) { - end = start; - } - - if ('selectionStart' in input) { - input.selectionStart = start; - input.selectionEnd = Math.min(end, input.value.length); - } else { - ReactDOMSelection.setOffsets(input, offsets); - } - }, -}; - -module.exports = ReactInputSelection; diff --git a/packages/react-dom/src/events/SelectEventPlugin.js b/packages/react-dom/src/events/SelectEventPlugin.js index ffc2068c178f2..c434b3afc3bb7 100644 --- a/packages/react-dom/src/events/SelectEventPlugin.js +++ b/packages/react-dom/src/events/SelectEventPlugin.js @@ -13,7 +13,6 @@ var EventPropagators = require('EventPropagators'); var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment'); var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter'); var ReactDOMComponentTree = require('ReactDOMComponentTree'); -var ReactInputSelection = require('ReactInputSelection'); var SyntheticEvent = require('SyntheticEvent'); var {DOCUMENT_NODE} = require('HTMLNodeType'); @@ -55,6 +54,22 @@ var mouseDown = false; var isListeningToAllDependencies = ReactBrowserEventEmitter.isListeningToAllDependencies; +/** + * Determine if a node can have a selection associated with it. + * + * @param {DOMElement} node + * @return {boolean} True if the node can have a selection. + */ +function hasSelectionCapabilities(node) { + var nodeName = node && node.nodeName && node.nodeName.toLowerCase(); + return ( + nodeName && + ((nodeName === 'input' && node.type === 'text') || + nodeName === 'textarea' || + node.contentEditable === 'true') + ); +} + /** * Get an object which is a unique representation of the current selection. * @@ -67,7 +82,7 @@ var isListeningToAllDependencies = function getSelection(node) { if ( 'selectionStart' in node && - ReactInputSelection.hasSelectionCapabilities(node) + hasSelectionCapabilities(node) ) { return { start: node.selectionStart,