diff --git a/packages/react-dom/index.fb.js b/packages/react-dom/index.fb.js
index 2836f8a2ccb0a..b3cc7e93cceab 100644
--- a/packages/react-dom/index.fb.js
+++ b/packages/react-dom/index.fb.js
@@ -7,7 +7,7 @@
'use strict';
-var ReactDOMFB = require('./src/client/ReactDOMFB');
+const ReactDOMFB = require('./src/client/ReactDOMFB');
// TODO: decide on the top-level export form.
// This is hacky but makes it work with both Rollup and Jest.
diff --git a/packages/react-dom/index.js b/packages/react-dom/index.js
index 8abf2aae872d4..ea1696b86ffa1 100644
--- a/packages/react-dom/index.js
+++ b/packages/react-dom/index.js
@@ -9,7 +9,7 @@
'use strict';
-var ReactDOM = require('./src/client/ReactDOM');
+const ReactDOM = require('./src/client/ReactDOM');
// TODO: decide on the top-level export form.
// This is hacky but makes it work with both Rollup and Jest.
diff --git a/packages/react-dom/server.browser.js b/packages/react-dom/server.browser.js
index fb8e4f06b3d4d..666d671324b8d 100644
--- a/packages/react-dom/server.browser.js
+++ b/packages/react-dom/server.browser.js
@@ -9,7 +9,7 @@
'use strict';
-var ReactDOMServer = require('./src/server/ReactDOMServerBrowser');
+const ReactDOMServer = require('./src/server/ReactDOMServerBrowser');
// TODO: decide on the top-level export form.
// This is hacky but makes it work with both Rollup and Jest
diff --git a/packages/react-dom/server.node.js b/packages/react-dom/server.node.js
index 35e73a0d1918e..16587f4a0b02a 100644
--- a/packages/react-dom/server.node.js
+++ b/packages/react-dom/server.node.js
@@ -9,7 +9,7 @@
'use strict';
-var ReactDOMServer = require('./src/server/ReactDOMServerNode');
+const ReactDOMServer = require('./src/server/ReactDOMServerNode');
// TODO: decide on the top-level export form.
// This is hacky but makes it work with both Rollup and Jest
diff --git a/packages/react-dom/src/__tests__/ReactDOM-test.js b/packages/react-dom/src/__tests__/ReactDOM-test.js
index ffef8526cf577..15148fed5be61 100644
--- a/packages/react-dom/src/__tests__/ReactDOM-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOM-test.js
@@ -18,9 +18,9 @@ describe('ReactDOM', () => {
// supports real submit events.
/*
it('should bubble onSubmit', function() {
- var count = 0;
- var form;
- var Parent = React.createClass({
+ const count = 0;
+ const form;
+ const Parent = React.createClass({
handleSubmit: function() {
count++;
return false;
@@ -29,7 +29,7 @@ describe('ReactDOM', () => {
return ;
}
});
- var Child = React.createClass({
+ const Child = React.createClass({
render: function() {
return
;
},
@@ -37,7 +37,7 @@ describe('ReactDOM', () => {
form = ReactDOM.findDOMNode(this);
}
});
- var instance = ReactTestUtils.renderIntoDocument();
+ const instance = ReactTestUtils.renderIntoDocument();
form.submit();
expect(count).toEqual(1);
});
diff --git a/packages/react-dom/src/__tests__/ReactDOMInput-test.js b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
index 695bf89cbe795..fd21175e55250 100644
--- a/packages/react-dom/src/__tests__/ReactDOMInput-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
@@ -258,8 +258,8 @@ describe('ReactDOMInput', () => {
}
}
- var stub = ReactTestUtils.renderIntoDocument();
- var node = ReactDOM.findDOMNode(stub);
+ const stub = ReactTestUtils.renderIntoDocument();
+ const node = ReactDOM.findDOMNode(stub);
stub.setState({value: 0});
expect(node.value).toEqual('0');
@@ -628,36 +628,36 @@ describe('ReactDOMInput', () => {
});
it('should properly transition a text input from 0 to an empty 0.0', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
ReactDOM.render(, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('0.0');
expect(node.defaultValue).toBe('0.0');
});
it('should properly transition a number input from "" to 0', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
ReactDOM.render(, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('0');
expect(node.defaultValue).toBe('0');
});
it('should properly transition a number input from "" to "0"', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
ReactDOM.render(, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('0');
expect(node.defaultValue).toBe('0');
@@ -1644,12 +1644,12 @@ describe('ReactDOMInput', () => {
describe('When given a Symbol value', function() {
it('treats initial Symbol value as an empty string', function() {
spyOnDev(console, 'error');
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(
{}} />,
container,
);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1664,13 +1664,13 @@ describe('ReactDOMInput', () => {
it('treats updated Symbol value as an empty string', function() {
spyOnDev(console, 'error');
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render( {}} />, container);
ReactDOM.render(
{}} />,
container,
);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1684,9 +1684,9 @@ describe('ReactDOMInput', () => {
});
it('treats initial Symbol defaultValue as an empty string', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1694,10 +1694,10 @@ describe('ReactDOMInput', () => {
});
it('treats updated Symbol defaultValue as an empty string', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
ReactDOM.render(, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('foo');
expect(node.getAttribute('value')).toBe('');
@@ -1708,12 +1708,12 @@ describe('ReactDOMInput', () => {
describe('When given a function value', function() {
it('treats initial function value as an empty string', function() {
spyOnDev(console, 'error');
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(
{}} onChange={() => {}} />,
container,
);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1728,13 +1728,13 @@ describe('ReactDOMInput', () => {
it('treats updated function value as an empty string', function() {
spyOnDev(console, 'error');
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render( {}} />, container);
ReactDOM.render(
{}} onChange={() => {}} />,
container,
);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1748,9 +1748,9 @@ describe('ReactDOMInput', () => {
});
it('treats initial function defaultValue as an empty string', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render( {}} />, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('');
expect(node.getAttribute('value')).toBe('');
@@ -1758,10 +1758,10 @@ describe('ReactDOMInput', () => {
});
it('treats updated function defaultValue as an empty string', function() {
- var container = document.createElement('div');
+ const container = document.createElement('div');
ReactDOM.render(, container);
ReactDOM.render( {}} />, container);
- var node = container.firstChild;
+ const node = container.firstChild;
expect(node.value).toBe('foo');
expect(node.getAttribute('value')).toBe('');
diff --git a/packages/react-dom/src/client/DOMPropertyOperations.js b/packages/react-dom/src/client/DOMPropertyOperations.js
index b70c533d2d887..3affbec9086d9 100644
--- a/packages/react-dom/src/client/DOMPropertyOperations.js
+++ b/packages/react-dom/src/client/DOMPropertyOperations.js
@@ -17,11 +17,11 @@ import warning from 'fbjs/lib/warning';
// isAttributeNameSafe() is currently duplicated in DOMMarkupOperations.
// TODO: Find a better place for this.
-var VALID_ATTRIBUTE_NAME_REGEX = new RegExp(
+const VALID_ATTRIBUTE_NAME_REGEX = new RegExp(
'^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$',
);
-var illegalAttributeNameCache = {};
-var validatedAttributeNameCache = {};
+const illegalAttributeNameCache = {};
+const validatedAttributeNameCache = {};
function isAttributeNameSafe(attributeName) {
if (validatedAttributeNameCache.hasOwnProperty(attributeName)) {
return true;
@@ -71,18 +71,18 @@ export function setAttributeForRoot(node) {
*/
export function getValueForProperty(node, name, expected) {
if (__DEV__) {
- var propertyInfo = getPropertyInfo(name);
+ const propertyInfo = getPropertyInfo(name);
if (propertyInfo) {
if (propertyInfo.mustUseProperty) {
return node[propertyInfo.propertyName];
} else {
- var attributeName = propertyInfo.attributeName;
+ const attributeName = propertyInfo.attributeName;
- var stringValue = null;
+ let stringValue = null;
if (propertyInfo.hasOverloadedBooleanValue) {
if (node.hasAttribute(attributeName)) {
- var value = node.getAttribute(attributeName);
+ const value = node.getAttribute(attributeName);
if (value === '') {
return true;
}
@@ -137,7 +137,7 @@ export function getValueForAttribute(node, name, expected) {
if (!node.hasAttribute(name)) {
return expected === undefined ? undefined : null;
}
- var value = node.getAttribute(name);
+ const value = node.getAttribute(name);
if (value === '' + expected) {
return expected;
}
@@ -153,7 +153,7 @@ export function getValueForAttribute(node, name, expected) {
* @param {*} value
*/
export function setValueForProperty(node, name, value) {
- var propertyInfo = getPropertyInfo(name);
+ const propertyInfo = getPropertyInfo(name);
if (propertyInfo && shouldSetAttribute(name, value)) {
if (shouldIgnoreValue(propertyInfo, value)) {
@@ -164,8 +164,8 @@ export function setValueForProperty(node, name, value) {
// `toString`ed by IE8/9.
node[propertyInfo.propertyName] = value;
} else {
- var attributeName = propertyInfo.attributeName;
- var namespace = propertyInfo.attributeNamespace;
+ const attributeName = propertyInfo.attributeName;
+ const namespace = propertyInfo.attributeNamespace;
// `setAttribute` with objects becomes only `[object]` in IE8/9,
// ('' + value) makes it output the correct toString()-value.
if (namespace) {
@@ -217,10 +217,10 @@ export function deleteValueForAttribute(node, name) {
* @param {string} name
*/
export function deleteValueForProperty(node, name) {
- var propertyInfo = getPropertyInfo(name);
+ const propertyInfo = getPropertyInfo(name);
if (propertyInfo) {
if (propertyInfo.mustUseProperty) {
- var propName = propertyInfo.propertyName;
+ const propName = propertyInfo.propertyName;
if (propertyInfo.hasBooleanValue) {
node[propName] = false;
} else {
diff --git a/packages/react-dom/src/client/ReactDOM.js b/packages/react-dom/src/client/ReactDOM.js
index 3f1f71d6aebd2..b75cabe96ce54 100644
--- a/packages/react-dom/src/client/ReactDOM.js
+++ b/packages/react-dom/src/client/ReactDOM.js
@@ -72,8 +72,12 @@ const {
const {updatedAncestorInfo} = validateDOMNesting;
const {precacheFiberNode, updateFiberProps} = ReactDOMComponentTree;
+let SUPPRESS_HYDRATION_WARNING;
+let topLevelUpdateWarnings;
+let warnOnInvalidCallback;
+
if (__DEV__) {
- var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
+ SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
if (
typeof Map !== 'function' ||
Map.prototype == null ||
@@ -90,7 +94,7 @@ if (__DEV__) {
);
}
- var topLevelUpdateWarnings = (container: DOMContainer) => {
+ topLevelUpdateWarnings = (container: DOMContainer) => {
if (__DEV__) {
if (
container._reactRootContainer &&
@@ -137,7 +141,7 @@ if (__DEV__) {
}
};
- var warnOnInvalidCallback = function(callback: mixed, callerName: string) {
+ warnOnInvalidCallback = function(callback: mixed, callerName: string) {
warning(
callback === null || typeof callback === 'function',
'%s(...): Expected the last optional `callback` argument to be a ' +
diff --git a/packages/react-dom/src/client/ReactDOMFiberComponent.js b/packages/react-dom/src/client/ReactDOMFiberComponent.js
index 1ed31563d3395..5a647b88ace71 100644
--- a/packages/react-dom/src/client/ReactDOMFiberComponent.js
+++ b/packages/react-dom/src/client/ReactDOMFiberComponent.js
@@ -32,29 +32,41 @@ import {validateProperties as validateARIAProperties} from '../shared/ReactDOMIn
import {validateProperties as validateInputProperties} from '../shared/ReactDOMNullInputValuePropHook';
import {validateProperties as validateUnknownProperties} from '../shared/ReactDOMUnknownPropertyHook';
-var {
+const {
getCurrentFiberOwnerName,
getCurrentFiberStackAddendum,
} = ReactDebugCurrentFiber;
-var didWarnInvalidHydration = false;
-var didWarnShadyDOM = false;
+let didWarnInvalidHydration = false;
+let didWarnShadyDOM = false;
-var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';
-var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';
-var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
-var AUTOFOCUS = 'autoFocus';
-var CHILDREN = 'children';
-var STYLE = 'style';
-var HTML = '__html';
+const DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';
+const SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';
+const SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
+const AUTOFOCUS = 'autoFocus';
+const CHILDREN = 'children';
+const STYLE = 'style';
+const HTML = '__html';
-var {html: HTML_NAMESPACE} = Namespaces;
+const {html: HTML_NAMESPACE} = Namespaces;
-var getStack = emptyFunction.thatReturns('');
+let getStack = emptyFunction.thatReturns('');
+
+let warnedUnknownTags;
+let suppressHydrationWarning;
+
+let validatePropertiesInDevelopment;
+let warnForTextDifference;
+let warnForPropDifference;
+let warnForExtraAttributes;
+let warnForInvalidEventListener;
+
+let normalizeMarkupForTextOrAttribute;
+let normalizeHTML;
if (__DEV__) {
getStack = getCurrentFiberStackAddendum;
- var warnedUnknownTags = {
+ warnedUnknownTags = {
// Chrome is the only major browser not shipping