From 5bd2321ae3dd7d68ac02dee3c3f271e9d0ee8784 Mon Sep 17 00:00:00 2001
From: Raphael Amorim <rapha850@gmail.com>
Date: Tue, 5 Dec 2017 23:39:48 -0200
Subject: [PATCH] Remove vars (#11780)

* react-dom: convert packages/react-dom/src/client

* react-dom: convert packages/react-dom/src/events

* react-dom: convert packages/react-dom/src/test-utils

* react-dom: convert files on root

* react-dom: convert updated ReactDOM-test.js
---
 packages/react-dom/index.fb.js                |   2 +-
 packages/react-dom/index.js                   |   2 +-
 packages/react-dom/server.browser.js          |   2 +-
 packages/react-dom/server.node.js             |   2 +-
 .../react-dom/src/__tests__/ReactDOM-test.js  |  10 +-
 .../src/__tests__/ReactDOMInput-test.js       |  48 +++---
 .../src/client/DOMPropertyOperations.js       |  26 +--
 packages/react-dom/src/client/ReactDOM.js     |  10 +-
 .../src/client/ReactDOMFiberComponent.js      | 154 ++++++++++--------
 .../src/client/ReactDOMFiberInput.js          |  50 +++---
 .../src/client/ReactDOMFiberSelect.js         |  38 +++--
 .../getNodeForCharacterOffset-test.js         |  15 +-
 .../src/events/BeforeInputEventPlugin.js      |  46 +++---
 .../src/events/BrowserEventConstants.js       |   4 +-
 .../react-dom/src/events/ChangeEventPlugin.js |  26 +--
 .../src/events/DOMEventPluginOrder.js         |   2 +-
 .../src/events/EnterLeaveEventPlugin.js       |  22 +--
 .../src/events/FallbackCompositionState.js    |  18 +-
 .../src/events/ReactBrowserEventEmitter.js    |  26 +--
 .../src/events/ReactDOMEventListener.js       |  18 +-
 .../react-dom/src/events/SelectEventPlugin.js |  24 +--
 .../react-dom/src/events/SimpleEventPlugin.js |  24 +--
 .../src/events/SyntheticAnimationEvent.js     |   2 +-
 .../src/events/SyntheticClipboardEvent.js     |   2 +-
 .../src/events/SyntheticCompositionEvent.js   |   2 +-
 .../src/events/SyntheticDragEvent.js          |   2 +-
 .../src/events/SyntheticFocusEvent.js         |   2 +-
 .../src/events/SyntheticInputEvent.js         |   2 +-
 .../src/events/SyntheticKeyboardEvent.js      |   2 +-
 .../src/events/SyntheticMouseEvent.js         |   2 +-
 .../src/events/SyntheticTouchEvent.js         |   2 +-
 .../src/events/SyntheticTransitionEvent.js    |   2 +-
 .../react-dom/src/events/SyntheticUIEvent.js  |   2 +-
 .../src/events/SyntheticWheelEvent.js         |   2 +-
 .../react-dom/src/events/TapEventPlugin.js    |  30 ++--
 .../BeforeInputEventPlugin-test.internal.js   |  28 ++--
 .../__tests__/ChangeEventPlugin-test.js       |  75 ++++-----
 .../__tests__/EnterLeaveEventPlugin-test.js   |   6 +-
 .../FallbackCompositionState-test.js          |  14 +-
 .../__tests__/SelectEventPlugin-test.js       |  20 +--
 .../__tests__/SimpleEventPlugin-test.js       |  54 +++---
 .../__tests__/SyntheticClipboardEvent-test.js |  38 ++---
 .../events/__tests__/SyntheticEvent-test.js   | 106 ++++++------
 .../__tests__/SyntheticWheelEvent-test.js     |  24 +--
 .../src/events/__tests__/getEventKey-test.js  |  18 +-
 .../react-dom/src/events/getEventCharCode.js  |   4 +-
 packages/react-dom/src/events/getEventKey.js  |   8 +-
 .../src/events/getEventModifierState.js       |   8 +-
 .../react-dom/src/events/getEventTarget.js    |   2 +-
 .../src/events/getVendorPrefixedEventName.js  |  12 +-
 .../react-dom/src/events/isEventSupported.js  |   8 +-
 .../src/test-utils/ReactTestUtils.js          |  49 +++---
 packages/react-dom/test-utils.js              |   2 +-
 53 files changed, 563 insertions(+), 536 deletions(-)

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 <Child />;
       }
     });
