Use const/let in more places (#11467)
* Convert ReactDOM to const/let * Convert ReactDOMComponentTree to const/let * Convert ReactDOMComponentTree to const/let * Convert getNodeForCharacterOffset to const/let * Convert getTextContentAccessor to const/let * Convert inputValueTracking to const/let * Convert setInnerHTML to const/let * Convert setTextContent to const/let * Convert validateDOMNesting to const/let
Raphael Amorim committed
Nov 6, 2017 at 09:30 UTC
bb3c22c66f84e4a69ce99ccce2701db48a84df08
9 files changed
+59
-58
packages/react-dom/src/client/ReactDOM.js
+11
-10
@@ -49,7 +49,7 @@ import {
49
DOCUMENT_FRAGMENT_NODE,
50
} from '../shared/HTMLNodeType';
51
import {ROOT_ATTRIBUTE_NAME} from '../shared/DOMProperty';
52
-var {
52
+const {
53
createElement,
54
createTextNode,
55
setInitialProperties,
@@ -63,8 +63,8 @@ var {
63
warnForInsertedHydratedElement,
64
warnForInsertedHydratedText,
65
} = ReactDOMFiberComponent;
66
-var {updatedAncestorInfo} = validateDOMNesting;
67
-var {precacheFiberNode, updateFiberProps} = ReactDOMComponentTree;
66
+const {updatedAncestorInfo} = validateDOMNesting;
67
+const {precacheFiberNode, updateFiberProps} = ReactDOMComponentTree;
68
69
if (__DEV__) {
70
var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
@@ -163,7 +163,7 @@ function shouldAutoFocusHostComponent(type: string, props: Props): boolean {
163
return false;
164
}
165
166
-var DOMRenderer = ReactFiberReconciler({
166
+const DOMRenderer = ReactFiberReconciler({
167
getRootHostContext(rootContainerInstance: Container): HostContext {
168
let type;
169
let namespace;
@@ -343,7 +343,7 @@ var DOMRenderer = ReactFiberReconciler({
343
const hostContextDev = ((hostContext: any): HostContextDev);
344
validateDOMNesting(null, text, hostContextDev.ancestorInfo);
345
}
346
- var textNode: TextInstance = createTextNode(text, rootContainerInstance);
346
+ const textNode: TextInstance = createTextNode(text, rootContainerInstance);
347
precacheFiberNode(internalInstanceHandle, textNode);
348
return textNode;
349
},
@@ -640,7 +640,7 @@ ReactGenericBatching.injection.injectFiberBatchedUpdates(
640
DOMRenderer.batchedUpdates,
641
);
642
643
-var warnedAboutHydrateAPI = false;
643
+let warnedAboutHydrateAPI = false;
644
645
function renderSubtreeIntoContainer(
646
parentComponent: ?React$Component<any, any>,
@@ -785,16 +785,17 @@ ReactRoot.prototype.unmount = function(callback) {
785
DOMRenderer.updateContainer(null, root, null, callback);
786
};
787
788
-var ReactDOM: Object = {
788
+const ReactDOM: Object = {
789
createPortal,
790
791
findDOMNode(
792
componentOrElement: Element | ?React$Component<any, any>,
793
): null | Element | Text {
794
if (__DEV__) {
795
- var owner = (ReactCurrentOwner.current: any);
795
+ let owner = (ReactCurrentOwner.current: any);
796
if (owner !== null) {
797
- var warnedAboutRefsInRender = owner.stateNode._warnedAboutRefsInRender;
797
+ const warnedAboutRefsInRender =
798
+ owner.stateNode._warnedAboutRefsInRender;
799
warning(
800
warnedAboutRefsInRender,
801
'%s is accessing findDOMNode inside its render(). ' +
@@ -814,7 +815,7 @@ var ReactDOM: Object = {
815
return (componentOrElement: any);
816
}
817
817
- var inst = ReactInstanceMap.get(componentOrElement);
818
+ const inst = ReactInstanceMap.get(componentOrElement);
819
if (inst) {
820
return DOMRenderer.findHostInstance(inst);
821
}
packages/react-dom/src/client/ReactDOMComponentTree.js
+7
-7
@@ -8,9 +8,9 @@
8
import {HostComponent, HostText} from 'shared/ReactTypeOfWork';
9
import invariant from 'fbjs/lib/invariant';
10
11
-var randomKey = Math.random().toString(36).slice(2);
12
-var internalInstanceKey = '__reactInternalInstance$' + randomKey;
13
-var internalEventHandlersKey = '__reactEventHandlers$' + randomKey;
11
+const randomKey = Math.random().toString(36).slice(2);
12
+const internalInstanceKey = '__reactInternalInstance$' + randomKey;
13
+const internalEventHandlersKey = '__reactEventHandlers$' + randomKey;
14
15
export function precacheFiberNode(hostInst, node) {
16
node[internalInstanceKey] = hostInst;
@@ -26,7 +26,7 @@ export function getClosestInstanceFromNode(node) {
26
}
27
28
// Walk up the tree until we find an ancestor whose instance we have cached.
29
- var parents = [];
29
+ let parents = [];
30
while (!node[internalInstanceKey]) {
31
parents.push(node);
32
if (node.parentNode) {
@@ -38,8 +38,8 @@ export function getClosestInstanceFromNode(node) {
38
}
39
}
40
41
- var closest;
42
- var inst = node[internalInstanceKey];
41
+ let closest;
42
+ let inst = node[internalInstanceKey];
43
if (inst.tag === HostComponent || inst.tag === HostText) {
44
// In Fiber, this will always be the deepest root.
45
return inst;
@@ -56,7 +56,7 @@ export function getClosestInstanceFromNode(node) {
56
* instance, or null if the node was not rendered by this React.
57
*/
58
export function getInstanceFromNode(node) {
59
- var inst = node[internalInstanceKey];
59
+ const inst = node[internalInstanceKey];
60
if (inst) {
61
if (inst.tag === HostComponent || inst.tag === HostText) {
62
return inst;
packages/react-dom/src/client/ReactInputSelection.js
+7
-8
@@ -24,7 +24,7 @@ function isInDocument(node) {
24
*/
25
26
export function hasSelectionCapabilities(elem) {
27
- var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
27
+ const nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
28
return (
29
nodeName &&
30
((nodeName === 'input' && elem.type === 'text') ||
@@ -34,7 +34,7 @@ export function hasSelectionCapabilities(elem) {
34
}
35
36
export function getSelectionInformation() {
37
- var focusedElem = getActiveElement();
37
+ const focusedElem = getActiveElement();
38
return {
39
focusedElem: focusedElem,
40
selectionRange: hasSelectionCapabilities(focusedElem)
@@ -49,9 +49,9 @@ export function getSelectionInformation() {
49
* nodes and place them back in, resulting in focus being lost.
50
*/
51
export function restoreSelection(priorSelectionInformation) {
52
- var curFocusedElem = getActiveElement();
53
- var priorFocusedElem = priorSelectionInformation.focusedElem;
54
- var priorSelectionRange = priorSelectionInformation.selectionRange;
52
+ const curFocusedElem = getActiveElement();
53
+ const priorFocusedElem = priorSelectionInformation.focusedElem;
54
+ const priorSelectionRange = priorSelectionInformation.selectionRange;
55
if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) {
56
if (hasSelectionCapabilities(priorFocusedElem)) {
57
setSelection(priorFocusedElem, priorSelectionRange);
@@ -87,7 +87,7 @@ export function restoreSelection(priorSelectionInformation) {
87
* -@return {start: selectionStart, end: selectionEnd}
88
*/
89
export function getSelection(input) {
90
- var selection;
90
+ let selection;
91
92
if ('selectionStart' in input) {
93
// Modern browser with input or textarea.
@@ -110,8 +110,7 @@ export function getSelection(input) {
110
* -@offsets Object of same form that is returned from get*
111
*/
112
export function setSelection(input, offsets) {
113
- var start = offsets.start;
114
- var end = offsets.end;
113
+ let {start, end} = offsets;
114
if (end === undefined) {
115
end = start;
116
}
packages/react-dom/src/client/getNodeForCharacterOffset.js
+3
-3
@@ -44,9 +44,9 @@ function getSiblingNode(node) {
44
* @return {?object}
45
*/
46
function getNodeForCharacterOffset(root, offset) {
47
- var node = getLeafNode(root);
48
- var nodeStart = 0;
49
- var nodeEnd = 0;
47
+ let node = getLeafNode(root);
48
+ let nodeStart = 0;
49
+ let nodeEnd = 0;
50
51
while (node) {
52
if (node.nodeType === TEXT_NODE) {
packages/react-dom/src/client/getTextContentAccessor.js
+1
-1
@@ -7,7 +7,7 @@
7
8
import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';
9
10
-var contentKey = null;
10
+let contentKey = null;
11
12
/**
13
* Gets the key used to access text content on a DOM node.
packages/react-dom/src/client/inputValueTracking.js
+11
-11
@@ -16,8 +16,8 @@ type WrapperState = {_valueTracker: ?ValueTracker};
16
type ElementWithValueTracker = HTMLInputElement & WrapperState;
17
18
function isCheckable(elem: HTMLInputElement) {
19
- var type = elem.type;
20
- var nodeName = elem.nodeName;
19
+ const type = elem.type;
20
+ const nodeName = elem.nodeName;
21
return (
22
nodeName &&
23
nodeName.toLowerCase() === 'input' &&
@@ -34,7 +34,7 @@ function detachTracker(node: ElementWithValueTracker) {
34
}
35
36
function getValueFromNode(node: HTMLInputElement): string {
37
- var value = '';
37
+ let value = '';
38
if (!node) {
39
return value;
40
}
@@ -49,13 +49,13 @@ function getValueFromNode(node: HTMLInputElement): string {
49
}
50
51
function trackValueOnNode(node: any): ?ValueTracker {
52
- var valueField = isCheckable(node) ? 'checked' : 'value';
53
- var descriptor = Object.getOwnPropertyDescriptor(
52
+ const valueField = isCheckable(node) ? 'checked' : 'value';
53
+ const descriptor = Object.getOwnPropertyDescriptor(
54
node.constructor.prototype,
55
valueField,
56
);
57
58
- var currentValue = '' + node[valueField];
58
+ let currentValue = '' + node[valueField];
59
60
// if someone has already defined a value or Safari, then bail
61
// and don't track value will cause over reporting of changes,
@@ -81,7 +81,7 @@ function trackValueOnNode(node: any): ?ValueTracker {
81
},
82
});
83
84
- var tracker = {
84
+ const tracker = {
85
getValue() {
86
return currentValue;
87
},
@@ -115,15 +115,15 @@ export function updateValueIfChanged(node: ElementWithValueTracker) {
115
return false;
116
}
117
118
- var tracker = getTracker(node);
118
+ const tracker = getTracker(node);
119
// if there is no tracker at this point it's unlikely
120
// that trying again will succeed
121
if (!tracker) {
122
return true;
123
}
124
125
- var lastValue = tracker.getValue();
126
- var nextValue = getValueFromNode(node);
125
+ const lastValue = tracker.getValue();
126
+ const nextValue = getValueFromNode(node);
127
if (nextValue !== lastValue) {
128
tracker.setValue(nextValue);
129
return true;
@@ -132,7 +132,7 @@ export function updateValueIfChanged(node: ElementWithValueTracker) {
132
}
133
134
export function stopTracking(node: ElementWithValueTracker) {
135
- var tracker = getTracker(node);
135
+ const tracker = getTracker(node);
136
if (tracker) {
137
tracker.stopTracking();
138
}
packages/react-dom/src/client/setInnerHTML.js
+4
-3
@@ -10,7 +10,7 @@ import createMicrosoftUnsafeLocalFunction
10
from '../shared/createMicrosoftUnsafeLocalFunction';
11
12
// SVG temp container for IE lacking innerHTML
13
-var reusableSVGContainer;
13
+let reusableSVGContainer;
14
15
/**
16
* Set the innerHTML property of a node
@@ -19,15 +19,16 @@ var reusableSVGContainer;
19
* @param {string} html
20
* @internal
21
*/
22
-var setInnerHTML = createMicrosoftUnsafeLocalFunction(function(node, html) {
22
+const setInnerHTML = createMicrosoftUnsafeLocalFunction(function(node, html) {
23
// IE does not have innerHTML for SVG nodes, so instead we inject the
24
// new markup in a temp node and then move the child nodes across into
25
// the target node
26
+
27
if (node.namespaceURI === Namespaces.svg && !('innerHTML' in node)) {
28
reusableSVGContainer =
29
reusableSVGContainer || document.createElement('div');
30
reusableSVGContainer.innerHTML = '<svg>' + html + '</svg>';
30
- var svgNode = reusableSVGContainer.firstChild;
31
+ const svgNode = reusableSVGContainer.firstChild;
32
while (node.firstChild) {
33
node.removeChild(node.firstChild);
34
}
packages/react-dom/src/client/setTextContent.js
+1
-1
@@ -23,7 +23,7 @@ import {TEXT_NODE} from '../shared/HTMLNodeType';
23
*/
24
var setTextContent = function(node, text) {
25
if (text) {
26
- var firstChild = node.firstChild;
26
+ let firstChild = node.firstChild;
27
28
if (
29
firstChild &&
packages/react-dom/src/client/validateDOMNesting.js
+14
-14
@@ -11,7 +11,7 @@ import warning from 'fbjs/lib/warning';
11
import ReactDebugCurrentFiber
12
from 'react-reconciler/src/ReactDebugCurrentFiber';
13
14
-var {getCurrentFiberStackAddendum} = ReactDebugCurrentFiber;
14
+const {getCurrentFiberStackAddendum} = ReactDebugCurrentFiber;
15
var validateDOMNesting = emptyFunction;
16
17
if (__DEV__) {
@@ -406,8 +406,8 @@ if (__DEV__) {
406
407
validateDOMNesting = function(childTag, childText, ancestorInfo) {
408
ancestorInfo = ancestorInfo || emptyAncestorInfo;
409
- var parentInfo = ancestorInfo.current;
410
- var parentTag = parentInfo && parentInfo.tag;
409
+ const parentInfo = ancestorInfo.current;
410
+ const parentTag = parentInfo && parentInfo.tag;
411
412
if (childText != null) {
413
warning(
@@ -417,29 +417,29 @@ if (__DEV__) {
417
childTag = '#text';
418
}
419
420
- var invalidParent = isTagValidWithParent(childTag, parentTag)
420
+ const invalidParent = isTagValidWithParent(childTag, parentTag)
421
? null
422
: parentInfo;
423
- var invalidAncestor = invalidParent
423
+ const invalidAncestor = invalidParent
424
? null
425
: findInvalidAncestorForTag(childTag, ancestorInfo);
426
- var invalidParentOrAncestor = invalidParent || invalidAncestor;
426
+ const invalidParentOrAncestor = invalidParent || invalidAncestor;
427
if (!invalidParentOrAncestor) {
428
return;
429
}
430
431
- var ancestorTag = invalidParentOrAncestor.tag;
432
- var addendum = getCurrentFiberStackAddendum();
431
+ const ancestorTag = invalidParentOrAncestor.tag;
432
+ const addendum = getCurrentFiberStackAddendum();
433
434
- var warnKey =
434
+ const warnKey =
435
!!invalidParent + '|' + childTag + '|' + ancestorTag + '|' + addendum;
436
if (didWarn[warnKey]) {
437
return;
438
}
439
didWarn[warnKey] = true;
440
441
- var tagDisplayName = childTag;
442
- var whitespaceInfo = '';
441
+ let tagDisplayName = childTag;
442
+ let whitespaceInfo = '';
443
if (childTag === '#text') {
444
if (/\S/.test(childText)) {
445
tagDisplayName = 'Text nodes';
@@ -454,7 +454,7 @@ if (__DEV__) {
454
}
455
456
if (invalidParent) {
457
- var info = '';
457
+ let info = '';
458
if (ancestorTag === 'table' && childTag === 'tr') {
459
info +=
460
' Add a <tbody> to your code to match the DOM tree generated by ' +
@@ -487,8 +487,8 @@ if (__DEV__) {
487
// For testing
488
validateDOMNesting.isTagValidInContext = function(tag, ancestorInfo) {
489
ancestorInfo = ancestorInfo || emptyAncestorInfo;
490
- var parentInfo = ancestorInfo.current;
491
- var parentTag = parentInfo && parentInfo.tag;
490
+ const parentInfo = ancestorInfo.current;
491
+ const parentTag = parentInfo && parentInfo.tag;
492
return (
493
isTagValidWithParent(tag, parentTag) &&
494
!findInvalidAncestorForTag(tag, ancestorInfo)