Migrating to const/let and Object Spread in more places (#11535)
* Use const/let in more places (#11467) * Convert ReactDOMFiberTextarea to const/let * Convert ReactDOMSelection to const/let * Convert setTextContent to const/let * Convert validateDOMNesting to const/let * Replace Object.assign by Object Spread * Convert ReactDOMFiberOption to Object Spread * Convert ReactDOMFiberTextarea to Object Spread * Convert validateDOMNesting to Object Spread
Raphael Amorim committed
Nov 19, 2017 at 12:53 UTC
3f405da614694f333a0315d3c769d144872efe28
5 files changed
+42
-46
packages/react-dom/src/client/ReactDOMFiberOption.js
+3
-4
@@ -11,7 +11,7 @@ import React from 'react';
11
import warning from 'fbjs/lib/warning';
12
13
function flattenChildren(children) {
14
- var content = '';
14
+ let content = '';
15
16
// Flatten children and warn if they aren't strings or numbers;
17
// invalid types are ignored.
@@ -52,9 +52,8 @@ export function postMountWrapper(element: Element, props: Object) {
52
}
53
54
export function getHostProps(element: Element, props: Object) {
55
- var hostProps = Object.assign({children: undefined}, props);
56
-
57
- var content = flattenChildren(props.children);
55
+ const hostProps = {children: undefined, ...props};
56
+ const content = flattenChildren(props.children);
57
58
if (content) {
59
hostProps.children = content;
packages/react-dom/src/client/ReactDOMFiberTextarea.js
+16
-16
@@ -14,8 +14,8 @@ import ReactDebugCurrentFiber from 'react-reconciler/src/ReactDebugCurrentFiber'
14
15
import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
16
17
-var {getCurrentFiberStackAddendum} = ReactDebugCurrentFiber;
18
-var didWarnValDefaultVal = false;
17
+const {getCurrentFiberStackAddendum} = ReactDebugCurrentFiber;
18
+let didWarnValDefaultVal = false;
19
20
type TextAreaWithWrapperState = HTMLTextAreaElement & {
21
_wrapperState: {
@@ -40,7 +40,7 @@ type TextAreaWithWrapperState = HTMLTextAreaElement & {
40
*/
41
42
export function getHostProps(element: Element, props: Object) {
43
- var node = ((element: any): TextAreaWithWrapperState);
43
+ const node = ((element: any): TextAreaWithWrapperState);
44
invariant(
45
props.dangerouslySetInnerHTML == null,
46
'`dangerouslySetInnerHTML` does not make sense on <textarea>.',
@@ -52,17 +52,18 @@ export function getHostProps(element: Element, props: Object) {
52
// completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
53
// solution. The value can be a boolean or object so that's why it's forced
54
// to be a string.
55
- var hostProps = Object.assign({}, props, {
55
+ const hostProps = {
56
+ ...props,
57
value: undefined,
58
defaultValue: undefined,
59
children: '' + node._wrapperState.initialValue,
59
- });
60
+ };
61
62
return hostProps;
63
}
64
65
export function initWrapperState(element: Element, props: Object) {
65
- var node = ((element: any): TextAreaWithWrapperState);
66
+ const node = ((element: any): TextAreaWithWrapperState);
67
if (__DEV__) {
68
ReactControlledValuePropTypes.checkPropTypes(
69
'textarea',
@@ -86,14 +87,13 @@ export function initWrapperState(element: Element, props: Object) {
87
}
88
}
89
89
- var value = props.value;
90
- var initialValue = value;
90
+ let initialValue = props.value;
91
92
// Only bother fetching default value if we're going to use it
93
- if (value == null) {
94
- var defaultValue = props.defaultValue;
93
+ if (initialValue == null) {
94
+ let defaultValue = props.defaultValue;
95
// TODO (yungsters): Remove support for children content in <textarea>.
96
- var children = props.children;
96
+ let children = props.children;
97
if (children != null) {
98
if (__DEV__) {
99
warning(
@@ -128,12 +128,12 @@ export function initWrapperState(element: Element, props: Object) {
128
}
129
130
export function updateWrapper(element: Element, props: Object) {
131
- var node = ((element: any): TextAreaWithWrapperState);
132
- var value = props.value;
131
+ const node = ((element: any): TextAreaWithWrapperState);
132
+ const value = props.value;
133
if (value != null) {
134
// Cast `value` to a string to ensure the value is set correctly. While
135
// browsers typically do this as necessary, jsdom doesn't.
136
- var newValue = '' + value;
136
+ const newValue = '' + value;
137
138
// To avoid side effects (such as losing text selection), only set value if changed
139
if (newValue !== node.value) {
@@ -149,10 +149,10 @@ export function updateWrapper(element: Element, props: Object) {
149
}
150
151
export function postMountWrapper(element: Element, props: Object) {
152
- var node = ((element: any): TextAreaWithWrapperState);
152
+ const node = ((element: any): TextAreaWithWrapperState);
153
// This is in postMount because we need access to the DOM node, which is not
154
// available until after the component has mounted.
155
- var textContent = node.textContent;
155
+ const textContent = node.textContent;
156
157
// Only set node.value if textContent is equal to the expected
158
// initial value. In IE10/IE11 there is a bug where the placeholder attribute
packages/react-dom/src/client/ReactDOMSelection.js
+10
-13
@@ -14,16 +14,13 @@ import {TEXT_NODE} from '../shared/HTMLNodeType';
14
* @return {?object}
15
*/
16
export function getOffsets(outerNode) {
17
- var selection = window.getSelection && window.getSelection();
17
+ const selection = window.getSelection && window.getSelection();
18
19
if (!selection || selection.rangeCount === 0) {
20
return null;
21
}
22
23
- var anchorNode = selection.anchorNode;
24
- var anchorOffset = selection.anchorOffset;
25
- var focusNode = selection.focusNode;
26
- var focusOffset = selection.focusOffset;
23
+ const {anchorNode, anchorOffset, focusNode, focusOffset} = selection;
24
25
// In Firefox, anchorNode and focusNode can be "anonymous divs", e.g. the
26
// up/down buttons on an <input type="number">. Anonymous divs do not seem to
@@ -157,21 +154,21 @@ export function setOffsets(node, offsets) {
154
return;
155
}
156
160
- var selection = window.getSelection();
161
- var length = node[getTextContentAccessor()].length;
162
- var start = Math.min(offsets.start, length);
163
- var end = offsets.end === undefined ? start : Math.min(offsets.end, length);
157
+ const selection = window.getSelection();
158
+ const length = node[getTextContentAccessor()].length;
159
+ let start = Math.min(offsets.start, length);
160
+ let end = offsets.end === undefined ? start : Math.min(offsets.end, length);
161
162
// IE 11 uses modern selection, but doesn't support the extend method.
163
// Flip backward selections, so we can set with a single range.
164
if (!selection.extend && start > end) {
168
- var temp = end;
165
+ let temp = end;
166
end = start;
167
start = temp;
168
}
169
173
- var startMarker = getNodeForCharacterOffset(node, start);
174
- var endMarker = getNodeForCharacterOffset(node, end);
170
+ const startMarker = getNodeForCharacterOffset(node, start);
171
+ const endMarker = getNodeForCharacterOffset(node, end);
172
173
if (startMarker && endMarker) {
174
if (
@@ -183,7 +180,7 @@ export function setOffsets(node, offsets) {
180
) {
181
return;
182
}
186
- var range = document.createRange();
183
+ const range = document.createRange();
184
range.setStart(startMarker.node, startMarker.offset);
185
selection.removeAllRanges();
186
packages/react-dom/src/client/setTextContent.js
+1
-1
@@ -21,7 +21,7 @@ import {TEXT_NODE} from '../shared/HTMLNodeType';
21
* @param {string} text
22
* @internal
23
*/
24
-var setTextContent = function(node, text) {
24
+let setTextContent = function(node, text) {
25
if (text) {
26
let firstChild = node.firstChild;
27
packages/react-dom/src/client/validateDOMNesting.js
+12
-12
@@ -11,7 +11,7 @@ import warning from 'fbjs/lib/warning';
11
import ReactDebugCurrentFiber from 'react-reconciler/src/ReactDebugCurrentFiber';
12
13
const {getCurrentFiberStackAddendum} = ReactDebugCurrentFiber;
14
-var validateDOMNesting = emptyFunction;
14
+let validateDOMNesting = emptyFunction;
15
16
if (__DEV__) {
17
// This validation code was written based on the HTML5 parsing spec:
@@ -26,7 +26,7 @@ if (__DEV__) {
26
// first, causing a confusing mess.
27
28
// https://html.spec.whatwg.org/multipage/syntax.html#special
29
- var specialTags = [
29
+ const specialTags = [
30
'address',
31
'applet',
32
'area',
@@ -113,7 +113,7 @@ if (__DEV__) {
113
];
114
115
// https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope
116
- var inScopeTags = [
116
+ const inScopeTags = [
117
'applet',
118
'caption',
119
'html',
@@ -133,10 +133,10 @@ if (__DEV__) {
133
];
134
135
// https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-button-scope
136
- var buttonScopeTags = inScopeTags.concat(['button']);
136
+ const buttonScopeTags = inScopeTags.concat(['button']);
137
138
// https://html.spec.whatwg.org/multipage/syntax.html#generate-implied-end-tags
139
- var impliedEndTags = [
139
+ const impliedEndTags = [
140
'dd',
141
'dt',
142
'li',
@@ -147,7 +147,7 @@ if (__DEV__) {
147
'rt',
148
];
149
150
- var emptyAncestorInfo = {
150
+ const emptyAncestorInfo = {
151
current: null,
152
153
formTag: null,
@@ -160,9 +160,9 @@ if (__DEV__) {
160
dlItemTagAutoclosing: null,
161
};
162
163
- var updatedAncestorInfo = function(oldInfo, tag, instance) {
164
- var ancestorInfo = Object.assign({}, oldInfo || emptyAncestorInfo);
165
- var info = {tag: tag, instance: instance};
163
+ const updatedAncestorInfo = function(oldInfo, tag, instance) {
164
+ let ancestorInfo = {...(oldInfo || emptyAncestorInfo)};
165
+ let info = {tag: tag, instance: instance};
166
167
if (inScopeTags.indexOf(tag) !== -1) {
168
ancestorInfo.aTagInScope = null;
@@ -215,7 +215,7 @@ if (__DEV__) {
215
/**
216
* Returns whether
217
*/
218
- var isTagValidWithParent = function(tag, parentTag) {
218
+ const isTagValidWithParent = function(tag, parentTag) {
219
// First, let's check if we're in an unusual parsing mode...
220
switch (parentTag) {
221
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inselect
@@ -337,7 +337,7 @@ if (__DEV__) {
337
/**
338
* Returns whether
339
*/
340
- var findInvalidAncestorForTag = function(tag, ancestorInfo) {
340
+ const findInvalidAncestorForTag = function(tag, ancestorInfo) {
341
switch (tag) {
342
case 'address':
343
case 'article':
@@ -401,7 +401,7 @@ if (__DEV__) {
401
return null;
402
};
403
404
- var didWarn = {};
404
+ const didWarn = {};
405
406
validateDOMNesting = function(childTag, childText, ancestorInfo) {
407
ancestorInfo = ancestorInfo || emptyAncestorInfo;