-    var Child = React.createClass({
+    const Child = React.createClass({
       render: function() {
         return <form><input type="submit" value="Submit" /></form>;
       },
@@ -37,7 +37,7 @@ describe('ReactDOM', () => {
         form = ReactDOM.findDOMNode(this);
       }
     });
-    var instance = ReactTestUtils.renderIntoDocument(<Parent />);
+    const instance = ReactTestUtils.renderIntoDocument(<Parent />);
     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(<Stub />);
-    var node = ReactDOM.findDOMNode(stub);
+    const stub = ReactTestUtils.renderIntoDocument(<Stub />);
+    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(<input type="text" value={0} />, container);
     ReactDOM.render(<input type="text" value="0.0" />, 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(<input type="number" value="" />, container);
     ReactDOM.render(<input type="number" value={0} />, 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(<input type="number" value="" />, container);
     ReactDOM.render(<input type="number" value="0" />, 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(
         <input value={Symbol('foobar')} onChange={() => {}} />,
         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(<input value="foo" onChange={() => {}} />, container);
       ReactDOM.render(
         <input value={Symbol('foobar')} onChange={() => {}} />,
         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(<input defaultValue={Symbol('foobar')} />, 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(<input defaultValue="foo" />, container);
       ReactDOM.render(<input defaultValue={Symbol('foobar')} />, 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(
         <input value={() => {}} 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(<input value="foo" onChange={() => {}} />, container);
       ReactDOM.render(
         <input value={() => {}} 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(<input defaultValue={() => {}} />, 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(<input defaultValue="foo" />, container);
       ReactDOM.render(<input defaultValue={() => {}} />, 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 <time>. But as of July
     // 2017 it intends to ship it due to widespread usage. We intentionally
     // *don't* warn for <time> even if it's unrecognized by Chrome because
@@ -64,7 +76,7 @@ if (__DEV__) {
     dialog: true,
   };
 
-  var validatePropertiesInDevelopment = function(type, props) {
+  validatePropertiesInDevelopment = function(type, props) {
     validateARIAProperties(type, props);
     validateInputProperties(type, props);
     validateUnknownProperties(type, props, /* canUseEventSystem */ true);
@@ -75,10 +87,10 @@ if (__DEV__) {
   // https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream
   // If we have a mismatch, it might be caused by that.
   // We will still patch up in this case but not fire the warning.
-  var NORMALIZE_NEWLINES_REGEX = /\r\n?/g;
-  var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;
+  const NORMALIZE_NEWLINES_REGEX = /\r\n?/g;
+  const NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;
 
-  var normalizeMarkupForTextOrAttribute = function(markup: mixed): string {
+  normalizeMarkupForTextOrAttribute = function(markup: mixed): string {
     const markupString =
       typeof markup === 'string' ? markup : '' + (markup: any);
     return markupString
@@ -86,7 +98,7 @@ if (__DEV__) {
       .replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, '');
   };
 
-  var warnForTextDifference = function(
+  warnForTextDifference = function(
     serverText: string,
     clientText: string | number,
   ) {
@@ -107,7 +119,7 @@ if (__DEV__) {
     );
   };
 
-  var warnForPropDifference = function(
+  warnForPropDifference = function(
     propName: string,
     serverValue: mixed,
     clientValue: mixed,
@@ -134,19 +146,19 @@ if (__DEV__) {
     );
   };
 
-  var warnForExtraAttributes = function(attributeNames: Set<string>) {
+  warnForExtraAttributes = function(attributeNames: Set<string>) {
     if (didWarnInvalidHydration) {
       return;
     }
     didWarnInvalidHydration = true;
-    var names = [];
+    const names = [];
     attributeNames.forEach(function(name) {
       names.push(name);
     });
     warning(false, 'Extra attributes from the server: %s', names);
   };
 
-  var warnForInvalidEventListener = function(registrationName, listener) {
+  warnForInvalidEventListener = function(registrationName, listener) {
     if (listener === false) {
       warning(
         false,
@@ -171,12 +183,12 @@ if (__DEV__) {
 
   // Parse the HTML and read it back to normalize the HTML string so that it
   // can be used for comparison.
-  var normalizeHTML = function(parent: Element, html: string) {
+  normalizeHTML = function(parent: Element, html: string) {
     // We could have created a separate document here to avoid
     // re-initializing custom elements if they exist. But this breaks
     // how <noscript> is being handled. So we use the same document.
     // See the discussion in https://github.com/facebook/react/pull/11157.
-    var testElement =
+    const testElement =
       parent.namespaceURI === HTML_NAMESPACE
         ? parent.ownerDocument.createElement(parent.tagName)
         : parent.ownerDocument.createElementNS(
@@ -189,10 +201,10 @@ if (__DEV__) {
 }
 
 function ensureListeningTo(rootContainerElement, registrationName) {
-  var isDocumentOrFragment =
+  const isDocumentOrFragment =
     rootContainerElement.nodeType === DOCUMENT_NODE ||
     rootContainerElement.nodeType === DOCUMENT_FRAGMENT_NODE;
-  var doc = isDocumentOrFragment
+  const doc = isDocumentOrFragment
     ? rootContainerElement
     : rootContainerElement.ownerDocument;
   listenTo(registrationName, doc);
@@ -208,7 +220,7 @@ function getOwnerDocumentFromRootContainer(
 
 // There are so many media events, it makes sense to just
 // maintain a list rather than create a `trapBubbledEvent` for each
-var mediaEvents = {
+const mediaEvents = {
   topAbort: 'abort',
   topCanPlay: 'canplay',
   topCanPlayThrough: 'canplaythrough',
@@ -254,11 +266,11 @@ function setInitialDOMProperties(
   nextProps: Object,
   isCustomComponentTag: boolean,
 ): void {
-  for (var propKey in nextProps) {
+  for (const propKey in nextProps) {
     if (!nextProps.hasOwnProperty(propKey)) {
       continue;
     }
-    var nextProp = nextProps[propKey];
+    const nextProp = nextProps[propKey];
     if (propKey === STYLE) {
       if (__DEV__) {
         if (nextProp) {
@@ -270,7 +282,7 @@ function setInitialDOMProperties(
       // Relies on `updateStylesByID` not mutating `styleUpdates`.
       CSSPropertyOperations.setValueForStyles(domElement, nextProp, getStack);
     } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
-      var nextHtml = nextProp ? nextProp[HTML] : undefined;
+      const nextHtml = nextProp ? nextProp[HTML] : undefined;
       if (nextHtml != null) {
         setInnerHTML(domElement, nextHtml);
       }
@@ -280,7 +292,7 @@ function setInitialDOMProperties(
         // textContent on a <textarea> will cause the placeholder to not
         // show within the <textarea> until it has been focused and blurred again.
         // https://github.com/facebook/react/issues/6731#issuecomment-254874553
-        var canSetTextContent = tag !== 'textarea' || nextProp !== '';
+        const canSetTextContent = tag !== 'textarea' || nextProp !== '';
         if (canSetTextContent) {
           setTextContent(domElement, nextProp);
         }
@@ -320,9 +332,9 @@ function updateDOMProperties(
   isCustomComponentTag: boolean,
 ): void {
   // TODO: Handle wasCustomComponentTag
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i];
-    var propValue = updatePayload[i + 1];
+  for (let i = 0; i < updatePayload.length; i += 2) {
+    const propKey = updatePayload[i];
+    const propValue = updatePayload[i + 1];
     if (propKey === STYLE) {
       CSSPropertyOperations.setValueForStyles(domElement, propValue, getStack);
     } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
@@ -356,19 +368,21 @@ export function createElement(
   rootContainerElement: Element | Document,
   parentNamespace: string,
 ): Element {
+  let isCustomComponentTag;
+
   // We create tags in the namespace of their parent container, except HTML
   // tags get no namespace.
-  var ownerDocument: Document = getOwnerDocumentFromRootContainer(
+  const ownerDocument: Document = getOwnerDocumentFromRootContainer(
     rootContainerElement,
   );
-  var domElement: Element;
-  var namespaceURI = parentNamespace;
+  let domElement: Element;
+  let namespaceURI = parentNamespace;
   if (namespaceURI === HTML_NAMESPACE) {
     namespaceURI = getIntrinsicNamespace(type);
   }
   if (namespaceURI === HTML_NAMESPACE) {
     if (__DEV__) {
-      var isCustomComponentTag = isCustomComponent(type, props);
+      isCustomComponentTag = isCustomComponent(type, props);
       // Should this check be gated by parent namespace? Not sure we want to
       // allow <SVG> or <mATH>.
       warning(
@@ -382,10 +396,10 @@ export function createElement(
     if (type === 'script') {
       // Create the script via .innerHTML so its "parser-inserted" flag is
       // set to true and it does not execute
-      var div = ownerDocument.createElement('div');
+      const div = ownerDocument.createElement('div');
       div.innerHTML = '<script><' + '/script>'; // eslint-disable-line
       // This is guaranteed to yield a script element.
-      var firstChild = ((div.firstChild: any): HTMLScriptElement);
+      const firstChild = ((div.firstChild: any): HTMLScriptElement);
       domElement = div.removeChild(firstChild);
     } else if (typeof props.is === 'string') {
       // $FlowIssue `createElement` should be updated for Web Components
@@ -438,7 +452,7 @@ export function setInitialProperties(
   rawProps: Object,
   rootContainerElement: Element | Document,
 ): void {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+  const isCustomComponentTag = isCustomComponent(tag, rawProps);
   if (__DEV__) {
     validatePropertiesInDevelopment(tag, rawProps);
     if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) {
@@ -453,7 +467,7 @@ export function setInitialProperties(
   }
 
   // TODO: Make sure that we check isMounted before firing any of these events.
-  var props: Object;
+  let props: Object;
   switch (tag) {
     case 'iframe':
     case 'object':
@@ -463,7 +477,7 @@ export function setInitialProperties(
     case 'video':
     case 'audio':
       // Create listener for each media event
-      for (var event in mediaEvents) {
+      for (const event in mediaEvents) {
         if (mediaEvents.hasOwnProperty(event)) {
           trapBubbledEvent(event, mediaEvents[event], domElement);
         }
@@ -571,10 +585,10 @@ export function diffProperties(
     validatePropertiesInDevelopment(tag, nextRawProps);
   }
 
-  var updatePayload: null | Array<any> = null;
+  let updatePayload: null | Array<any> = null;
 
-  var lastProps: Object;
-  var nextProps: Object;
+  let lastProps: Object;
+  let nextProps: Object;
   switch (tag) {
     case 'input':
       lastProps = ReactDOMFiberInput.getHostProps(domElement, lastRawProps);
@@ -611,9 +625,9 @@ export function diffProperties(
 
   assertValidProps(tag, nextProps, getStack);
 
-  var propKey;
-  var styleName;
-  var styleUpdates = null;
+  let propKey;
+  let styleName;
+  let styleUpdates = null;
   for (propKey in lastProps) {
     if (
       nextProps.hasOwnProperty(propKey) ||
@@ -623,7 +637,7 @@ export function diffProperties(
       continue;
     }
     if (propKey === STYLE) {
-      var lastStyle = lastProps[propKey];
+      const lastStyle = lastProps[propKey];
       for (styleName in lastStyle) {
         if (lastStyle.hasOwnProperty(styleName)) {
           if (!styleUpdates) {
@@ -655,8 +669,8 @@ export function diffProperties(
     }
   }
   for (propKey in nextProps) {
-    var nextProp = nextProps[propKey];
-    var lastProp = lastProps != null ? lastProps[propKey] : undefined;
+    const nextProp = nextProps[propKey];
+    const lastProp = lastProps != null ? lastProps[propKey] : undefined;
     if (
       !nextProps.hasOwnProperty(propKey) ||
       nextProp === lastProp ||
@@ -708,8 +722,8 @@ export function diffProperties(
         styleUpdates = nextProp;
       }
     } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
-      var nextHtml = nextProp ? nextProp[HTML] : undefined;
-      var lastHtml = lastProp ? lastProp[HTML] : undefined;
+      const nextHtml = nextProp ? nextProp[HTML] : undefined;
+      const lastHtml = lastProp ? lastProp[HTML] : undefined;
       if (nextHtml != null) {
         if (lastHtml !== nextHtml) {
           (updatePayload = updatePayload || []).push(propKey, '' + nextHtml);
@@ -775,8 +789,8 @@ export function updateProperties(
     ReactDOMFiberInput.updateChecked(domElement, nextRawProps);
   }
 
-  var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
-  var isCustomComponentTag = isCustomComponent(tag, nextRawProps);
+  const wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
+  const isCustomComponentTag = isCustomComponent(tag, nextRawProps);
   // Apply the diff.
   updateDOMProperties(
     domElement,
@@ -812,10 +826,12 @@ export function diffHydratedProperties(
   parentNamespace: string,
   rootContainerElement: Element | Document,
 ): null | Array<mixed> {
+  let isCustomComponentTag;
+  let extraAttributeNames: Set<string>;
+
   if (__DEV__) {
-    var suppressHydrationWarning =
-      rawProps[SUPPRESS_HYDRATION_WARNING] === true;
-    var isCustomComponentTag = isCustomComponent(tag, rawProps);
+    suppressHydrationWarning = rawProps[SUPPRESS_HYDRATION_WARNING] === true;
+    isCustomComponentTag = isCustomComponent(tag, rawProps);
     validatePropertiesInDevelopment(tag, rawProps);
     if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) {
       warning(
@@ -837,7 +853,7 @@ export function diffHydratedProperties(
     case 'video':
     case 'audio':
       // Create listener for each media event
-      for (var event in mediaEvents) {
+      for (const event in mediaEvents) {
         if (mediaEvents.hasOwnProperty(event)) {
           trapBubbledEvent(event, mediaEvents[event], domElement);
         }
@@ -887,10 +903,10 @@ export function diffHydratedProperties(
   assertValidProps(tag, rawProps, getStack);
 
   if (__DEV__) {
-    var extraAttributeNames: Set<string> = new Set();
-    var attributes = domElement.attributes;
-    for (var i = 0; i < attributes.length; i++) {
-      var name = attributes[i].name.toLowerCase();
+    extraAttributeNames = new Set();
+    const attributes = domElement.attributes;
+    for (let i = 0; i < attributes.length; i++) {
+      const name = attributes[i].name.toLowerCase();
       switch (name) {
         // Built-in SSR attribute is whitelisted
         case 'data-reactroot':
@@ -911,12 +927,12 @@ export function diffHydratedProperties(
     }
   }
 
-  var updatePayload = null;
-  for (var propKey in rawProps) {
+  let updatePayload = null;
+  for (const propKey in rawProps) {
     if (!rawProps.hasOwnProperty(propKey)) {
       continue;
     }
-    var nextProp = rawProps[propKey];
+    const nextProp = rawProps[propKey];
     if (propKey === CHILDREN) {
       // For text content children we compare against textContent. This
       // might match additional HTML that is hidden when we read it using
@@ -951,8 +967,8 @@ export function diffHydratedProperties(
       }
     } else if (__DEV__) {
       // Validate that the properties correspond to their expected values.
-      var serverValue;
-      var propertyInfo;
+      let serverValue;
+      let propertyInfo;
       if (suppressHydrationWarning) {
         // Don't bother comparing. We're ignoring all these warnings.
       } else if (
diff --git a/packages/react-dom/src/client/ReactDOMFiberInput.js b/packages/react-dom/src/client/ReactDOMFiberInput.js
index b82a4dcb0e7ac..b9cb9673345d7 100644
--- a/packages/react-dom/src/client/ReactDOMFiberInput.js
+++ b/packages/react-dom/src/client/ReactDOMFiberInput.js
@@ -25,17 +25,17 @@ type InputWithWrapperState = HTMLInputElement & {
   },
 };
 
-var {
+const {
   getCurrentFiberOwnerName,
   getCurrentFiberStackAddendum,
 } = ReactDebugCurrentFiber;
-var didWarnValueDefaultValue = false;
-var didWarnCheckedDefaultChecked = false;
-var didWarnControlledToUncontrolled = false;
-var didWarnUncontrolledToControlled = false;
+let didWarnValueDefaultValue = false;
+let didWarnCheckedDefaultChecked = false;
+let didWarnControlledToUncontrolled = false;
+let didWarnUncontrolledToControlled = false;
 
 function isControlled(props) {
-  var usesChecked = props.type === 'checkbox' || props.type === 'radio';
+  const usesChecked = props.type === 'checkbox' || props.type === 'radio';
   return usesChecked ? props.checked != null : props.value != null;
 }
 
@@ -57,10 +57,10 @@ function isControlled(props) {
  */
 
 export function getHostProps(element: Element, props: Object) {
-  var node = ((element: any): InputWithWrapperState);
-  var checked = props.checked;
+  const node = ((element: any): InputWithWrapperState);
+  const checked = props.checked;
 
-  var hostProps = Object.assign({}, props, {
+  const hostProps = Object.assign({}, props, {
     defaultChecked: undefined,
     defaultValue: undefined,
     value: undefined,
@@ -116,8 +116,8 @@ export function initWrapperState(element: Element, props: Object) {
     }
   }
 
-  var node = ((element: any): InputWithWrapperState);
-  var defaultValue = props.defaultValue == null ? '' : props.defaultValue;
+  const node = ((element: any): InputWithWrapperState);
+  const defaultValue = props.defaultValue == null ? '' : props.defaultValue;
 
   node._wrapperState = {
     initialChecked:
@@ -130,17 +130,17 @@ export function initWrapperState(element: Element, props: Object) {
 }
 
 export function updateChecked(element: Element, props: Object) {
-  var node = ((element: any): InputWithWrapperState);
-  var checked = props.checked;
+  const node = ((element: any): InputWithWrapperState);
+  const checked = props.checked;
   if (checked != null) {
     DOMPropertyOperations.setValueForProperty(node, 'checked', checked);
   }
 }
 
 export function updateWrapper(element: Element, props: Object) {
-  var node = ((element: any): InputWithWrapperState);
+  const node = ((element: any): InputWithWrapperState);
   if (__DEV__) {
-    var controlled = isControlled(props);
+    const controlled = isControlled(props);
 
     if (
       !node._wrapperState.controlled &&
@@ -178,7 +178,7 @@ export function updateWrapper(element: Element, props: Object) {
 
   updateChecked(element, props);
 
-  var value = getSafeValue(props.value);
+  const value = getSafeValue(props.value);
 
   if (value != null) {
     if (props.type === 'number') {
@@ -206,7 +206,7 @@ export function updateWrapper(element: Element, props: Object) {
 }
 
 export function postMountWrapper(element: Element, props: Object) {
-  var node = ((element: any): InputWithWrapperState);
+  const node = ((element: any): InputWithWrapperState);
 
   if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {
     // Do not assign value if it is already set. This prevents user text input
@@ -226,7 +226,7 @@ export function postMountWrapper(element: Element, props: Object) {
   // will sometimes influence the value of checked (even after detachment).
   // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416
   // We need to temporarily unset name to avoid disrupting radio button groups.
-  var name = node.name;
+  const name = node.name;
   if (name !== '') {
     node.name = '';
   }
@@ -238,15 +238,15 @@ export function postMountWrapper(element: Element, props: Object) {
 }
 
 export function restoreControlledState(element: Element, props: Object) {
-  var node = ((element: any): InputWithWrapperState);
+  const node = ((element: any): InputWithWrapperState);
   updateWrapper(node, props);
   updateNamedCousins(node, props);
 }
 
 function updateNamedCousins(rootNode, props) {
-  var name = props.name;
+  const name = props.name;
   if (props.type === 'radio' && name != null) {
-    var queryRoot: Element = rootNode;
+    let queryRoot: Element = rootNode;
 
     while (queryRoot.parentNode) {
       queryRoot = ((queryRoot.parentNode: any): Element);
@@ -259,12 +259,12 @@ function updateNamedCousins(rootNode, props) {
     // the input might not even be in a form. It might not even be in the
     // document. Let's just use the local `querySelectorAll` to ensure we don't
     // miss anything.
-    var group = queryRoot.querySelectorAll(
+    const group = queryRoot.querySelectorAll(
       'input[name=' + JSON.stringify('' + name) + '][type="radio"]',
     );
 
-    for (var i = 0; i < group.length; i++) {
-      var otherNode = ((group[i]: any): HTMLInputElement);
+    for (let i = 0; i < group.length; i++) {
+      const otherNode = ((group[i]: any): HTMLInputElement);
       if (otherNode === rootNode || otherNode.form !== rootNode.form) {
         continue;
       }
@@ -272,7 +272,7 @@ function updateNamedCousins(rootNode, props) {
       // and the same name are rendered into the same form (same as #1939).
       // That's probably okay; we don't support it just as we don't support
       // mixing React radio buttons with non-React ones.
-      var otherProps = getFiberCurrentPropsFromNode(otherNode);
+      const otherProps = getFiberCurrentPropsFromNode(otherNode);
       invariant(
         otherProps,
         'ReactDOMInput: Mixing React and non-React radio inputs with the ' +
diff --git a/packages/react-dom/src/client/ReactDOMFiberSelect.js b/packages/react-dom/src/client/ReactDOMFiberSelect.js
index df13d3b7656c0..d0ed3ad01bd33 100644
--- a/packages/react-dom/src/client/ReactDOMFiberSelect.js
+++ b/packages/react-dom/src/client/ReactDOMFiberSelect.js
@@ -13,13 +13,15 @@ import warning from 'fbjs/lib/warning';
 
 import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
 
-var {
+const {
   getCurrentFiberOwnerName,
   getCurrentFiberStackAddendum,
 } = ReactDebugCurrentFiber;
 
+let didWarnValueDefaultValue;
+
 if (__DEV__) {
-  var didWarnValueDefaultValue = false;
+  didWarnValueDefaultValue = false;
 }
 
 type SelectWithWrapperState = HTMLSelectElement & {
@@ -30,14 +32,14 @@ type SelectWithWrapperState = HTMLSelectElement & {
 };
 
 function getDeclarationErrorAddendum() {
-  var ownerName = getCurrentFiberOwnerName();
+  const ownerName = getCurrentFiberOwnerName();
   if (ownerName) {
     return '\n\nCheck the render method of `' + ownerName + '`.';
   }
   return '';
 }
 
-var valuePropNames = ['value', 'defaultValue'];
+const valuePropNames = ['value', 'defaultValue'];
 
 /**
  * Validation function for `value` and `defaultValue`.
@@ -49,12 +51,12 @@ function checkSelectPropTypes(props) {
     getCurrentFiberStackAddendum,
   );
 
-  for (var i = 0; i < valuePropNames.length; i++) {
-    var propName = valuePropNames[i];
+  for (let i = 0; i < valuePropNames.length; i++) {
+    const propName = valuePropNames[i];
     if (props[propName] == null) {
       continue;
     }
-    var isArray = Array.isArray(props[propName]);
+    const isArray = Array.isArray(props[propName]);
     if (props.multiple && !isArray) {
       warning(
         false,
@@ -84,7 +86,7 @@ function updateOptions(
   type IndexableHTMLOptionsCollection = HTMLOptionsCollection & {
     [key: number]: HTMLOptionElement,
   };
-  var options: IndexableHTMLOptionsCollection = node.options;
+  const options: IndexableHTMLOptionsCollection = node.options;
 
   if (multiple) {
     let selectedValues = (propValue: Array<string>);
@@ -94,7 +96,7 @@ function updateOptions(
       selectedValue['$' + selectedValues[i]] = true;
     }
     for (let i = 0; i < options.length; i++) {
-      var selected = selectedValue.hasOwnProperty('$' + options[i].value);
+      const selected = selectedValue.hasOwnProperty('$' + options[i].value);
       if (options[i].selected !== selected) {
         options[i].selected = selected;
       }
@@ -148,12 +150,12 @@ export function getHostProps(element: Element, props: Object) {
 }
 
 export function initWrapperState(element: Element, props: Object) {
-  var node = ((element: any): SelectWithWrapperState);
+  const node = ((element: any): SelectWithWrapperState);
   if (__DEV__) {
     checkSelectPropTypes(props);
   }
 
-  var value = props.value;
+  const value = props.value;
   node._wrapperState = {
     initialValue: value != null ? value : props.defaultValue,
     wasMultiple: !!props.multiple,
@@ -179,9 +181,9 @@ export function initWrapperState(element: Element, props: Object) {
 }
 
 export function postMountWrapper(element: Element, props: Object) {
-  var node = ((element: any): SelectWithWrapperState);
+  const node = ((element: any): SelectWithWrapperState);
   node.multiple = !!props.multiple;
-  var value = props.value;
+  const value = props.value;
   if (value != null) {
     updateOptions(node, !!props.multiple, value, false);
   } else if (props.defaultValue != null) {
@@ -190,15 +192,15 @@ export function postMountWrapper(element: Element, props: Object) {
 }
 
 export function postUpdateWrapper(element: Element, props: Object) {
-  var node = ((element: any): SelectWithWrapperState);
+  const node = ((element: any): SelectWithWrapperState);
   // After the initial mount, we control selected-ness manually so don't pass
   // this value down
   node._wrapperState.initialValue = undefined;
 
-  var wasMultiple = node._wrapperState.wasMultiple;
+  const wasMultiple = node._wrapperState.wasMultiple;
   node._wrapperState.wasMultiple = !!props.multiple;
 
-  var value = props.value;
+  const value = props.value;
   if (value != null) {
     updateOptions(node, !!props.multiple, value, false);
   } else if (wasMultiple !== !!props.multiple) {
@@ -213,8 +215,8 @@ export function postUpdateWrapper(element: Element, props: Object) {
 }
 
 export function restoreControlledState(element: Element, props: Object) {
-  var node = ((element: any): SelectWithWrapperState);
-  var value = props.value;
+  const node = ((element: any): SelectWithWrapperState);
+  const value = props.value;
 
   if (value != null) {
     updateOptions(node, !!props.multiple, value, false);
diff --git a/packages/react-dom/src/client/__tests__/getNodeForCharacterOffset-test.js b/packages/react-dom/src/client/__tests__/getNodeForCharacterOffset-test.js
index 6df208437f073..d73cec452e379 100644
--- a/packages/react-dom/src/client/__tests__/getNodeForCharacterOffset-test.js
+++ b/packages/react-dom/src/client/__tests__/getNodeForCharacterOffset-test.js
@@ -10,17 +10,18 @@
 'use strict';
 
 // TODO: can we express this test with only public API?
-var getNodeForCharacterOffset = require('../getNodeForCharacterOffset').default;
+const getNodeForCharacterOffset = require('../getNodeForCharacterOffset')
+  .default;
 
 // Create node from HTML string
 function createNode(html) {
-  var node = (getTestDocument() || document).createElement('div');
+  const node = (getTestDocument() || document).createElement('div');
   node.innerHTML = html;
   return node;
 }
 
 function getTestDocument(markup) {
-  var doc = document.implementation.createHTMLDocument('');
+  const doc = document.implementation.createHTMLDocument('');
   doc.open();
   doc.write(
     markup ||
@@ -38,21 +39,21 @@ function expectNodeOffset(result, textContent, nodeOffset) {
 
 describe('getNodeForCharacterOffset', () => {
   it('should handle siblings', () => {
-    var node = createNode('<i>123</i><i>456</i><i>789</i>');
+    const node = createNode('<i>123</i><i>456</i><i>789</i>');
 
     expectNodeOffset(getNodeForCharacterOffset(node, 0), '123', 0);
     expectNodeOffset(getNodeForCharacterOffset(node, 4), '456', 1);
   });
 
   it('should handle trailing chars', () => {
-    var node = createNode('<i>123</i><i>456</i><i>789</i>');
+    const node = createNode('<i>123</i><i>456</i><i>789</i>');
 
     expectNodeOffset(getNodeForCharacterOffset(node, 3), '123', 3);
     expectNodeOffset(getNodeForCharacterOffset(node, 9), '789', 3);
   });
 
   it('should handle trees', () => {
-    var node = createNode(
+    const node = createNode(
       '<i>' +
         '<i>1</i>' +
         '<i>' +
@@ -74,7 +75,7 @@ describe('getNodeForCharacterOffset', () => {
   });
 
   it('should handle non-existent offset', () => {
-    var node = createNode('<i>123</i>');
+    const node = createNode('<i>123</i>');
 
     expect(getNodeForCharacterOffset(node, -1)).toBeUndefined();
     expect(getNodeForCharacterOffset(node, 4)).toBeUndefined();
diff --git a/packages/react-dom/src/events/BeforeInputEventPlugin.js b/packages/react-dom/src/events/BeforeInputEventPlugin.js
index 1a068a5d13900..1f29c50cdc1b2 100644
--- a/packages/react-dom/src/events/BeforeInputEventPlugin.js
+++ b/packages/react-dom/src/events/BeforeInputEventPlugin.js
@@ -14,13 +14,13 @@ import * as FallbackCompositionState from './FallbackCompositionState';
 import SyntheticCompositionEvent from './SyntheticCompositionEvent';
 import SyntheticInputEvent from './SyntheticInputEvent';
 
-var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space
-var START_KEYCODE = 229;
+const END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space
+const START_KEYCODE = 229;
 
-var canUseCompositionEvent =
+const canUseCompositionEvent =
   ExecutionEnvironment.canUseDOM && 'CompositionEvent' in window;
 
-var documentMode = null;
+let documentMode = null;
 if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) {
   documentMode = document.documentMode;
 }
@@ -28,7 +28,7 @@ if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) {
 // Webkit offers a very useful `textInput` event that can be used to
 // directly represent `beforeInput`. The IE `textinput` event is not as
 // useful, so we don't use it.
-var canUseTextInputEvent =
+const canUseTextInputEvent =
   ExecutionEnvironment.canUseDOM &&
   'TextEvent' in window &&
   !documentMode &&
@@ -37,7 +37,7 @@ var canUseTextInputEvent =
 // In IE9+, we have access to composition events, but the data supplied
 // by the native compositionend event may be incorrect. Japanese ideographic
 // spaces, for instance (\u3000) are not recorded correctly.
-var useFallbackCompositionData =
+const useFallbackCompositionData =
   ExecutionEnvironment.canUseDOM &&
   (!canUseCompositionEvent ||
     (documentMode && documentMode > 8 && documentMode <= 11));
@@ -47,7 +47,7 @@ var useFallbackCompositionData =
  * text input events. Rely on keypress instead.
  */
 function isPresto() {
-  var opera = window.opera;
+  const opera = window.opera;
   return (
     typeof opera === 'object' &&
     typeof opera.version === 'function' &&
@@ -55,11 +55,11 @@ function isPresto() {
   );
 }
 
-var SPACEBAR_CODE = 32;
-var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);
+const SPACEBAR_CODE = 32;
+const SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);
 
 // Events and their corresponding property names.
-var eventTypes = {
+const eventTypes = {
   beforeInput: {
     phasedRegistrationNames: {
       bubbled: 'onBeforeInput',
@@ -117,7 +117,7 @@ var eventTypes = {
 };
 
 // Track whether we've ever handled a keypress on the space key.
-var hasSpaceKeypress = false;
+let hasSpaceKeypress = false;
 
 /**
  * Return whether a native keypress event is assumed to be a command.
@@ -197,7 +197,7 @@ function isFallbackCompositionEnd(topLevelType, nativeEvent) {
  * @return {?string}
  */
 function getDataFromCustomEvent(nativeEvent) {
-  var detail = nativeEvent.detail;
+  const detail = nativeEvent.detail;
   if (typeof detail === 'object' && 'data' in detail) {
     return detail.data;
   }
@@ -205,7 +205,7 @@ function getDataFromCustomEvent(nativeEvent) {
 }
 
 // Track the current IME composition status, if any.
-var isComposing = false;
+let isComposing = false;
 
 /**
  * @return {?object} A SyntheticCompositionEvent.
@@ -216,8 +216,8 @@ function extractCompositionEvent(
   nativeEvent,
   nativeEventTarget,
 ) {
-  var eventType;
-  var fallbackData;
+  let eventType;
+  let fallbackData;
 
   if (canUseCompositionEvent) {
     eventType = getCompositionEventType(topLevelType);
@@ -245,7 +245,7 @@ function extractCompositionEvent(
     }
   }
 
-  var event = SyntheticCompositionEvent.getPooled(
+  const event = SyntheticCompositionEvent.getPooled(
     eventType,
     targetInst,
     nativeEvent,
@@ -257,7 +257,7 @@ function extractCompositionEvent(
     // This matches the property of native CompositionEventInterface.
     event.data = fallbackData;
   } else {
-    var customData = getDataFromCustomEvent(nativeEvent);
+    const customData = getDataFromCustomEvent(nativeEvent);
     if (customData !== null) {
       event.data = customData;
     }
@@ -291,7 +291,7 @@ function getNativeBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {
        * To avoid this issue, use the keypress event as if no `textInput`
        * event is available.
        */
-      var which = nativeEvent.which;
+      const which = nativeEvent.which;
       if (which !== SPACEBAR_CODE) {
         return null;
       }
@@ -301,7 +301,7 @@ function getNativeBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {
 
     case 'topTextInput':
       // Record the characters to be added to the DOM.
-      var chars = nativeEvent.data;
+      const chars = nativeEvent.data;
 
       // If it's a spacebar character, assume that we have already handled
       // it at the keypress level and bail immediately. Android Chrome
@@ -337,7 +337,7 @@ function getFallbackBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {
       (!canUseCompositionEvent &&
         isFallbackCompositionEnd(topLevelType, nativeEvent))
     ) {
-      var chars = FallbackCompositionState.getData();
+      const chars = FallbackCompositionState.getData();
       FallbackCompositionState.reset();
       isComposing = false;
       return chars;
@@ -400,7 +400,7 @@ function extractBeforeInputEvent(
   nativeEvent,
   nativeEventTarget,
 ) {
-  var chars;
+  let chars;
 
   if (canUseTextInputEvent) {
     chars = getNativeBeforeInputChars(topLevelType, nativeEvent);
@@ -414,7 +414,7 @@ function extractBeforeInputEvent(
     return null;
   }
 
-  var event = SyntheticInputEvent.getPooled(
+  const event = SyntheticInputEvent.getPooled(
     eventTypes.beforeInput,
     targetInst,
     nativeEvent,
@@ -444,7 +444,7 @@ function extractBeforeInputEvent(
  * allowing us to share composition fallback code for both `beforeInput` and
  * `composition` event types.
  */
-var BeforeInputEventPlugin = {
+const BeforeInputEventPlugin = {
   eventTypes: eventTypes,
 
   extractEvents: function(
diff --git a/packages/react-dom/src/events/BrowserEventConstants.js b/packages/react-dom/src/events/BrowserEventConstants.js
index 276df6ee76f22..9d185cc3262c6 100644
--- a/packages/react-dom/src/events/BrowserEventConstants.js
+++ b/packages/react-dom/src/events/BrowserEventConstants.js
@@ -14,7 +14,7 @@ import getVendorPrefixedEventName from './getVendorPrefixedEventName';
  * trap at a lower node than `document`), binding at `document` would
  * cause duplicate events so we don't include them here.
  */
-var topLevelTypes = {
+const topLevelTypes = {
   topAbort: 'abort',
   topAnimationEnd: getVendorPrefixedEventName('animationend') || 'animationend',
   topAnimationIteration:
@@ -90,7 +90,7 @@ var topLevelTypes = {
 
 export type TopLevelTypes = $Enum<typeof topLevelTypes>;
 
-var BrowserEventConstants = {
+const BrowserEventConstants = {
   topLevelTypes,
 };
 
diff --git a/packages/react-dom/src/events/ChangeEventPlugin.js b/packages/react-dom/src/events/ChangeEventPlugin.js
index 9d759907b5ef8..392beab1be491 100644
--- a/packages/react-dom/src/events/ChangeEventPlugin.js
+++ b/packages/react-dom/src/events/ChangeEventPlugin.js
@@ -19,7 +19,7 @@ import {getNodeFromInstance} from '../client/ReactDOMComponentTree';
 import * as inputValueTracking from '../client/inputValueTracking';
 import {setDefaultValue} from '../client/ReactDOMFiberInput';
 
-var eventTypes = {
+const eventTypes = {
   change: {
     phasedRegistrationNames: {
       bubbled: 'onChange',
@@ -39,7 +39,7 @@ var eventTypes = {
 };
 
 function createAndAccumulateChangeEvent(inst, nativeEvent, target) {
-  var event = SyntheticEvent.getPooled(
+  const event = SyntheticEvent.getPooled(
     eventTypes.change,
     inst,
     nativeEvent,
@@ -54,21 +54,21 @@ function createAndAccumulateChangeEvent(inst, nativeEvent, target) {
 /**
  * For IE shims
  */
-var activeElement = null;
-var activeElementInst = null;
+let activeElement = null;
+let activeElementInst = null;
 
 /**
  * SECTION: handle `change` event
  */
 function shouldUseChangeEvent(elem) {
-  var nodeName = elem.nodeName && elem.nodeName.toLowerCase();
+  const nodeName = elem.nodeName && elem.nodeName.toLowerCase();
   return (
     nodeName === 'select' || (nodeName === 'input' && elem.type === 'file')
   );
 }
 
 function manualDispatchChangeEvent(nativeEvent) {
-  var event = createAndAccumulateChangeEvent(
+  const event = createAndAccumulateChangeEvent(
     activeElementInst,
     nativeEvent,
     getEventTarget(nativeEvent),
@@ -109,7 +109,7 @@ function getTargetInstForChangeEvent(topLevelType, targetInst) {
 /**
  * SECTION: handle `input` event
  */
-var isInputEventSupported = false;
+let isInputEventSupported = false;
 if (ExecutionEnvironment.canUseDOM) {
   // IE9 claims to support the input event but fails to trigger it when
   // deleting text, so we ignore its input events.
@@ -202,7 +202,7 @@ function shouldUseClickEvent(elem) {
   // Use the `click` event to detect changes to checkbox and radio inputs.
   // This approach works across all browsers, whereas `change` does not fire
   // until `blur` in IE8.
-  var nodeName = elem.nodeName;
+  const nodeName = elem.nodeName;
   return (
     nodeName &&
     nodeName.toLowerCase() === 'input' &&
@@ -249,7 +249,7 @@ function handleControlledInputBlur(inst, node) {
  * - textarea
  * - select
  */
-var ChangeEventPlugin = {
+const ChangeEventPlugin = {
   eventTypes: eventTypes,
 
   _isInputEventSupported: isInputEventSupported,
@@ -260,9 +260,9 @@ var ChangeEventPlugin = {
     nativeEvent,
     nativeEventTarget,
   ) {
-    var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
+    const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
 
-    var getTargetInstFunc, handleEventFunc;
+    let getTargetInstFunc, handleEventFunc;
     if (shouldUseChangeEvent(targetNode)) {
       getTargetInstFunc = getTargetInstForChangeEvent;
     } else if (isTextInputElement(targetNode)) {
@@ -277,9 +277,9 @@ var ChangeEventPlugin = {
     }
 
     if (getTargetInstFunc) {
-      var inst = getTargetInstFunc(topLevelType, targetInst);
+      const inst = getTargetInstFunc(topLevelType, targetInst);
       if (inst) {
-        var event = createAndAccumulateChangeEvent(
+        const event = createAndAccumulateChangeEvent(
           inst,
           nativeEvent,
           nativeEventTarget,
diff --git a/packages/react-dom/src/events/DOMEventPluginOrder.js b/packages/react-dom/src/events/DOMEventPluginOrder.js
index bc7052f324643..0896938b97831 100644
--- a/packages/react-dom/src/events/DOMEventPluginOrder.js
+++ b/packages/react-dom/src/events/DOMEventPluginOrder.js
@@ -14,7 +14,7 @@
  * `ResponderEventPlugin` must occur before `SimpleEventPlugin` so that
  * preventing default on events is convenient in `SimpleEventPlugin` handlers.
  */
-var DOMEventPluginOrder = [
+const DOMEventPluginOrder = [
   'ResponderEventPlugin',
   'SimpleEventPlugin',
   'TapEventPlugin',
diff --git a/packages/react-dom/src/events/EnterLeaveEventPlugin.js b/packages/react-dom/src/events/EnterLeaveEventPlugin.js
index f93bea1d8e73c..9a2be568c108c 100644
--- a/packages/react-dom/src/events/EnterLeaveEventPlugin.js
+++ b/packages/react-dom/src/events/EnterLeaveEventPlugin.js
@@ -13,7 +13,7 @@ import {
   getNodeFromInstance,
 } from '../client/ReactDOMComponentTree';
 
-var eventTypes = {
+const eventTypes = {
   mouseEnter: {
     registrationName: 'onMouseEnter',
     dependencies: ['topMouseOut', 'topMouseOver'],
@@ -24,7 +24,7 @@ var eventTypes = {
   },
 };
 
-var EnterLeaveEventPlugin = {
+const EnterLeaveEventPlugin = {
   eventTypes: eventTypes,
 
   /**
@@ -51,13 +51,13 @@ var EnterLeaveEventPlugin = {
       return null;
     }
 
-    var win;
+    let win;
     if (nativeEventTarget.window === nativeEventTarget) {
       // `nativeEventTarget` is probably a window object.
       win = nativeEventTarget;
     } else {
       // TODO: Figure out why `ownerDocument` is sometimes undefined in IE8.
-      var doc = nativeEventTarget.ownerDocument;
+      const doc = nativeEventTarget.ownerDocument;
       if (doc) {
         win = doc.defaultView || doc.parentWindow;
       } else {
@@ -65,11 +65,11 @@ var EnterLeaveEventPlugin = {
       }
     }
 
-    var from;
-    var to;
+    let from;
+    let to;
     if (topLevelType === 'topMouseOut') {
       from = targetInst;
-      var related = nativeEvent.relatedTarget || nativeEvent.toElement;
+      const related = nativeEvent.relatedTarget || nativeEvent.toElement;
       to = related ? getClosestInstanceFromNode(related) : null;
     } else {
       // Moving to a node from outside the window.
@@ -82,10 +82,10 @@ var EnterLeaveEventPlugin = {
       return null;
     }
 
-    var fromNode = from == null ? win : getNodeFromInstance(from);
-    var toNode = to == null ? win : getNodeFromInstance(to);
+    const fromNode = from == null ? win : getNodeFromInstance(from);
+    const toNode = to == null ? win : getNodeFromInstance(to);
 
-    var leave = SyntheticMouseEvent.getPooled(
+    const leave = SyntheticMouseEvent.getPooled(
       eventTypes.mouseLeave,
       from,
       nativeEvent,
@@ -95,7 +95,7 @@ var EnterLeaveEventPlugin = {
     leave.target = fromNode;
     leave.relatedTarget = toNode;
 
-    var enter = SyntheticMouseEvent.getPooled(
+    const enter = SyntheticMouseEvent.getPooled(
       eventTypes.mouseEnter,
       to,
       nativeEvent,
diff --git a/packages/react-dom/src/events/FallbackCompositionState.js b/packages/react-dom/src/events/FallbackCompositionState.js
index 5891ab78a114d..3200a09fb3cd8 100644
--- a/packages/react-dom/src/events/FallbackCompositionState.js
+++ b/packages/react-dom/src/events/FallbackCompositionState.js
@@ -18,7 +18,7 @@ import getTextContentAccessor from '../client/getTextContentAccessor';
  *
  *
  */
-var compositionState = {
+const compositionState = {
   _root: null,
   _startText: null,
   _fallbackText: null,
@@ -41,12 +41,12 @@ export function getData() {
     return compositionState._fallbackText;
   }
 
-  var start;
-  var startValue = compositionState._startText;
-  var startLength = startValue.length;
-  var end;
-  var endValue = getText();
-  var endLength = endValue.length;
+  let start;
+  const startValue = compositionState._startText;
+  const startLength = startValue.length;
+  let end;
+  const endValue = getText();
+  const endLength = endValue.length;
 
   for (start = 0; start < startLength; start++) {
     if (startValue[start] !== endValue[start]) {
@@ -54,14 +54,14 @@ export function getData() {
     }
   }
 
-  var minEnd = startLength - start;
+  const minEnd = startLength - start;
   for (end = 1; end <= minEnd; end++) {
     if (startValue[startLength - end] !== endValue[endLength - end]) {
       break;
     }
   }
 
-  var sliceTail = end > 1 ? 1 - end : undefined;
+  const sliceTail = end > 1 ? 1 - end : undefined;
   compositionState._fallbackText = endValue.slice(start, sliceTail);
   return compositionState._fallbackText;
 }
diff --git a/packages/react-dom/src/events/ReactBrowserEventEmitter.js b/packages/react-dom/src/events/ReactBrowserEventEmitter.js
index 2b7e9a5509152..a9181b3fe9fc4 100644
--- a/packages/react-dom/src/events/ReactBrowserEventEmitter.js
+++ b/packages/react-dom/src/events/ReactBrowserEventEmitter.js
@@ -18,7 +18,7 @@ import BrowserEventConstants from './BrowserEventConstants';
 
 export * from 'events/ReactEventEmitterMixin';
 
-var {topLevelTypes} = BrowserEventConstants;
+const {topLevelTypes} = BrowserEventConstants;
 
 /**
  * Summary of `ReactBrowserEventEmitter` event handling:
@@ -76,13 +76,13 @@ var {topLevelTypes} = BrowserEventConstants;
  *    React Core     .  General Purpose Event Plugin System
  */
 
-var alreadyListeningTo = {};
-var reactTopListenersCounter = 0;
+const alreadyListeningTo = {};
+let reactTopListenersCounter = 0;
 
 /**
  * To ensure no conflicts with other potential React instances on the page
  */
-var topListenersIDKey = '_reactListenersID' + ('' + Math.random()).slice(2);
+const topListenersIDKey = '_reactListenersID' + ('' + Math.random()).slice(2);
 
 function getListeningForDocument(mountAt) {
   // In IE8, `mountAt` is a host object and doesn't have `hasOwnProperty`
@@ -116,12 +116,12 @@ function getListeningForDocument(mountAt) {
  * @param {object} contentDocumentHandle Document which owns the container
  */
 export function listenTo(registrationName, contentDocumentHandle) {
-  var mountAt = contentDocumentHandle;
-  var isListening = getListeningForDocument(mountAt);
-  var dependencies = registrationNameDependencies[registrationName];
+  const mountAt = contentDocumentHandle;
+  const isListening = getListeningForDocument(mountAt);
+  const dependencies = registrationNameDependencies[registrationName];
 
-  for (var i = 0; i < dependencies.length; i++) {
-    var dependency = dependencies[i];
+  for (let i = 0; i < dependencies.length; i++) {
+    const dependency = dependencies[i];
     if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) {
       if (dependency === 'topScroll') {
         trapCapturedEvent('topScroll', 'scroll', mountAt);
@@ -152,10 +152,10 @@ export function listenTo(registrationName, contentDocumentHandle) {
 }
 
 export function isListeningToAllDependencies(registrationName, mountAt) {
-  var isListening = getListeningForDocument(mountAt);
-  var dependencies = registrationNameDependencies[registrationName];
-  for (var i = 0; i < dependencies.length; i++) {
-    var dependency = dependencies[i];
+  const isListening = getListeningForDocument(mountAt);
+  const dependencies = registrationNameDependencies[registrationName];
+  for (let i = 0; i < dependencies.length; i++) {
+    const dependency = dependencies[i];
     if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) {
       return false;
     }
diff --git a/packages/react-dom/src/events/ReactDOMEventListener.js b/packages/react-dom/src/events/ReactDOMEventListener.js
index 78c3ae43c3aae..3ba6de4cd8349 100644
--- a/packages/react-dom/src/events/ReactDOMEventListener.js
+++ b/packages/react-dom/src/events/ReactDOMEventListener.js
@@ -13,8 +13,8 @@ import EventListener from 'fbjs/lib/EventListener';
 import getEventTarget from './getEventTarget';
 import {getClosestInstanceFromNode} from '../client/ReactDOMComponentTree';
 
-var CALLBACK_BOOKKEEPING_POOL_SIZE = 10;
-var callbackBookkeepingPool = [];
+const CALLBACK_BOOKKEEPING_POOL_SIZE = 10;
+const callbackBookkeepingPool = [];
 
 /**
  * Find the deepest React component completely containing the root of the
@@ -63,19 +63,19 @@ function releaseTopLevelCallbackBookKeeping(instance) {
 }
 
 function handleTopLevelImpl(bookKeeping) {
-  var targetInst = bookKeeping.targetInst;
+  let targetInst = bookKeeping.targetInst;
 
   // Loop through the hierarchy, in case there's any nested components.
   // It's important that we build the array of ancestors before calling any
   // event handlers, because event handlers can modify the DOM, leading to
   // inconsistencies with ReactMount's node cache. See #1105.
-  var ancestor = targetInst;
+  let ancestor = targetInst;
   do {
     if (!ancestor) {
       bookKeeping.ancestors.push(ancestor);
       break;
     }
-    var root = findRootContainerNode(ancestor);
+    const root = findRootContainerNode(ancestor);
     if (!root) {
       break;
     }
@@ -83,7 +83,7 @@ function handleTopLevelImpl(bookKeeping) {
     ancestor = getClosestInstanceFromNode(root);
   } while (ancestor);
 
-  for (var i = 0; i < bookKeeping.ancestors.length; i++) {
+  for (let i = 0; i < bookKeeping.ancestors.length; i++) {
     targetInst = bookKeeping.ancestors[i];
     _handleTopLevel(
       bookKeeping.topLevelType,
@@ -157,8 +157,8 @@ export function dispatchEvent(topLevelType, nativeEvent) {
     return;
   }
 
-  var nativeEventTarget = getEventTarget(nativeEvent);
-  var targetInst = getClosestInstanceFromNode(nativeEventTarget);
+  const nativeEventTarget = getEventTarget(nativeEvent);
+  let targetInst = getClosestInstanceFromNode(nativeEventTarget);
   if (
     targetInst !== null &&
     typeof targetInst.tag === 'number' &&
@@ -171,7 +171,7 @@ export function dispatchEvent(topLevelType, nativeEvent) {
     targetInst = null;
   }
 
-  var bookKeeping = getTopLevelCallbackBookKeeping(
+  const bookKeeping = getTopLevelCallbackBookKeeping(
     topLevelType,
     nativeEvent,
     targetInst,
diff --git a/packages/react-dom/src/events/SelectEventPlugin.js b/packages/react-dom/src/events/SelectEventPlugin.js
index cae7a53d31ec4..e6193c7973a8c 100644
--- a/packages/react-dom/src/events/SelectEventPlugin.js
+++ b/packages/react-dom/src/events/SelectEventPlugin.js
@@ -17,12 +17,12 @@ import {getNodeFromInstance} from '../client/ReactDOMComponentTree';
 import * as ReactInputSelection from '../client/ReactInputSelection';
 import {DOCUMENT_NODE} from '../shared/HTMLNodeType';
 
-var skipSelectionChangeEvent =
+const skipSelectionChangeEvent =
   ExecutionEnvironment.canUseDOM &&
   'documentMode' in document &&
   document.documentMode <= 11;
 
-var eventTypes = {
+const eventTypes = {
   select: {
     phasedRegistrationNames: {
       bubbled: 'onSelect',
@@ -41,10 +41,10 @@ var eventTypes = {
   },
 };
 
-var activeElement = null;
-var activeElementInst = null;
-var lastSelection = null;
-var mouseDown = false;
+let activeElement = null;
+let activeElementInst = null;
+let lastSelection = null;
+let mouseDown = false;
 
 /**
  * Get an object which is a unique representation of the current selection.
@@ -65,7 +65,7 @@ function getSelection(node) {
       end: node.selectionEnd,
     };
   } else if (window.getSelection) {
-    var selection = window.getSelection();
+    const selection = window.getSelection();
     return {
       anchorNode: selection.anchorNode,
       anchorOffset: selection.anchorOffset,
@@ -95,11 +95,11 @@ function constructSelectEvent(nativeEvent, nativeEventTarget) {
   }
 
   // Only fire when selection has actually changed.
-  var currentSelection = getSelection(activeElement);
+  const currentSelection = getSelection(activeElement);
   if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) {
     lastSelection = currentSelection;
 
-    var syntheticEvent = SyntheticEvent.getPooled(
+    const syntheticEvent = SyntheticEvent.getPooled(
       eventTypes.select,
       activeElementInst,
       nativeEvent,
@@ -131,7 +131,7 @@ function constructSelectEvent(nativeEvent, nativeEventTarget) {
  * - Fires for collapsed selection.
  * - Fires after user input.
  */
-var SelectEventPlugin = {
+const SelectEventPlugin = {
   eventTypes: eventTypes,
 
   extractEvents: function(
@@ -140,7 +140,7 @@ var SelectEventPlugin = {
     nativeEvent,
     nativeEventTarget,
   ) {
-    var doc =
+    const doc =
       nativeEventTarget.window === nativeEventTarget
         ? nativeEventTarget.document
         : nativeEventTarget.nodeType === DOCUMENT_NODE
@@ -152,7 +152,7 @@ var SelectEventPlugin = {
       return null;
     }
 
-    var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
+    const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
 
     switch (topLevelType) {
       // Track the input node that has focus.
diff --git a/packages/react-dom/src/events/SimpleEventPlugin.js b/packages/react-dom/src/events/SimpleEventPlugin.js
index a044ffb504062..a6db694d0a36c 100644
--- a/packages/react-dom/src/events/SimpleEventPlugin.js
+++ b/packages/react-dom/src/events/SimpleEventPlugin.js
@@ -49,8 +49,10 @@ import getEventCharCode from './getEventCharCode';
  *   'topAbort': { sameConfig }
  * };
  */
-var eventTypes: EventTypes = {};
-var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};
+const eventTypes: EventTypes = {};
+const topLevelEventsToDispatchConfig: {
+  [key: TopLevelTypes]: DispatchConfig,
+} = {};
 [
   'abort',
   'animationEnd',
@@ -118,11 +120,11 @@ var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};
   'waiting',
   'wheel',
 ].forEach(event => {
-  var capitalizedEvent = event[0].toUpperCase() + event.slice(1);
-  var onEvent = 'on' + capitalizedEvent;
-  var topEvent = 'top' + capitalizedEvent;
+  const capitalizedEvent = event[0].toUpperCase() + event.slice(1);
+  const onEvent = 'on' + capitalizedEvent;
+  const topEvent = 'top' + capitalizedEvent;
 
-  var type = {
+  const type = {
     phasedRegistrationNames: {
       bubbled: onEvent,
       captured: onEvent + 'Capture',
@@ -134,7 +136,7 @@ var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};
 });
 
 // Only used in DEV for exhaustiveness validation.
-var knownHTMLTopLevelTypes = [
+const knownHTMLTopLevelTypes = [
   'topAbort',
   'topCancel',
   'topCanPlay',
@@ -168,7 +170,7 @@ var knownHTMLTopLevelTypes = [
   'topWaiting',
 ];
 
-var SimpleEventPlugin: PluginModule<MouseEvent> = {
+const SimpleEventPlugin: PluginModule<MouseEvent> = {
   eventTypes: eventTypes,
 
   extractEvents: function(
@@ -177,11 +179,11 @@ var SimpleEventPlugin: PluginModule<MouseEvent> = {
     nativeEvent: MouseEvent,
     nativeEventTarget: EventTarget,
   ): null | ReactSyntheticEvent {
-    var dispatchConfig = topLevelEventsToDispatchConfig[topLevelType];
+    const dispatchConfig = topLevelEventsToDispatchConfig[topLevelType];
     if (!dispatchConfig) {
       return null;
     }
-    var EventConstructor;
+    let EventConstructor;
     switch (topLevelType) {
       case 'topKeyPress':
         // Firefox creates a keypress event for function keys too. This removes
@@ -268,7 +270,7 @@ var SimpleEventPlugin: PluginModule<MouseEvent> = {
         EventConstructor = SyntheticEvent;
         break;
     }
-    var event = EventConstructor.getPooled(
+    const event = EventConstructor.getPooled(
       dispatchConfig,
       targetInst,
       nativeEvent,
diff --git a/packages/react-dom/src/events/SyntheticAnimationEvent.js b/packages/react-dom/src/events/SyntheticAnimationEvent.js
index bd802d5b97f18..a796156640c4c 100644
--- a/packages/react-dom/src/events/SyntheticAnimationEvent.js
+++ b/packages/react-dom/src/events/SyntheticAnimationEvent.js
@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface
  * @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent
  */
-var AnimationEventInterface = {
+const AnimationEventInterface = {
   animationName: null,
   elapsedTime: null,
   pseudoElement: null,
diff --git a/packages/react-dom/src/events/SyntheticClipboardEvent.js b/packages/react-dom/src/events/SyntheticClipboardEvent.js
index ebe2a3edd93b2..436a3b5987071 100644
--- a/packages/react-dom/src/events/SyntheticClipboardEvent.js
+++ b/packages/react-dom/src/events/SyntheticClipboardEvent.js
@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @interface Event
  * @see http://www.w3.org/TR/clipboard-apis/
  */
-var ClipboardEventInterface = {
+const ClipboardEventInterface = {
   clipboardData: function(event) {
     return 'clipboardData' in event
       ? event.clipboardData
diff --git a/packages/react-dom/src/events/SyntheticCompositionEvent.js b/packages/react-dom/src/events/SyntheticCompositionEvent.js
index 8ff79ea48b3fb..938f7e996bb0b 100644
--- a/packages/react-dom/src/events/SyntheticCompositionEvent.js
+++ b/packages/react-dom/src/events/SyntheticCompositionEvent.js
@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @interface Event
  * @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents
  */
-var CompositionEventInterface = {
+const CompositionEventInterface = {
   data: null,
 };
 
diff --git a/packages/react-dom/src/events/SyntheticDragEvent.js b/packages/react-dom/src/events/SyntheticDragEvent.js
index 0b60a69f6ef99..3eb24359bd0d2 100644
--- a/packages/react-dom/src/events/SyntheticDragEvent.js
+++ b/packages/react-dom/src/events/SyntheticDragEvent.js
@@ -11,7 +11,7 @@ import SyntheticMouseEvent from './SyntheticMouseEvent';
  * @interface DragEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var DragEventInterface = {
+const DragEventInterface = {
   dataTransfer: null,
 };
 
diff --git a/packages/react-dom/src/events/SyntheticFocusEvent.js b/packages/react-dom/src/events/SyntheticFocusEvent.js
index fe386ce12e71c..75c83f38006f5 100644
--- a/packages/react-dom/src/events/SyntheticFocusEvent.js
+++ b/packages/react-dom/src/events/SyntheticFocusEvent.js
@@ -11,7 +11,7 @@ import SyntheticUIEvent from './SyntheticUIEvent';
  * @interface FocusEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var FocusEventInterface = {
+const FocusEventInterface = {
   relatedTarget: null,
 };
 
diff --git a/packages/react-dom/src/events/SyntheticInputEvent.js b/packages/react-dom/src/events/SyntheticInputEvent.js
index 6bb727fb3e459..6a8552f0a62e2 100644
--- a/packages/react-dom/src/events/SyntheticInputEvent.js
+++ b/packages/react-dom/src/events/SyntheticInputEvent.js
@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105
  *      /#events-inputevents
  */
-var InputEventInterface = {
+const InputEventInterface = {
   data: null,
 };
 
diff --git a/packages/react-dom/src/events/SyntheticKeyboardEvent.js b/packages/react-dom/src/events/SyntheticKeyboardEvent.js
index 65a239e785820..da15bcc2502e2 100644
--- a/packages/react-dom/src/events/SyntheticKeyboardEvent.js
+++ b/packages/react-dom/src/events/SyntheticKeyboardEvent.js
@@ -14,7 +14,7 @@ import getEventModifierState from './getEventModifierState';
  * @interface KeyboardEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var KeyboardEventInterface = {
+const KeyboardEventInterface = {
   key: getEventKey,
   location: null,
   ctrlKey: null,
diff --git a/packages/react-dom/src/events/SyntheticMouseEvent.js b/packages/react-dom/src/events/SyntheticMouseEvent.js
index cfbea7937bc58..19c4058918162 100644
--- a/packages/react-dom/src/events/SyntheticMouseEvent.js
+++ b/packages/react-dom/src/events/SyntheticMouseEvent.js
@@ -12,7 +12,7 @@ import getEventModifierState from './getEventModifierState';
  * @interface MouseEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var MouseEventInterface = {
+const MouseEventInterface = {
   screenX: null,
   screenY: null,
   clientX: null,
diff --git a/packages/react-dom/src/events/SyntheticTouchEvent.js b/packages/react-dom/src/events/SyntheticTouchEvent.js
index 386d4c777b66f..32c5c0c56f615 100644
--- a/packages/react-dom/src/events/SyntheticTouchEvent.js
+++ b/packages/react-dom/src/events/SyntheticTouchEvent.js
@@ -12,7 +12,7 @@ import getEventModifierState from './getEventModifierState';
  * @interface TouchEvent
  * @see http://www.w3.org/TR/touch-events/
  */
-var TouchEventInterface = {
+const TouchEventInterface = {
   touches: null,
   targetTouches: null,
   changedTouches: null,
diff --git a/packages/react-dom/src/events/SyntheticTransitionEvent.js b/packages/react-dom/src/events/SyntheticTransitionEvent.js
index e2295165bf775..884ceffcc5240 100644
--- a/packages/react-dom/src/events/SyntheticTransitionEvent.js
+++ b/packages/react-dom/src/events/SyntheticTransitionEvent.js
@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events-
  * @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent
  */
-var TransitionEventInterface = {
+const TransitionEventInterface = {
   propertyName: null,
   elapsedTime: null,
   pseudoElement: null,
diff --git a/packages/react-dom/src/events/SyntheticUIEvent.js b/packages/react-dom/src/events/SyntheticUIEvent.js
index 50d71621a6159..a03b82ad7cc69 100644
--- a/packages/react-dom/src/events/SyntheticUIEvent.js
+++ b/packages/react-dom/src/events/SyntheticUIEvent.js
@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';
  * @interface UIEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var UIEventInterface = {
+const UIEventInterface = {
   view: null,
   detail: null,
 };
diff --git a/packages/react-dom/src/events/SyntheticWheelEvent.js b/packages/react-dom/src/events/SyntheticWheelEvent.js
index 76b99b799eb35..69837e1b2fe3b 100644
--- a/packages/react-dom/src/events/SyntheticWheelEvent.js
+++ b/packages/react-dom/src/events/SyntheticWheelEvent.js
@@ -11,7 +11,7 @@ import SyntheticMouseEvent from './SyntheticMouseEvent';
  * @interface WheelEvent
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
-var WheelEventInterface = {
+const WheelEventInterface = {
   deltaX: function(event) {
     return 'deltaX' in event
       ? event.deltaX
diff --git a/packages/react-dom/src/events/TapEventPlugin.js b/packages/react-dom/src/events/TapEventPlugin.js
index eefa35baece92..e1e67a5d70ef9 100644
--- a/packages/react-dom/src/events/TapEventPlugin.js
+++ b/packages/react-dom/src/events/TapEventPlugin.js
@@ -46,10 +46,10 @@ type CoordinatesType = {
  * Number of pixels that are tolerated in between a `touchStart` and `touchEnd`
  * in order to still be considered a 'tap' event.
  */
-var tapMoveThreshold = 10;
-var startCoords: CoordinatesType = {x: 0, y: 0};
+const tapMoveThreshold = 10;
+const startCoords: CoordinatesType = {x: 0, y: 0};
 
-var Axis: AxisType = {
+const Axis: AxisType = {
   x: {page: 'pageX', client: 'clientX', envScroll: 'currentPageScrollLeft'},
   y: {page: 'pageY', client: 'clientY', envScroll: 'currentPageScrollTop'},
 };
@@ -58,7 +58,7 @@ function getAxisCoordOfEvent(
   axis: AxisCoordinateData,
   nativeEvent: _Touch,
 ): number {
-  var singleTouch = TouchEventUtils.extractSingleTouch(nativeEvent);
+  const singleTouch = TouchEventUtils.extractSingleTouch(nativeEvent);
   if (singleTouch) {
     return singleTouch[axis.page];
   }
@@ -66,26 +66,26 @@ function getAxisCoordOfEvent(
 }
 
 function getDistance(coords: CoordinatesType, nativeEvent: _Touch): number {
-  var pageX = getAxisCoordOfEvent(Axis.x, nativeEvent);
-  var pageY = getAxisCoordOfEvent(Axis.y, nativeEvent);
+  const pageX = getAxisCoordOfEvent(Axis.x, nativeEvent);
+  const pageY = getAxisCoordOfEvent(Axis.y, nativeEvent);
   return Math.pow(
     Math.pow(pageX - coords.x, 2) + Math.pow(pageY - coords.y, 2),
     0.5,
   );
 }
 
-var touchEvents = [
+const touchEvents = [
   'topTouchStart',
   'topTouchCancel',
   'topTouchEnd',
   'topTouchMove',
 ];
 
-var dependencies = ['topMouseDown', 'topMouseMove', 'topMouseUp'].concat(
+const dependencies = ['topMouseDown', 'topMouseMove', 'topMouseUp'].concat(
   touchEvents,
 );
 
-var eventTypes = {
+const eventTypes = {
   touchTap: {
     phasedRegistrationNames: {
       bubbled: 'onTouchTap',
@@ -95,11 +95,11 @@ var eventTypes = {
   },
 };
 
-var usedTouch = false;
-var usedTouchTime = 0;
-var TOUCH_DELAY = 1000;
+let usedTouch = false;
+let usedTouchTime = 0;
+const TOUCH_DELAY = 1000;
 
-var TapEventPlugin = {
+const TapEventPlugin = {
   tapMoveThreshold: tapMoveThreshold,
 
   eventTypes: eventTypes,
@@ -124,8 +124,8 @@ var TapEventPlugin = {
         return null;
       }
     }
-    var event = null;
-    var distance = getDistance(startCoords, nativeEvent);
+    let event = null;
+    const distance = getDistance(startCoords, nativeEvent);
     if (isEndish(topLevelType) && distance < tapMoveThreshold) {
       event = SyntheticUIEvent.getPooled(
         eventTypes.touchTap,
diff --git a/packages/react-dom/src/events/__tests__/BeforeInputEventPlugin-test.internal.js b/packages/react-dom/src/events/__tests__/BeforeInputEventPlugin-test.internal.js
index 54751f8a03a37..db7ac63c46f09 100644
--- a/packages/react-dom/src/events/__tests__/BeforeInputEventPlugin-test.internal.js
+++ b/packages/react-dom/src/events/__tests__/BeforeInputEventPlugin-test.internal.js
@@ -9,10 +9,10 @@
 
 'use strict';
 
-var React = require('react');
-var ReactTestUtils = require('react-dom/test-utils');
+const React = require('react');
+const ReactTestUtils = require('react-dom/test-utils');
 
-var EventMapping = {
+const EventMapping = {
   compositionstart: 'topCompositionStart',
   compositionend: 'topCompositionEnd',
   keyup: 'topKeyUp',
@@ -23,7 +23,7 @@ var EventMapping = {
 };
 
 describe('BeforeInputEventPlugin', function() {
-  var ModuleCache;
+  let ModuleCache;
 
   function simulateIE11() {
     document.documentMode = 11;
@@ -56,7 +56,7 @@ describe('BeforeInputEventPlugin', function() {
   }
 
   function extract(node, eventType, optionalData) {
-    var evt = document.createEvent('HTMLEvents');
+    let evt = document.createEvent('HTMLEvents');
     evt.initEvent(eventType, true, true);
     evt = Object.assign(evt, optionalData);
     return ModuleCache.BeforeInputEventPlugin.extractEvents(
@@ -74,8 +74,8 @@ describe('BeforeInputEventPlugin', function() {
   function accumulateEvents(node, events) {
     // We don't use accumulateInto module to apply partial application.
     return function() {
-      var newArgs = [node].concat(Array.prototype.slice.call(arguments));
-      var newEvents = extract.apply(this, newArgs);
+      const newArgs = [node].concat(Array.prototype.slice.call(arguments));
+      const newEvents = extract.apply(this, newArgs);
       Array.prototype.push.apply(events, newEvents);
     };
   }
@@ -89,7 +89,7 @@ describe('BeforeInputEventPlugin', function() {
   function verifyEvents(actualEvents, expectedEvents) {
     expect(actualEvents.length).toBe(expectedEvents.length);
     expectedEvents.forEach(function(expected, idx) {
-      var actual = actualEvents[idx];
+      const actual = actualEvents[idx];
       expect(function() {
         if (actual === null && expected.type === null) {
           // Both are null.  Expected.
@@ -121,7 +121,7 @@ describe('BeforeInputEventPlugin', function() {
   // instead of a standard name `textInput`.  As of now, React does not have
   // a corresponding topEvent to IE's textinput, but both events are added to
   // this scenario data for future use.
-  var Test_Scenario = [
+  const Test_Scenario = [
     // Composition test
     {run: accumulateEvents, arg: ['compositionstart', {data: ''}]},
     {run: accumulateEvents, arg: ['textInput', {data: 'A'}]},
@@ -154,7 +154,7 @@ describe('BeforeInputEventPlugin', function() {
   // Webkit behavior is simple.  We expect SyntheticInputEvent at each
   // textInput, SyntheticCompositionEvent at composition, and nothing from
   // keyUp.
-  var Expected_Webkit = () => [
+  const Expected_Webkit = () => [
     {type: ModuleCache.SyntheticCompositionEvent, data: {}},
     {type: null},
     {type: null},
@@ -189,7 +189,7 @@ describe('BeforeInputEventPlugin', function() {
   // We expect no SyntheticInputEvent from textinput. Fallback beforeInput is
   // expected to be triggered at compositionend with a text of the target
   // element, not event data.
-  var Expected_IE11 = () => [
+  const Expected_IE11 = () => [
     {type: ModuleCache.SyntheticCompositionEvent, data: {}},
     {type: null},
     {type: null},
@@ -234,10 +234,10 @@ describe('BeforeInputEventPlugin', function() {
         return <div contentEditable="true" />;
       }
     }
-    var rendered = ReactTestUtils.renderIntoDocument(<EditableDiv />);
+    const rendered = ReactTestUtils.renderIntoDocument(<EditableDiv />);
 
-    var node = ModuleCache.ReactDOM.findDOMNode(rendered);
-    var events = [];
+    const node = ModuleCache.ReactDOM.findDOMNode(rendered);
+    const events = [];
 
     Scenario.forEach(el => el.run.call(this, node, events).apply(this, el.arg));
     verifyEvents(events, ExpectedResult());
diff --git a/packages/react-dom/src/events/__tests__/ChangeEventPlugin-test.js b/packages/react-dom/src/events/__tests__/ChangeEventPlugin-test.js
index ef596081d8b09..79da67767375f 100644
--- a/packages/react-dom/src/events/__tests__/ChangeEventPlugin-test.js
+++ b/packages/react-dom/src/events/__tests__/ChangeEventPlugin-test.js
@@ -9,21 +9,21 @@
 
 'use strict';
 
-var React = require('react');
-var ReactDOM = require('react-dom');
+const React = require('react');
+const ReactDOM = require('react-dom');
 
-var setUntrackedChecked = Object.getOwnPropertyDescriptor(
+const setUntrackedChecked = Object.getOwnPropertyDescriptor(
   HTMLInputElement.prototype,
   'checked',
 ).set;
 
-var setUntrackedValue = Object.getOwnPropertyDescriptor(
+const setUntrackedValue = Object.getOwnPropertyDescriptor(
   HTMLInputElement.prototype,
   'value',
 ).set;
 
 describe('ChangeEventPlugin', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     container = document.createElement('div');
@@ -43,14 +43,14 @@ describe('ChangeEventPlugin', () => {
   // See https://github.com/facebook/react/pull/5746.
 
   it('should consider initial text value to be current', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="text" onChange={cb} defaultValue="foo" />,
       container,
     );
@@ -61,14 +61,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should consider initial checkbox checked=true to be current', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="checkbox" onChange={cb} defaultChecked={true} />,
       container,
     );
@@ -85,14 +85,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should consider initial checkbox checked=false to be current', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="checkbox" onChange={cb} defaultChecked={false} />,
       container,
     );
@@ -109,14 +109,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should fire change for checkbox input', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="checkbox" onChange={cb} />,
       container,
     );
@@ -139,14 +139,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should not fire change setting the value programmatically', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="text" defaultValue="foo" onChange={cb} />,
       container,
     );
@@ -175,14 +175,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should not distinguish equal string and number values', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="text" defaultValue="42" onChange={cb} />,
       container,
     );
@@ -200,14 +200,14 @@ describe('ChangeEventPlugin', () => {
 
   // See a similar input test above for a detailed description of why.
   it('should not fire change when setting checked programmatically', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="checkbox" onChange={cb} defaultChecked={false} />,
       container,
     );
@@ -232,20 +232,20 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should unmount', () => {
-    var input = ReactDOM.render(<input />, container);
+    const input = ReactDOM.render(<input />, container);
 
     ReactDOM.unmountComponentAtNode(container);
   });
 
   it('should only fire change for checked radio button once', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="radio" onChange={cb} />,
       container,
     );
@@ -257,8 +257,8 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should track radio button cousins in a group', () => {
-    var called1 = 0;
-    var called2 = 0;
+    let called1 = 0;
+    let called2 = 0;
 
     function cb1(e) {
       called1++;
@@ -270,15 +270,15 @@ describe('ChangeEventPlugin', () => {
       expect(e.type).toBe('change');
     }
 
-    var div = ReactDOM.render(
+    const div = ReactDOM.render(
       <div>
         <input type="radio" name="group" onChange={cb1} />
         <input type="radio" name="group" onChange={cb2} />
       </div>,
       container,
     );
-    var option1 = div.childNodes[0];
-    var option2 = div.childNodes[1];
+    const option1 = div.childNodes[0];
+    const option2 = div.childNodes[1];
 
     // Select first option.
     option1.dispatchEvent(
@@ -304,14 +304,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should deduplicate input value change events', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input;
+    let input;
     ['text', 'number', 'range'].forEach(type => {
       called = 0;
       input = ReactDOM.render(<input type={type} onChange={cb} />, container);
@@ -367,14 +367,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should listen for both change and input events when supported', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="range" onChange={cb} />,
       container,
     );
@@ -389,14 +389,14 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('should only fire events when the value changes for range inputs', () => {
-    var called = 0;
+    let called = 0;
 
     function cb(e) {
       called++;
       expect(e.type).toBe('change');
     }
 
-    var input = ReactDOM.render(
+    const input = ReactDOM.render(
       <input type="range" onChange={cb} />,
       container,
     );
@@ -412,20 +412,21 @@ describe('ChangeEventPlugin', () => {
   });
 
   it('does not crash for nodes with custom value property', () => {
+    let originalCreateElement;
     // https://github.com/facebook/react/issues/10196
     try {
-      var originalCreateElement = document.createElement;
+      originalCreateElement = document.createElement;
       document.createElement = function() {
-        var node = originalCreateElement.apply(this, arguments);
+        const node = originalCreateElement.apply(this, arguments);
         Object.defineProperty(node, 'value', {
           get() {},
           set() {},
         });
         return node;
       };
-      var div = document.createElement('div');
+      const div = document.createElement('div');
       // Mount
-      var node = ReactDOM.render(<input type="text" />, div);
+      const node = ReactDOM.render(<input type="text" />, div);
       // Update
       ReactDOM.render(<input type="text" />, div);
       // Change
diff --git a/packages/react-dom/src/events/__tests__/EnterLeaveEventPlugin-test.js b/packages/react-dom/src/events/__tests__/EnterLeaveEventPlugin-test.js
index a967c6c950e74..b2c2429df3b1e 100644
--- a/packages/react-dom/src/events/__tests__/EnterLeaveEventPlugin-test.js
+++ b/packages/react-dom/src/events/__tests__/EnterLeaveEventPlugin-test.js
@@ -9,11 +9,11 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
+let React;
+let ReactDOM;
 
 describe('EnterLeaveEventPlugin', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     jest.resetModules();
diff --git a/packages/react-dom/src/events/__tests__/FallbackCompositionState-test.js b/packages/react-dom/src/events/__tests__/FallbackCompositionState-test.js
index 36fdbdad9d605..61f2d86607e11 100644
--- a/packages/react-dom/src/events/__tests__/FallbackCompositionState-test.js
+++ b/packages/react-dom/src/events/__tests__/FallbackCompositionState-test.js
@@ -10,9 +10,9 @@
 'use strict';
 
 describe('FallbackCompositionState', () => {
-  var FallbackCompositionState;
+  let FallbackCompositionState;
 
-  var TEXT = 'Hello world';
+  const TEXT = 'Hello world';
 
   beforeEach(() => {
     // TODO: can we express this test with only public API?
@@ -20,27 +20,27 @@ describe('FallbackCompositionState', () => {
   });
 
   function getInput() {
-    var input = document.createElement('input');
+    const input = document.createElement('input');
     input.value = TEXT;
     return input;
   }
 
   function getTextarea() {
-    var textarea = document.createElement('textarea');
+    const textarea = document.createElement('textarea');
     textarea.value = TEXT;
     return textarea;
   }
 
   function getContentEditable() {
-    var editable = document.createElement('div');
-    var inner = document.createElement('span');
+    const editable = document.createElement('div');
+    const inner = document.createElement('span');
     inner.appendChild(document.createTextNode(TEXT));
     editable.appendChild(inner);
     return editable;
   }
 
   function assertExtractedData(modifiedValue, expectedData) {
-    var input = getInput();
+    const input = getInput();
     FallbackCompositionState.initialize(input);
     input.value = modifiedValue;
     expect(FallbackCompositionState.getData()).toBe(expectedData);
diff --git a/packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js b/packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js
index f01a406d409f7..2fcc983e0ee83 100644
--- a/packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js
+++ b/packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js
@@ -9,11 +9,11 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
+let React;
+let ReactDOM;
 
 describe('SelectEventPlugin', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     React = require('react');
@@ -30,8 +30,8 @@ describe('SelectEventPlugin', () => {
 
   // See https://github.com/facebook/react/pull/3639 for details.
   it('does not get confused when dependent events are registered independently', () => {
-    var select = jest.fn();
-    var onSelect = event => {
+    const select = jest.fn();
+    const onSelect = event => {
       expect(typeof event).toBe('object');
       expect(event.type).toBe('select');
       expect(event.target).toBe(node);
@@ -39,7 +39,7 @@ describe('SelectEventPlugin', () => {
     };
 
     // Pass `onMouseDown` so React registers a top-level listener.
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="text" onMouseDown={function() {}} />,
       container,
     );
@@ -76,21 +76,21 @@ describe('SelectEventPlugin', () => {
   });
 
   it('should fire `onSelect` when a listener is present', () => {
-    var select = jest.fn();
-    var onSelect = event => {
+    const select = jest.fn();
+    const onSelect = event => {
       expect(typeof event).toBe('object');
       expect(event.type).toBe('select');
       expect(event.target).toBe(node);
       select(event.currentTarget);
     };
 
-    var node = ReactDOM.render(
+    const node = ReactDOM.render(
       <input type="text" onSelect={onSelect} />,
       container,
     );
     node.focus();
 
-    var nativeEvent = new MouseEvent('focus', {
+    let nativeEvent = new MouseEvent('focus', {
       bubbles: true,
       cancelable: true,
     });
diff --git a/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.js b/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.js
index 9f08f605c9c8d..f88316db80d4f 100644
--- a/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.js
+++ b/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.js
@@ -10,11 +10,11 @@
 'use strict';
 
 describe('SimpleEventPlugin', function() {
-  var React;
-  var ReactDOM;
-  var ReactTestUtils;
+  let React;
+  let ReactDOM;
+  let ReactTestUtils;
 
-  var onClick;
+  let onClick;
 
   function expectClickThru(element) {
     ReactTestUtils.SimulateNative.click(ReactDOM.findDOMNode(element));
@@ -40,67 +40,67 @@ describe('SimpleEventPlugin', function() {
   });
 
   it('A non-interactive tags click when disabled', function() {
-    var element = <div onClick={onClick} />;
+    const element = <div onClick={onClick} />;
     expectClickThru(mounted(element));
   });
 
   it('A non-interactive tags clicks bubble when disabled', function() {
-    var element = ReactTestUtils.renderIntoDocument(
+    const element = ReactTestUtils.renderIntoDocument(
       <div onClick={onClick}>
         <div />
       </div>,
     );
-    var child = ReactDOM.findDOMNode(element).firstChild;
+    const child = ReactDOM.findDOMNode(element).firstChild;
 
     ReactTestUtils.SimulateNative.click(child);
     expect(onClick.mock.calls.length).toBe(1);
   });
 
   it('does not register a click when clicking a child of a disabled element', function() {
-    var element = ReactTestUtils.renderIntoDocument(
+    const element = ReactTestUtils.renderIntoDocument(
       <button onClick={onClick} disabled={true}>
         <span />
       </button>,
     );
-    var child = ReactDOM.findDOMNode(element).querySelector('span');
+    const child = ReactDOM.findDOMNode(element).querySelector('span');
 
     ReactTestUtils.SimulateNative.click(child);
     expect(onClick.mock.calls.length).toBe(0);
   });
 
   it('triggers click events for children of disabled elements', function() {
-    var element = ReactTestUtils.renderIntoDocument(
+    const element = ReactTestUtils.renderIntoDocument(
       <button disabled={true}>
         <span onClick={onClick} />
       </button>,
     );
-    var child = ReactDOM.findDOMNode(element).querySelector('span');
+    const child = ReactDOM.findDOMNode(element).querySelector('span');
 
     ReactTestUtils.SimulateNative.click(child);
     expect(onClick.mock.calls.length).toBe(1);
   });
 
   it('triggers parent captured click events when target is a child of a disabled elements', function() {
-    var element = ReactTestUtils.renderIntoDocument(
+    const element = ReactTestUtils.renderIntoDocument(
       <div onClickCapture={onClick}>
         <button disabled={true}>
           <span />
         </button>
       </div>,
     );
-    var child = ReactDOM.findDOMNode(element).querySelector('span');
+    const child = ReactDOM.findDOMNode(element).querySelector('span');
 
     ReactTestUtils.SimulateNative.click(child);
     expect(onClick.mock.calls.length).toBe(1);
   });
 
   it('triggers captured click events for children of disabled elements', function() {
-    var element = ReactTestUtils.renderIntoDocument(
+    const element = ReactTestUtils.renderIntoDocument(
       <button disabled={true}>
         <span onClickCapture={onClick} />
       </button>,
     );
-    var child = ReactDOM.findDOMNode(element).querySelector('span');
+    const child = ReactDOM.findDOMNode(element).querySelector('span');
 
     ReactTestUtils.SimulateNative.click(child);
     expect(onClick.mock.calls.length).toBe(1);
@@ -109,7 +109,7 @@ describe('SimpleEventPlugin', function() {
   ['button', 'input', 'select', 'textarea'].forEach(function(tagName) {
     describe(tagName, function() {
       it('should forward clicks when it starts out not disabled', () => {
-        var element = React.createElement(tagName, {
+        const element = React.createElement(tagName, {
           onClick: onClick,
         });
 
@@ -117,7 +117,7 @@ describe('SimpleEventPlugin', function() {
       });
 
       it('should not forward clicks when it starts out disabled', () => {
-        var element = React.createElement(tagName, {
+        const element = React.createElement(tagName, {
           onClick: onClick,
           disabled: true,
         });
@@ -126,8 +126,8 @@ describe('SimpleEventPlugin', function() {
       });
 
       it('should forward clicks when it becomes not disabled', () => {
-        var container = document.createElement('div');
-        var element = ReactDOM.render(
+        const container = document.createElement('div');
+        let element = ReactDOM.render(
           React.createElement(tagName, {onClick: onClick, disabled: true}),
           container,
         );
@@ -139,8 +139,8 @@ describe('SimpleEventPlugin', function() {
       });
 
       it('should not forward clicks when it becomes disabled', () => {
-        var container = document.createElement('div');
-        var element = ReactDOM.render(
+        const container = document.createElement('div');
+        let element = ReactDOM.render(
           React.createElement(tagName, {onClick: onClick}),
           container,
         );
@@ -152,8 +152,8 @@ describe('SimpleEventPlugin', function() {
       });
 
       it('should work correctly if the listener is changed', () => {
-        var container = document.createElement('div');
-        var element = ReactDOM.render(
+        const container = document.createElement('div');
+        let element = ReactDOM.render(
           React.createElement(tagName, {onClick: onClick, disabled: true}),
           container,
         );
@@ -170,11 +170,11 @@ describe('SimpleEventPlugin', function() {
     // See http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html
 
     it('does not add a local click to interactive elements', function() {
-      var container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(<button onClick={onClick} />, container);
 
-      var node = container.firstChild;
+      const node = container.firstChild;
 
       node.dispatchEvent(new MouseEvent('click'));
 
@@ -182,11 +182,11 @@ describe('SimpleEventPlugin', function() {
     });
 
     it('adds a local click listener to non-interactive elements', function() {
-      var container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(<div onClick={onClick} />, container);
 
-      var node = container.firstChild;
+      const node = container.firstChild;
 
       node.dispatchEvent(new MouseEvent('click'));
 
diff --git a/packages/react-dom/src/events/__tests__/SyntheticClipboardEvent-test.js b/packages/react-dom/src/events/__tests__/SyntheticClipboardEvent-test.js
index 64e88c73c44db..5213973ddd7fb 100644
--- a/packages/react-dom/src/events/__tests__/SyntheticClipboardEvent-test.js
+++ b/packages/react-dom/src/events/__tests__/SyntheticClipboardEvent-test.js
@@ -9,11 +9,11 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
+let React;
+let ReactDOM;
 
 describe('SyntheticClipboardEvent', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     React = require('react');
@@ -33,21 +33,21 @@ describe('SyntheticClipboardEvent', () => {
     describe('clipboardData', () => {
       describe('when event has clipboardData', () => {
         it("returns event's clipboardData", () => {
-          var expectedCount = 0;
+          let expectedCount = 0;
 
           // Mock clipboardData since jsdom implementation doesn't have a constructor
-          var clipboardData = {
+          const clipboardData = {
             dropEffect: null,
             effectAllowed: null,
             files: null,
             items: null,
             types: null,
           };
-          var eventHandler = event => {
+          const eventHandler = event => {
             expect(event.clipboardData).toBe(clipboardData);
             expectedCount++;
           };
-          var div = ReactDOM.render(
+          const div = ReactDOM.render(
             <div
               onCopy={eventHandler}
               onCut={eventHandler}
@@ -56,7 +56,7 @@ describe('SyntheticClipboardEvent', () => {
             container,
           );
 
-          var event;
+          let event;
           event = document.createEvent('Event');
           event.initEvent('copy', true, true);
           event.clipboardData = clipboardData;
@@ -80,10 +80,10 @@ describe('SyntheticClipboardEvent', () => {
 
   describe('EventInterface', () => {
     it('normalizes properties from the Event interface', () => {
-      var expectedCount = 0;
-      var div;
+      let expectedCount = 0;
+      let div;
 
-      var eventHandler = type => event => {
+      const eventHandler = type => event => {
         expect(event.target).toBe(div);
         expect(event.type).toBe(type);
         expectedCount++;
@@ -98,7 +98,7 @@ describe('SyntheticClipboardEvent', () => {
         container,
       );
 
-      var event;
+      let event;
       event = document.createEvent('Event');
       event.initEvent('copy', true, true);
       // Emulate IE8
@@ -142,9 +142,9 @@ describe('SyntheticClipboardEvent', () => {
     });
 
     it('is able to `preventDefault` and `stopPropagation`', () => {
-      var expectedCount = 0;
+      let expectedCount = 0;
 
-      var eventHandler = event => {
+      const eventHandler = event => {
         expect(event.isDefaultPrevented()).toBe(false);
         event.preventDefault();
         expect(event.isDefaultPrevented()).toBe(true);
@@ -154,7 +154,7 @@ describe('SyntheticClipboardEvent', () => {
         expectedCount++;
       };
 
-      var div = ReactDOM.render(
+      const div = ReactDOM.render(
         <div
           onCopy={eventHandler}
           onCut={eventHandler}
@@ -163,7 +163,7 @@ describe('SyntheticClipboardEvent', () => {
         container,
       );
 
-      var event;
+      let event;
       event = document.createEvent('Event');
       event.initEvent('copy', true, true);
       div.dispatchEvent(event);
@@ -181,14 +181,14 @@ describe('SyntheticClipboardEvent', () => {
 
     it('is able to `persist`', () => {
       const persistentEvents = [];
-      var eventHandler = event => {
+      const eventHandler = event => {
         expect(event.isPersistent()).toBe(false);
         event.persist();
         expect(event.isPersistent()).toBe(true);
         persistentEvents.push(event);
       };
 
-      var div = ReactDOM.render(
+      const div = ReactDOM.render(
         <div
           onCopy={eventHandler}
           onCut={eventHandler}
@@ -197,7 +197,7 @@ describe('SyntheticClipboardEvent', () => {
         container,
       );
 
-      var event;
+      let event;
       event = document.createEvent('Event');
       event.initEvent('copy', true, true);
       div.dispatchEvent(event);
diff --git a/packages/react-dom/src/events/__tests__/SyntheticEvent-test.js b/packages/react-dom/src/events/__tests__/SyntheticEvent-test.js
index 31302fe8358ff..a159467eabc31 100644
--- a/packages/react-dom/src/events/__tests__/SyntheticEvent-test.js
+++ b/packages/react-dom/src/events/__tests__/SyntheticEvent-test.js
@@ -9,12 +9,12 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
-var ReactTestUtils;
+let React;
+let ReactDOM;
+let ReactTestUtils;
 
 describe('SyntheticEvent', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     React = require('react');
@@ -31,17 +31,17 @@ describe('SyntheticEvent', () => {
   });
 
   it('should normalize `target` from the nativeEvent', () => {
-    var node;
-    var expectedCount = 0;
+    let node;
+    let expectedCount = 0;
 
-    var eventHandler = syntheticEvent => {
+    const eventHandler = syntheticEvent => {
       expect(syntheticEvent.target).toBe(node);
 
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     // Emulate IE8
     Object.defineProperty(event, 'target', {
@@ -58,10 +58,10 @@ describe('SyntheticEvent', () => {
   });
 
   it('should be able to `preventDefault`', () => {
-    var node;
-    var expectedCount = 0;
+    let node;
+    let expectedCount = 0;
 
-    var eventHandler = syntheticEvent => {
+    const eventHandler = syntheticEvent => {
       expect(syntheticEvent.isDefaultPrevented()).toBe(false);
       syntheticEvent.preventDefault();
       expect(syntheticEvent.isDefaultPrevented()).toBe(true);
@@ -71,7 +71,7 @@ describe('SyntheticEvent', () => {
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -79,17 +79,17 @@ describe('SyntheticEvent', () => {
   });
 
   it('should be prevented if nativeEvent is prevented', () => {
-    var node;
-    var expectedCount = 0;
+    let node;
+    let expectedCount = 0;
 
-    var eventHandler = syntheticEvent => {
+    const eventHandler = syntheticEvent => {
       expect(syntheticEvent.isDefaultPrevented()).toBe(true);
 
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event;
+    let event;
     event = document.createEvent('Event');
     event.initEvent('click', true, true);
     event.preventDefault();
@@ -112,10 +112,10 @@ describe('SyntheticEvent', () => {
   });
 
   it('should be able to `stopPropagation`', () => {
-    var node;
-    var expectedCount = 0;
+    let node;
+    let expectedCount = 0;
 
-    var eventHandler = syntheticEvent => {
+    const eventHandler = syntheticEvent => {
       expect(syntheticEvent.isPropagationStopped()).toBe(false);
       syntheticEvent.stopPropagation();
       expect(syntheticEvent.isPropagationStopped()).toBe(true);
@@ -124,7 +124,7 @@ describe('SyntheticEvent', () => {
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -132,11 +132,11 @@ describe('SyntheticEvent', () => {
   });
 
   it('should be able to `persist`', () => {
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       expect(e.isPersistent()).toBe(false);
       e.persist();
       syntheticEvent = e;
@@ -146,7 +146,7 @@ describe('SyntheticEvent', () => {
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -158,18 +158,18 @@ describe('SyntheticEvent', () => {
 
   it('should be nullified and log warnings if the synthetic event has not been persisted', () => {
     spyOnDev(console, 'error');
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       syntheticEvent = e;
 
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -193,18 +193,18 @@ describe('SyntheticEvent', () => {
 
   it('should warn when setting properties of a synthetic event that has not been persisted', () => {
     spyOnDev(console, 'error');
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       syntheticEvent = e;
 
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -224,17 +224,17 @@ describe('SyntheticEvent', () => {
 
   it('should warn when calling `preventDefault` if the synthetic event has not been persisted', () => {
     spyOnDev(console, 'error');
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       syntheticEvent = e;
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
     node.dispatchEvent(event);
 
@@ -254,17 +254,17 @@ describe('SyntheticEvent', () => {
 
   it('should warn when calling `stopPropagation` if the synthetic event has not been persisted', () => {
     spyOnDev(console, 'error');
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       syntheticEvent = e;
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
 
     node.dispatchEvent(event);
@@ -288,12 +288,12 @@ describe('SyntheticEvent', () => {
   // way we simulate events.
   xit('should properly log warnings when events simulated with rendered components', () => {
     spyOnDev(console, 'error');
-    var event;
-    var element = document.createElement('div');
+    let event;
+    const element = document.createElement('div');
     function assignEvent(e) {
       event = e;
     }
-    var node = ReactDOM.render(<div onClick={assignEvent} />, element);
+    const node = ReactDOM.render(<div onClick={assignEvent} />, element);
     ReactTestUtils.Simulate.click(ReactDOM.findDOMNode(node));
     if (__DEV__) {
       expect(console.error.calls.count()).toBe(0);
@@ -316,18 +316,18 @@ describe('SyntheticEvent', () => {
 
   it('should warn if Proxy is supported and the synthetic event is added a property', () => {
     spyOnDev(console, 'error');
-    var node;
-    var expectedCount = 0;
-    var syntheticEvent;
+    let node;
+    let expectedCount = 0;
+    let syntheticEvent;
 
-    var eventHandler = e => {
+    const eventHandler = e => {
       e.foo = 'bar';
       syntheticEvent = e;
       expectedCount++;
     };
     node = ReactDOM.render(<div onClick={eventHandler} />, container);
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent('click', true, true);
 
     node.dispatchEvent(event);
diff --git a/packages/react-dom/src/events/__tests__/SyntheticWheelEvent-test.js b/packages/react-dom/src/events/__tests__/SyntheticWheelEvent-test.js
index d20108bee8007..58979fbf9e7d8 100644
--- a/packages/react-dom/src/events/__tests__/SyntheticWheelEvent-test.js
+++ b/packages/react-dom/src/events/__tests__/SyntheticWheelEvent-test.js
@@ -9,11 +9,11 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
+let React;
+let ReactDOM;
 
 describe('SyntheticWheelEvent', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     React = require('react');
@@ -31,7 +31,7 @@ describe('SyntheticWheelEvent', () => {
 
   it('should normalize properties from the Event interface', () => {
     const events = [];
-    var onWheel = event => {
+    const onWheel = event => {
       event.persist();
       events.push(event);
     };
@@ -58,7 +58,7 @@ describe('SyntheticWheelEvent', () => {
 
   it('should normalize properties from the MouseEvent interface', () => {
     const events = [];
-    var onWheel = event => {
+    const onWheel = event => {
       event.persist();
       events.push(event);
     };
@@ -76,14 +76,14 @@ describe('SyntheticWheelEvent', () => {
   });
 
   it('should normalize properties from the WheelEvent interface', () => {
-    var events = [];
-    var onWheel = event => {
+    const events = [];
+    const onWheel = event => {
       event.persist();
       events.push(event);
     };
     ReactDOM.render(<div onWheel={onWheel} />, container);
 
-    var event = new MouseEvent('wheel', {
+    let event = new MouseEvent('wheel', {
       bubbles: true,
     });
     // jsdom doesn't support these so we add them manually.
@@ -111,8 +111,8 @@ describe('SyntheticWheelEvent', () => {
   });
 
   it('should be able to `preventDefault` and `stopPropagation`', () => {
-    var events = [];
-    var onWheel = event => {
+    const events = [];
+    const onWheel = event => {
       expect(event.isDefaultPrevented()).toBe(false);
       event.preventDefault();
       expect(event.isDefaultPrevented()).toBe(true);
@@ -141,8 +141,8 @@ describe('SyntheticWheelEvent', () => {
   });
 
   it('should be able to `persist`', () => {
-    var events = [];
-    var onWheel = event => {
+    const events = [];
+    const onWheel = event => {
       expect(event.isPersistent()).toBe(false);
       event.persist();
       expect(event.isPersistent()).toBe(true);
diff --git a/packages/react-dom/src/events/__tests__/getEventKey-test.js b/packages/react-dom/src/events/__tests__/getEventKey-test.js
index 7ec82a3daec3a..e4c08b24ffe04 100644
--- a/packages/react-dom/src/events/__tests__/getEventKey-test.js
+++ b/packages/react-dom/src/events/__tests__/getEventKey-test.js
@@ -9,11 +9,11 @@
 
 'use strict';
 
-var React;
-var ReactDOM;
+let React;
+let ReactDOM;
 
 describe('getEventKey', () => {
-  var container;
+  let container;
 
   beforeEach(() => {
     React = require('react');
@@ -41,7 +41,7 @@ describe('getEventKey', () => {
 
         ReactDOM.render(<Comp />, container);
 
-        var nativeEvent = new KeyboardEvent('keydown', {
+        const nativeEvent = new KeyboardEvent('keydown', {
           key: 'Del',
           bubbles: true,
           cancelable: true,
@@ -62,7 +62,7 @@ describe('getEventKey', () => {
 
         ReactDOM.render(<Comp />, container);
 
-        var nativeEvent = new KeyboardEvent('keydown', {
+        const nativeEvent = new KeyboardEvent('keydown', {
           key: 'f',
           bubbles: true,
           cancelable: true,
@@ -86,7 +86,7 @@ describe('getEventKey', () => {
 
           ReactDOM.render(<Comp />, container);
 
-          var nativeEvent = new KeyboardEvent('keypress', {
+          const nativeEvent = new KeyboardEvent('keypress', {
             charCode: 13,
             bubbles: true,
             cancelable: true,
@@ -107,7 +107,7 @@ describe('getEventKey', () => {
 
           ReactDOM.render(<Comp />, container);
 
-          var nativeEvent = new KeyboardEvent('keypress', {
+          const nativeEvent = new KeyboardEvent('keypress', {
             charCode: 65,
             bubbles: true,
             cancelable: true,
@@ -130,7 +130,7 @@ describe('getEventKey', () => {
 
           ReactDOM.render(<Comp />, container);
 
-          var nativeEvent = new KeyboardEvent('keydown', {
+          const nativeEvent = new KeyboardEvent('keydown', {
             keyCode: 45,
             bubbles: true,
             cancelable: true,
@@ -151,7 +151,7 @@ describe('getEventKey', () => {
 
           ReactDOM.render(<Comp />, container);
 
-          var nativeEvent = new KeyboardEvent('keydown', {
+          const nativeEvent = new KeyboardEvent('keydown', {
             keyCode: 1337,
             bubbles: true,
             cancelable: true,
diff --git a/packages/react-dom/src/events/getEventCharCode.js b/packages/react-dom/src/events/getEventCharCode.js
index 5fce467f538cb..dacf66714b4c4 100644
--- a/packages/react-dom/src/events/getEventCharCode.js
+++ b/packages/react-dom/src/events/getEventCharCode.js
@@ -16,8 +16,8 @@
  * @return {number} Normalized `charCode` property.
  */
 function getEventCharCode(nativeEvent) {
-  var charCode;
-  var keyCode = nativeEvent.keyCode;
+  let charCode;
+  const keyCode = nativeEvent.keyCode;
 
   if ('charCode' in nativeEvent) {
     charCode = nativeEvent.charCode;
diff --git a/packages/react-dom/src/events/getEventKey.js b/packages/react-dom/src/events/getEventKey.js
index 6685e2e4666c7..8a28a6e78e59a 100644
--- a/packages/react-dom/src/events/getEventKey.js
+++ b/packages/react-dom/src/events/getEventKey.js
@@ -13,7 +13,7 @@ import getEventCharCode from './getEventCharCode';
  * Normalization of deprecated HTML5 `key` values
  * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
  */
-var normalizeKey = {
+const normalizeKey = {
   Esc: 'Escape',
   Spacebar: ' ',
   Left: 'ArrowLeft',
@@ -33,7 +33,7 @@ var normalizeKey = {
  * Only special keys supported, all others depend on keyboard layout or browser
  * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
  */
-var translateToKey = {
+const translateToKey = {
   '8': 'Backspace',
   '9': 'Tab',
   '12': 'Clear',
@@ -83,7 +83,7 @@ function getEventKey(nativeEvent: KeyboardEvent): string {
 
     // FireFox implements `key` but returns `MozPrintableKey` for all
     // printable characters (normalized to `Unidentified`), ignore it.
-    var key = normalizeKey[nativeEvent.key] || nativeEvent.key;
+    const key = normalizeKey[nativeEvent.key] || nativeEvent.key;
     if (key !== 'Unidentified') {
       return key;
     }
@@ -91,7 +91,7 @@ function getEventKey(nativeEvent: KeyboardEvent): string {
 
   // Browser does not implement `key`, polyfill as much of it as we can.
   if (nativeEvent.type === 'keypress') {
-    var charCode = getEventCharCode(nativeEvent);
+    const charCode = getEventCharCode(nativeEvent);
 
     // The enter-key is technically both printable and non-printable and can
     // thus be captured by `keypress`, no other non-printable key should.
diff --git a/packages/react-dom/src/events/getEventModifierState.js b/packages/react-dom/src/events/getEventModifierState.js
index 2bf8f75f4f78a..b3883a7cc1f05 100644
--- a/packages/react-dom/src/events/getEventModifierState.js
+++ b/packages/react-dom/src/events/getEventModifierState.js
@@ -10,7 +10,7 @@
  * @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers
  */
 
-var modifierKeyToProp = {
+const modifierKeyToProp = {
   Alt: 'altKey',
   Control: 'ctrlKey',
   Meta: 'metaKey',
@@ -21,12 +21,12 @@ var modifierKeyToProp = {
 // modifier keys exposed by the event itself, does not support Lock-keys.
 // Currently, all major browsers except Chrome seems to support Lock-keys.
 function modifierStateGetter(keyArg) {
-  var syntheticEvent = this;
-  var nativeEvent = syntheticEvent.nativeEvent;
+  const syntheticEvent = this;
+  const nativeEvent = syntheticEvent.nativeEvent;
   if (nativeEvent.getModifierState) {
     return nativeEvent.getModifierState(keyArg);
   }
-  var keyProp = modifierKeyToProp[keyArg];
+  const keyProp = modifierKeyToProp[keyArg];
   return keyProp ? !!nativeEvent[keyProp] : false;
 }
 
diff --git a/packages/react-dom/src/events/getEventTarget.js b/packages/react-dom/src/events/getEventTarget.js
index a8741e8193800..028c184602477 100644
--- a/packages/react-dom/src/events/getEventTarget.js
+++ b/packages/react-dom/src/events/getEventTarget.js
@@ -15,7 +15,7 @@ import {TEXT_NODE} from '../shared/HTMLNodeType';
  * @return {DOMEventTarget} Target node.
  */
 function getEventTarget(nativeEvent) {
-  var target = nativeEvent.target || nativeEvent.srcElement || window;
+  let target = nativeEvent.target || nativeEvent.srcElement || window;
 
   // Normalize SVG <use> element events #4963
   if (target.correspondingUseElement) {
diff --git a/packages/react-dom/src/events/getVendorPrefixedEventName.js b/packages/react-dom/src/events/getVendorPrefixedEventName.js
index 87082285b4d43..3967c71a92023 100644
--- a/packages/react-dom/src/events/getVendorPrefixedEventName.js
+++ b/packages/react-dom/src/events/getVendorPrefixedEventName.js
@@ -15,7 +15,7 @@ import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';
  * @returns {object}
  */
 function makePrefixMap(styleProp, eventName) {
-  var prefixes = {};
+  const prefixes = {};
 
   prefixes[styleProp.toLowerCase()] = eventName.toLowerCase();
   prefixes['Webkit' + styleProp] = 'webkit' + eventName;
@@ -29,7 +29,7 @@ function makePrefixMap(styleProp, eventName) {
 /**
  * A list of event names to a configurable list of vendor prefixes.
  */
-var vendorPrefixes = {
+const vendorPrefixes = {
   animationend: makePrefixMap('Animation', 'AnimationEnd'),
   animationiteration: makePrefixMap('Animation', 'AnimationIteration'),
   animationstart: makePrefixMap('Animation', 'AnimationStart'),
@@ -39,12 +39,12 @@ var vendorPrefixes = {
 /**
  * Event names that have already been detected and prefixed (if applicable).
  */
-var prefixedEventNames = {};
+const prefixedEventNames = {};
 
 /**
  * Element to check for prefixes on.
  */
-var style = {};
+let style = {};
 
 /**
  * Bootstrap if a DOM exists.
@@ -81,9 +81,9 @@ function getVendorPrefixedEventName(eventName) {
     return eventName;
   }
 
-  var prefixMap = vendorPrefixes[eventName];
+  const prefixMap = vendorPrefixes[eventName];
 
-  for (var styleProp in prefixMap) {
+  for (const styleProp in prefixMap) {
     if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) {
       return (prefixedEventNames[eventName] = prefixMap[styleProp]);
     }
diff --git a/packages/react-dom/src/events/isEventSupported.js b/packages/react-dom/src/events/isEventSupported.js
index 0e4a2d1afdbc9..11c1e2339eba2 100644
--- a/packages/react-dom/src/events/isEventSupported.js
+++ b/packages/react-dom/src/events/isEventSupported.js
@@ -7,7 +7,7 @@
 
 import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';
 
-var useHasFeature;
+let useHasFeature;
 if (ExecutionEnvironment.canUseDOM) {
   useHasFeature =
     document.implementation &&
@@ -39,11 +39,11 @@ function isEventSupported(eventNameSuffix, capture) {
     return false;
   }
 
-  var eventName = 'on' + eventNameSuffix;
-  var isSupported = eventName in document;
+  const eventName = 'on' + eventNameSuffix;
+  let isSupported = eventName in document;
 
   if (!isSupported) {
-    var element = document.createElement('div');
+    const element = document.createElement('div');
     element.setAttribute(eventName, 'return;');
     isSupported = typeof element[eventName] === 'function';
   }
diff --git a/packages/react-dom/src/test-utils/ReactTestUtils.js b/packages/react-dom/src/test-utils/ReactTestUtils.js
index 8c06abf0383e4..d32d8eca45579 100644
--- a/packages/react-dom/src/test-utils/ReactTestUtils.js
+++ b/packages/react-dom/src/test-utils/ReactTestUtils.js
@@ -20,8 +20,8 @@ import invariant from 'fbjs/lib/invariant';
 
 import BrowserEventConstants from '../events/BrowserEventConstants';
 
-var {findDOMNode} = ReactDOM;
-var {
+const {findDOMNode} = ReactDOM;
+const {
   EventPluginHub,
   EventPluginRegistry,
   EventPropagators,
@@ -30,7 +30,7 @@ var {
   ReactDOMEventListener,
 } = ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
 
-var topLevelTypes = BrowserEventConstants.topLevelTypes;
+const topLevelTypes = BrowserEventConstants.topLevelTypes;
 
 function Event(suffix) {}
 
@@ -42,7 +42,7 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {
   if (!fiber) {
     return [];
   }
-  var currentParent = findCurrentFiberUsingSlowPath(fiber);
+  const currentParent = findCurrentFiberUsingSlowPath(fiber);
   if (!currentParent) {
     return [];
   }
@@ -55,7 +55,7 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {
       node.tag === ClassComponent ||
       node.tag === FunctionalComponent
     ) {
-      var publicInst = node.stateNode;
+      const publicInst = node.stateNode;
       if (test(publicInst)) {
         ret.push(publicInst);
       }
@@ -88,9 +88,9 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {
  * utilities will suffice for testing purposes.
  * @lends ReactTestUtils
  */
-var ReactTestUtils = {
+const ReactTestUtils = {
   renderIntoDocument: function(element) {
-    var div = document.createElement('div');
+    const div = document.createElement('div');
     // None of our tests actually require attaching the container to the
     // DOM, and doing so creates a mess that we rely on test isolation to
     // clean up, so we're going to stop honoring the name of this method
@@ -132,8 +132,8 @@ var ReactTestUtils = {
     if (!ReactTestUtils.isCompositeComponent(inst)) {
       return false;
     }
-    var internalInstance = ReactInstanceMap.get(inst);
-    var constructor = internalInstance.type;
+    const internalInstance = ReactInstanceMap.get(inst);
+    const constructor = internalInstance.type;
     return constructor === type;
   },
 
@@ -145,7 +145,7 @@ var ReactTestUtils = {
       ReactTestUtils.isCompositeComponent(inst),
       'findAllInRenderedTree(...): instance must be a composite component',
     );
-    var internalInstance = ReactInstanceMap.get(inst);
+    const internalInstance = ReactInstanceMap.get(inst);
     return findAllInRenderedFiberTreeInternal(internalInstance, test);
   },
 
@@ -157,12 +157,12 @@ var ReactTestUtils = {
   scryRenderedDOMComponentsWithClass: function(root, classNames) {
     return ReactTestUtils.findAllInRenderedTree(root, function(inst) {
       if (ReactTestUtils.isDOMComponent(inst)) {
-        var className = inst.className;
+        let className = inst.className;
         if (typeof className !== 'string') {
           // SVG, probably.
           className = inst.getAttribute('class') || '';
         }
-        var classList = className.split(/\s+/);
+        const classList = className.split(/\s+/);
 
         if (!Array.isArray(classNames)) {
           invariant(
@@ -187,7 +187,7 @@ var ReactTestUtils = {
    * @return {!ReactDOMComponent} The one match.
    */
   findRenderedDOMComponentWithClass: function(root, className) {
-    var all = ReactTestUtils.scryRenderedDOMComponentsWithClass(
+    const all = ReactTestUtils.scryRenderedDOMComponentsWithClass(
       root,
       className,
     );
@@ -224,7 +224,7 @@ var ReactTestUtils = {
    * @return {!ReactDOMComponent} The one match.
    */
   findRenderedDOMComponentWithTag: function(root, tagName) {
-    var all = ReactTestUtils.scryRenderedDOMComponentsWithTag(root, tagName);
+    const all = ReactTestUtils.scryRenderedDOMComponentsWithTag(root, tagName);
     if (all.length !== 1) {
       throw new Error(
         'Did not find exactly one match (found: ' +
@@ -254,7 +254,7 @@ var ReactTestUtils = {
    * @return {!ReactComponent} The one match.
    */
   findRenderedComponentWithType: function(root, componentType) {
-    var all = ReactTestUtils.scryRenderedComponentsWithType(
+    const all = ReactTestUtils.scryRenderedComponentsWithType(
       root,
       componentType,
     );
@@ -356,17 +356,17 @@ function makeSimulator(eventType) {
         'a component instance. Pass the DOM node you wish to simulate the event on instead.',
     );
 
-    var dispatchConfig =
+    const dispatchConfig =
       EventPluginRegistry.eventNameDispatchConfigs[eventType];
 
-    var fakeNativeEvent = new Event();
+    const fakeNativeEvent = new Event();
     fakeNativeEvent.target = domNode;
     fakeNativeEvent.type = eventType.toLowerCase();
 
     // We don't use SyntheticEvent.getPooled in order to not have to worry about
     // properly destroying any properties assigned from `eventData` upon release
-    var targetInst = ReactDOMComponentTree.getInstanceFromNode(domNode);
-    var event = new SyntheticEvent(
+    const targetInst = ReactDOMComponentTree.getInstanceFromNode(domNode);
+    const event = new SyntheticEvent(
       dispatchConfig,
       targetInst,
       fakeNativeEvent,
@@ -398,7 +398,7 @@ function makeSimulator(eventType) {
 function buildSimulators() {
   ReactTestUtils.Simulate = {};
 
-  var eventType;
+  let eventType;
   for (eventType in EventPluginRegistry.eventNameDispatchConfigs) {
     /**
      * @param {!Element|ReactDOMComponent} domComponentOrNode
@@ -409,12 +409,13 @@ function buildSimulators() {
 }
 
 // Rebuild ReactTestUtils.Simulate whenever event plugins are injected
-var oldInjectEventPluginOrder = EventPluginHub.injection.injectEventPluginOrder;
+const oldInjectEventPluginOrder =
+  EventPluginHub.injection.injectEventPluginOrder;
 EventPluginHub.injection.injectEventPluginOrder = function() {
   oldInjectEventPluginOrder.apply(this, arguments);
   buildSimulators();
 };
-var oldInjectEventPlugins = EventPluginHub.injection.injectEventPluginsByName;
+const oldInjectEventPlugins = EventPluginHub.injection.injectEventPluginsByName;
 EventPluginHub.injection.injectEventPluginsByName = function() {
   oldInjectEventPlugins.apply(this, arguments);
   buildSimulators();
@@ -440,7 +441,7 @@ buildSimulators();
 
 function makeNativeSimulator(eventType) {
   return function(domComponentOrNode, nativeEventData) {
-    var fakeNativeEvent = new Event(eventType);
+    const fakeNativeEvent = new Event(eventType);
     Object.assign(fakeNativeEvent, nativeEventData);
     if (ReactTestUtils.isDOMComponent(domComponentOrNode)) {
       ReactTestUtils.simulateNativeEventOnDOMComponent(
@@ -461,7 +462,7 @@ function makeNativeSimulator(eventType) {
 
 Object.keys(topLevelTypes).forEach(function(eventType) {
   // Event type is stored as 'topClick' - we transform that to 'click'
-  var convenienceName =
+  const convenienceName =
     eventType.indexOf('top') === 0
       ? eventType.charAt(3).toLowerCase() + eventType.substr(4)
       : eventType;
diff --git a/packages/react-dom/test-utils.js b/packages/react-dom/test-utils.js
index ba1bf89332cc5..8c34241eafb11 100644
--- a/packages/react-dom/test-utils.js
+++ b/packages/react-dom/test-utils.js
@@ -9,7 +9,7 @@
 
 'use strict';
 
-var ReactTestUtils = require('./src/test-utils/ReactTestUtils');
+const ReactTestUtils = require('./src/test-utils/ReactTestUtils');
 
 // TODO: decide on the top-level export form.
 // This is hacky but makes it work with both Rollup and Jest.