@samitouri / QOS-React / commits / 5bd2321ae3

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

Raphael Amorim committed Dec 5, 2017 at 23:39 UTC 5bd2321ae3dd7d68ac02dee3c3f271e9d0ee8784

53 files changed +563 -536

packages/react-dom/index.fb.js

+1 -1

@@ -7,7 +7,7 @@

8 'use strict';

10 -var ReactDOMFB = require('./src/client/ReactDOMFB');

10 +const ReactDOMFB = require('./src/client/ReactDOMFB');

12 // TODO: decide on the top-level export form.

13 // This is hacky but makes it work with both Rollup and Jest.

packages/react-dom/index.js

+1 -1

@@ -9,7 +9,7 @@

10 'use strict';

12 -var ReactDOM = require('./src/client/ReactDOM');

12 +const ReactDOM = require('./src/client/ReactDOM');

14 // TODO: decide on the top-level export form.

15 // This is hacky but makes it work with both Rollup and Jest.

packages/react-dom/server.browser.js

+1 -1

@@ -9,7 +9,7 @@

10 'use strict';

12 -var ReactDOMServer = require('./src/server/ReactDOMServerBrowser');

12 +const ReactDOMServer = require('./src/server/ReactDOMServerBrowser');

14 // TODO: decide on the top-level export form.

15 // This is hacky but makes it work with both Rollup and Jest

packages/react-dom/server.node.js

+1 -1

@@ -9,7 +9,7 @@

10 'use strict';

12 -var ReactDOMServer = require('./src/server/ReactDOMServerNode');

12 +const ReactDOMServer = require('./src/server/ReactDOMServerNode');

14 // TODO: decide on the top-level export form.

15 // This is hacky but makes it work with both Rollup and Jest

packages/react-dom/src/__tests__/ReactDOM-test.js

+5 -5

@@ -18,9 +18,9 @@ describe('ReactDOM', () => {

18 // supports real submit events.

19 /*

20 it('should bubble onSubmit', function() {

21 - var count = 0;

22 - var form;

23 - var Parent = React.createClass({

21 + const count = 0;

22 + const form;

23 + const Parent = React.createClass({

24 handleSubmit: function() {

25 count++;

26 return false;

@@ -29,7 +29,7 @@ describe('ReactDOM', () => {

29 return <Child />;

30 }

31 });

32 - var Child = React.createClass({

32 + const Child = React.createClass({

33 render: function() {

34 return <form><input type="submit" value="Submit" /></form>;

35 },

@@ -37,7 +37,7 @@ describe('ReactDOM', () => {

37 form = ReactDOM.findDOMNode(this);

38 }

39 });

40 - var instance = ReactTestUtils.renderIntoDocument(<Parent />);

40 + const instance = ReactTestUtils.renderIntoDocument(<Parent />);

41 form.submit();

42 expect(count).toEqual(1);

43 });

packages/react-dom/src/__tests__/ReactDOMInput-test.js

+24 -24

@@ -258,8 +258,8 @@ describe('ReactDOMInput', () => {

258 }

259 }

260

261 - var stub = ReactTestUtils.renderIntoDocument(<Stub />);

262 - var node = ReactDOM.findDOMNode(stub);

261 + const stub = ReactTestUtils.renderIntoDocument(<Stub />);

262 + const node = ReactDOM.findDOMNode(stub);

263 stub.setState({value: 0});

264

265 expect(node.value).toEqual('0');

@@ -628,36 +628,36 @@ describe('ReactDOMInput', () => {

628 });

629

630 it('should properly transition a text input from 0 to an empty 0.0', function() {

631 - var container = document.createElement('div');

631 + const container = document.createElement('div');

632

633 ReactDOM.render(<input type="text" value={0} />, container);

634 ReactDOM.render(<input type="text" value="0.0" />, container);

635

636 - var node = container.firstChild;

636 + const node = container.firstChild;

637

638 expect(node.value).toBe('0.0');

639 expect(node.defaultValue).toBe('0.0');

640 });

641

642 it('should properly transition a number input from "" to 0', function() {

643 - var container = document.createElement('div');

643 + const container = document.createElement('div');

644

645 ReactDOM.render(<input type="number" value="" />, container);

646 ReactDOM.render(<input type="number" value={0} />, container);

647

648 - var node = container.firstChild;

648 + const node = container.firstChild;

649

650 expect(node.value).toBe('0');

651 expect(node.defaultValue).toBe('0');

652 });

653

654 it('should properly transition a number input from "" to "0"', function() {

655 - var container = document.createElement('div');

655 + const container = document.createElement('div');

656

657 ReactDOM.render(<input type="number" value="" />, container);

658 ReactDOM.render(<input type="number" value="0" />, container);

659

660 - var node = container.firstChild;

660 + const node = container.firstChild;

661

662 expect(node.value).toBe('0');

663 expect(node.defaultValue).toBe('0');

@@ -1644,12 +1644,12 @@ describe('ReactDOMInput', () => {

1644 describe('When given a Symbol value', function() {

1645 it('treats initial Symbol value as an empty string', function() {

1646 spyOnDev(console, 'error');

1647 - var container = document.createElement('div');

1647 + const container = document.createElement('div');

1648 ReactDOM.render(

1649 <input value={Symbol('foobar')} onChange={() => {}} />,

1650 container,

1651 );

1652 - var node = container.firstChild;

1652 + const node = container.firstChild;

1653

1654 expect(node.value).toBe('');

1655 expect(node.getAttribute('value')).toBe('');

@@ -1664,13 +1664,13 @@ describe('ReactDOMInput', () => {

1664

1665 it('treats updated Symbol value as an empty string', function() {

1666 spyOnDev(console, 'error');

1667 - var container = document.createElement('div');

1667 + const container = document.createElement('div');

1668 ReactDOM.render(<input value="foo" onChange={() => {}} />, container);

1669 ReactDOM.render(

1670 <input value={Symbol('foobar')} onChange={() => {}} />,

1671 container,

1672 );

1673 - var node = container.firstChild;

1673 + const node = container.firstChild;

1674

1675 expect(node.value).toBe('');

1676 expect(node.getAttribute('value')).toBe('');

@@ -1684,9 +1684,9 @@ describe('ReactDOMInput', () => {

1684 });

1685

1686 it('treats initial Symbol defaultValue as an empty string', function() {

1687 - var container = document.createElement('div');

1687 + const container = document.createElement('div');

1688 ReactDOM.render(<input defaultValue={Symbol('foobar')} />, container);

1689 - var node = container.firstChild;

1689 + const node = container.firstChild;

1690

1691 expect(node.value).toBe('');

1692 expect(node.getAttribute('value')).toBe('');

@@ -1694,10 +1694,10 @@ describe('ReactDOMInput', () => {

1694 });

1695

1696 it('treats updated Symbol defaultValue as an empty string', function() {

1697 - var container = document.createElement('div');

1697 + const container = document.createElement('div');

1698 ReactDOM.render(<input defaultValue="foo" />, container);

1699 ReactDOM.render(<input defaultValue={Symbol('foobar')} />, container);

1700 - var node = container.firstChild;

1700 + const node = container.firstChild;

1701

1702 expect(node.value).toBe('foo');

1703 expect(node.getAttribute('value')).toBe('');

@@ -1708,12 +1708,12 @@ describe('ReactDOMInput', () => {

1708 describe('When given a function value', function() {

1709 it('treats initial function value as an empty string', function() {

1710 spyOnDev(console, 'error');

1711 - var container = document.createElement('div');

1711 + const container = document.createElement('div');

1712 ReactDOM.render(

1713 <input value={() => {}} onChange={() => {}} />,

1714 container,

1715 );

1716 - var node = container.firstChild;

1716 + const node = container.firstChild;

1717

1718 expect(node.value).toBe('');

1719 expect(node.getAttribute('value')).toBe('');

@@ -1728,13 +1728,13 @@ describe('ReactDOMInput', () => {

1728

1729 it('treats updated function value as an empty string', function() {

1730 spyOnDev(console, 'error');

1731 - var container = document.createElement('div');

1731 + const container = document.createElement('div');

1732 ReactDOM.render(<input value="foo" onChange={() => {}} />, container);

1733 ReactDOM.render(

1734 <input value={() => {}} onChange={() => {}} />,

1735 container,

1736 );

1737 - var node = container.firstChild;

1737 + const node = container.firstChild;

1738

1739 expect(node.value).toBe('');

1740 expect(node.getAttribute('value')).toBe('');

@@ -1748,9 +1748,9 @@ describe('ReactDOMInput', () => {

1748 });

1749

1750 it('treats initial function defaultValue as an empty string', function() {

1751 - var container = document.createElement('div');

1751 + const container = document.createElement('div');

1752 ReactDOM.render(<input defaultValue={() => {}} />, container);

1753 - var node = container.firstChild;

1753 + const node = container.firstChild;

1754

1755 expect(node.value).toBe('');

1756 expect(node.getAttribute('value')).toBe('');

@@ -1758,10 +1758,10 @@ describe('ReactDOMInput', () => {

1758 });

1759

1760 it('treats updated function defaultValue as an empty string', function() {

1761 - var container = document.createElement('div');

1761 + const container = document.createElement('div');

1762 ReactDOM.render(<input defaultValue="foo" />, container);

1763 ReactDOM.render(<input defaultValue={() => {}} />, container);

1764 - var node = container.firstChild;

1764 + const node = container.firstChild;

1765

1766 expect(node.value).toBe('foo');

1767 expect(node.getAttribute('value')).toBe('');

packages/react-dom/src/client/DOMPropertyOperations.js

+13 -13

@@ -17,11 +17,11 @@ import warning from 'fbjs/lib/warning';

18 // isAttributeNameSafe() is currently duplicated in DOMMarkupOperations.

19 // TODO: Find a better place for this.

20 -var VALID_ATTRIBUTE_NAME_REGEX = new RegExp(

20 +const VALID_ATTRIBUTE_NAME_REGEX = new RegExp(

21 '^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$',

22 );

23 -var illegalAttributeNameCache = {};

24 -var validatedAttributeNameCache = {};

23 +const illegalAttributeNameCache = {};

24 +const validatedAttributeNameCache = {};

25 function isAttributeNameSafe(attributeName) {

26 if (validatedAttributeNameCache.hasOwnProperty(attributeName)) {

27 return true;

@@ -71,18 +71,18 @@ export function setAttributeForRoot(node) {

71 */

72 export function getValueForProperty(node, name, expected) {

73 if (__DEV__) {

74 - var propertyInfo = getPropertyInfo(name);

74 + const propertyInfo = getPropertyInfo(name);

75 if (propertyInfo) {

76 if (propertyInfo.mustUseProperty) {

77 return node[propertyInfo.propertyName];

78 } else {

79 - var attributeName = propertyInfo.attributeName;

79 + const attributeName = propertyInfo.attributeName;

81 - var stringValue = null;

81 + let stringValue = null;

83 if (propertyInfo.hasOverloadedBooleanValue) {

84 if (node.hasAttribute(attributeName)) {

85 - var value = node.getAttribute(attributeName);

85 + const value = node.getAttribute(attributeName);

86 if (value === '') {

87 return true;

88 }

@@ -137,7 +137,7 @@ export function getValueForAttribute(node, name, expected) {

137 if (!node.hasAttribute(name)) {

138 return expected === undefined ? undefined : null;

139 }

140 - var value = node.getAttribute(name);

140 + const value = node.getAttribute(name);

141 if (value === '' + expected) {

142 return expected;

143 }

@@ -153,7 +153,7 @@ export function getValueForAttribute(node, name, expected) {

153 * @param {*} value

154 */

155 export function setValueForProperty(node, name, value) {

156 - var propertyInfo = getPropertyInfo(name);

156 + const propertyInfo = getPropertyInfo(name);

157

158 if (propertyInfo && shouldSetAttribute(name, value)) {

159 if (shouldIgnoreValue(propertyInfo, value)) {

@@ -164,8 +164,8 @@ export function setValueForProperty(node, name, value) {

164 // `toString`ed by IE8/9.

165 node[propertyInfo.propertyName] = value;

166 } else {

167 - var attributeName = propertyInfo.attributeName;

168 - var namespace = propertyInfo.attributeNamespace;

167 + const attributeName = propertyInfo.attributeName;

168 + const namespace = propertyInfo.attributeNamespace;

169 // `setAttribute` with objects becomes only `[object]` in IE8/9,

170 // ('' + value) makes it output the correct toString()-value.

171 if (namespace) {

@@ -217,10 +217,10 @@ export function deleteValueForAttribute(node, name) {

217 * @param {string} name

218 */

219 export function deleteValueForProperty(node, name) {

220 - var propertyInfo = getPropertyInfo(name);

220 + const propertyInfo = getPropertyInfo(name);

221 if (propertyInfo) {

222 if (propertyInfo.mustUseProperty) {

223 - var propName = propertyInfo.propertyName;

223 + const propName = propertyInfo.propertyName;

224 if (propertyInfo.hasBooleanValue) {

225 node[propName] = false;

226 } else {

packages/react-dom/src/client/ReactDOM.js

+7 -3

@@ -72,8 +72,12 @@ const {

72 const {updatedAncestorInfo} = validateDOMNesting;

73 const {precacheFiberNode, updateFiberProps} = ReactDOMComponentTree;

75 +let SUPPRESS_HYDRATION_WARNING;

76 +let topLevelUpdateWarnings;

77 +let warnOnInvalidCallback;

78 +

79 if (__DEV__) {

76 - var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';

80 + SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';

81 if (

82 typeof Map !== 'function' ||

83 Map.prototype == null ||

@@ -90,7 +94,7 @@ if (__DEV__) {

94 );

95 }

93 - var topLevelUpdateWarnings = (container: DOMContainer) => {

97 + topLevelUpdateWarnings = (container: DOMContainer) => {

98 if (__DEV__) {

99 if (

100 container._reactRootContainer &&

@@ -137,7 +141,7 @@ if (__DEV__) {

141 }

142 };

143

140 - var warnOnInvalidCallback = function(callback: mixed, callerName: string) {

144 + warnOnInvalidCallback = function(callback: mixed, callerName: string) {

145 warning(

146 callback === null || typeof callback === 'function',

147 '%s(...): Expected the last optional `callback` argument to be a ' +

packages/react-dom/src/client/ReactDOMFiberComponent.js

+85 -69

@@ -32,29 +32,41 @@ import {validateProperties as validateARIAProperties} from '../shared/ReactDOMIn

32 import {validateProperties as validateInputProperties} from '../shared/ReactDOMNullInputValuePropHook';

33 import {validateProperties as validateUnknownProperties} from '../shared/ReactDOMUnknownPropertyHook';

35 -var {

35 +const {

36 getCurrentFiberOwnerName,

37 getCurrentFiberStackAddendum,

38 } = ReactDebugCurrentFiber;

39 -var didWarnInvalidHydration = false;

40 -var didWarnShadyDOM = false;

39 +let didWarnInvalidHydration = false;

40 +let didWarnShadyDOM = false;

42 -var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';

43 -var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';

44 -var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';

45 -var AUTOFOCUS = 'autoFocus';

46 -var CHILDREN = 'children';

47 -var STYLE = 'style';

48 -var HTML = '__html';

42 +const DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';

43 +const SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';

44 +const SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';

45 +const AUTOFOCUS = 'autoFocus';

46 +const CHILDREN = 'children';

47 +const STYLE = 'style';

48 +const HTML = '__html';

50 -var {html: HTML_NAMESPACE} = Namespaces;

50 +const {html: HTML_NAMESPACE} = Namespaces;

52 -var getStack = emptyFunction.thatReturns('');

52 +let getStack = emptyFunction.thatReturns('');

53 +

54 +let warnedUnknownTags;

55 +let suppressHydrationWarning;

56 +

57 +let validatePropertiesInDevelopment;

58 +let warnForTextDifference;

59 +let warnForPropDifference;

60 +let warnForExtraAttributes;

61 +let warnForInvalidEventListener;

62 +

63 +let normalizeMarkupForTextOrAttribute;

64 +let normalizeHTML;

66 if (__DEV__) {

67 getStack = getCurrentFiberStackAddendum;

57 - var warnedUnknownTags = {

69 + warnedUnknownTags = {

70 // Chrome is the only major browser not shipping <time>. But as of July

71 // 2017 it intends to ship it due to widespread usage. We intentionally

72 // *don't* warn for <time> even if it's unrecognized by Chrome because

@@ -64,7 +76,7 @@ if (__DEV__) {

76 dialog: true,

77 };

67 - var validatePropertiesInDevelopment = function(type, props) {

79 + validatePropertiesInDevelopment = function(type, props) {

80 validateARIAProperties(type, props);

81 validateInputProperties(type, props);

82 validateUnknownProperties(type, props, /* canUseEventSystem */ true);

@@ -75,10 +87,10 @@ if (__DEV__) {

87 // https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream

88 // If we have a mismatch, it might be caused by that.

89 // We will still patch up in this case but not fire the warning.

78 - var NORMALIZE_NEWLINES_REGEX = /\r\n?/g;

79 - var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;

90 + const NORMALIZE_NEWLINES_REGEX = /\r\n?/g;

91 + const NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;

81 - var normalizeMarkupForTextOrAttribute = function(markup: mixed): string {

93 + normalizeMarkupForTextOrAttribute = function(markup: mixed): string {

94 const markupString =

95 typeof markup === 'string' ? markup : '' + (markup: any);

96 return markupString

@@ -86,7 +98,7 @@ if (__DEV__) {

98 .replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, '');

99 };

100

89 - var warnForTextDifference = function(

101 + warnForTextDifference = function(

102 serverText: string,

103 clientText: string | number,

104 ) {

@@ -107,7 +119,7 @@ if (__DEV__) {

119 );

120 };

121

110 - var warnForPropDifference = function(

122 + warnForPropDifference = function(

123 propName: string,

124 serverValue: mixed,

125 clientValue: mixed,

@@ -134,19 +146,19 @@ if (__DEV__) {

146 );

147 };

148

137 - var warnForExtraAttributes = function(attributeNames: Set<string>) {

149 + warnForExtraAttributes = function(attributeNames: Set<string>) {

150 if (didWarnInvalidHydration) {

151 return;

152 }

153 didWarnInvalidHydration = true;

142 - var names = [];

154 + const names = [];

155 attributeNames.forEach(function(name) {

156 names.push(name);

157 });

158 warning(false, 'Extra attributes from the server: %s', names);

159 };

160

149 - var warnForInvalidEventListener = function(registrationName, listener) {

161 + warnForInvalidEventListener = function(registrationName, listener) {

162 if (listener === false) {

163 warning(

164 false,

@@ -171,12 +183,12 @@ if (__DEV__) {

183

184 // Parse the HTML and read it back to normalize the HTML string so that it

185 // can be used for comparison.

174 - var normalizeHTML = function(parent: Element, html: string) {

186 + normalizeHTML = function(parent: Element, html: string) {

187 // We could have created a separate document here to avoid

188 // re-initializing custom elements if they exist. But this breaks

189 // how <noscript> is being handled. So we use the same document.

190 // See the discussion in https://github.com/facebook/react/pull/11157.

179 - var testElement =

191 + const testElement =

192 parent.namespaceURI === HTML_NAMESPACE

193 ? parent.ownerDocument.createElement(parent.tagName)

194 : parent.ownerDocument.createElementNS(

@@ -189,10 +201,10 @@ if (__DEV__) {

201 }

202

203 function ensureListeningTo(rootContainerElement, registrationName) {

192 - var isDocumentOrFragment =

204 + const isDocumentOrFragment =

205 rootContainerElement.nodeType === DOCUMENT_NODE ||

206 rootContainerElement.nodeType === DOCUMENT_FRAGMENT_NODE;

195 - var doc = isDocumentOrFragment

207 + const doc = isDocumentOrFragment

208 ? rootContainerElement

209 : rootContainerElement.ownerDocument;

210 listenTo(registrationName, doc);

@@ -208,7 +220,7 @@ function getOwnerDocumentFromRootContainer(

220

221 // There are so many media events, it makes sense to just

222 // maintain a list rather than create a `trapBubbledEvent` for each

211 -var mediaEvents = {

223 +const mediaEvents = {

224 topAbort: 'abort',

225 topCanPlay: 'canplay',

226 topCanPlayThrough: 'canplaythrough',

@@ -254,11 +266,11 @@ function setInitialDOMProperties(

266 nextProps: Object,

267 isCustomComponentTag: boolean,

268 ): void {

257 - for (var propKey in nextProps) {

269 + for (const propKey in nextProps) {

270 if (!nextProps.hasOwnProperty(propKey)) {

271 continue;

272 }

261 - var nextProp = nextProps[propKey];

273 + const nextProp = nextProps[propKey];

274 if (propKey === STYLE) {

275 if (__DEV__) {

276 if (nextProp) {

@@ -270,7 +282,7 @@ function setInitialDOMProperties(

282 // Relies on `updateStylesByID` not mutating `styleUpdates`.

283 CSSPropertyOperations.setValueForStyles(domElement, nextProp, getStack);

284 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {

273 - var nextHtml = nextProp ? nextProp[HTML] : undefined;

285 + const nextHtml = nextProp ? nextProp[HTML] : undefined;

286 if (nextHtml != null) {

287 setInnerHTML(domElement, nextHtml);

288 }

@@ -280,7 +292,7 @@ function setInitialDOMProperties(

292 // textContent on a <textarea> will cause the placeholder to not

293 // show within the <textarea> until it has been focused and blurred again.

294 // https://github.com/facebook/react/issues/6731#issuecomment-254874553

283 - var canSetTextContent = tag !== 'textarea' || nextProp !== '';

295 + const canSetTextContent = tag !== 'textarea' || nextProp !== '';

296 if (canSetTextContent) {

297 setTextContent(domElement, nextProp);

298 }

@@ -320,9 +332,9 @@ function updateDOMProperties(

332 isCustomComponentTag: boolean,

333 ): void {

334 // TODO: Handle wasCustomComponentTag

323 - for (var i = 0; i < updatePayload.length; i += 2) {

324 - var propKey = updatePayload[i];

325 - var propValue = updatePayload[i + 1];

335 + for (let i = 0; i < updatePayload.length; i += 2) {

336 + const propKey = updatePayload[i];

337 + const propValue = updatePayload[i + 1];

338 if (propKey === STYLE) {

339 CSSPropertyOperations.setValueForStyles(domElement, propValue, getStack);

340 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {

@@ -356,19 +368,21 @@ export function createElement(

368 rootContainerElement: Element | Document,

369 parentNamespace: string,

370 ): Element {

371 + let isCustomComponentTag;

372 +

373 // We create tags in the namespace of their parent container, except HTML

374 // tags get no namespace.

361 - var ownerDocument: Document = getOwnerDocumentFromRootContainer(

375 + const ownerDocument: Document = getOwnerDocumentFromRootContainer(

376 rootContainerElement,

377 );

364 - var domElement: Element;

365 - var namespaceURI = parentNamespace;

378 + let domElement: Element;

379 + let namespaceURI = parentNamespace;

380 if (namespaceURI === HTML_NAMESPACE) {

381 namespaceURI = getIntrinsicNamespace(type);

382 }

383 if (namespaceURI === HTML_NAMESPACE) {

384 if (__DEV__) {

371 - var isCustomComponentTag = isCustomComponent(type, props);

385 + isCustomComponentTag = isCustomComponent(type, props);

386 // Should this check be gated by parent namespace? Not sure we want to

387 // allow <SVG> or <mATH>.

388 warning(

@@ -382,10 +396,10 @@ export function createElement(

396 if (type === 'script') {

397 // Create the script via .innerHTML so its "parser-inserted" flag is

398 // set to true and it does not execute

385 - var div = ownerDocument.createElement('div');

399 + const div = ownerDocument.createElement('div');

400 div.innerHTML = '<script><' + '/script>'; // eslint-disable-line

401 // This is guaranteed to yield a script element.

388 - var firstChild = ((div.firstChild: any): HTMLScriptElement);

402 + const firstChild = ((div.firstChild: any): HTMLScriptElement);

403 domElement = div.removeChild(firstChild);

404 } else if (typeof props.is === 'string') {

405 // $FlowIssue `createElement` should be updated for Web Components

@@ -438,7 +452,7 @@ export function setInitialProperties(

452 rawProps: Object,

453 rootContainerElement: Element | Document,

454 ): void {

441 - var isCustomComponentTag = isCustomComponent(tag, rawProps);

455 + const isCustomComponentTag = isCustomComponent(tag, rawProps);

456 if (__DEV__) {

457 validatePropertiesInDevelopment(tag, rawProps);

458 if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) {

@@ -453,7 +467,7 @@ export function setInitialProperties(

467 }

468

469 // TODO: Make sure that we check isMounted before firing any of these events.

456 - var props: Object;

470 + let props: Object;

471 switch (tag) {

472 case 'iframe':

473 case 'object':

@@ -463,7 +477,7 @@ export function setInitialProperties(

477 case 'video':

478 case 'audio':

479 // Create listener for each media event

466 - for (var event in mediaEvents) {

480 + for (const event in mediaEvents) {

481 if (mediaEvents.hasOwnProperty(event)) {

482 trapBubbledEvent(event, mediaEvents[event], domElement);

483 }

@@ -571,10 +585,10 @@ export function diffProperties(

585 validatePropertiesInDevelopment(tag, nextRawProps);

586 }

587

574 - var updatePayload: null | Array<any> = null;

588 + let updatePayload: null | Array<any> = null;

589

576 - var lastProps: Object;

577 - var nextProps: Object;

590 + let lastProps: Object;

591 + let nextProps: Object;

592 switch (tag) {

593 case 'input':

594 lastProps = ReactDOMFiberInput.getHostProps(domElement, lastRawProps);

@@ -611,9 +625,9 @@ export function diffProperties(

625

626 assertValidProps(tag, nextProps, getStack);

627

614 - var propKey;

615 - var styleName;

616 - var styleUpdates = null;

628 + let propKey;

629 + let styleName;

630 + let styleUpdates = null;

631 for (propKey in lastProps) {

632 if (

633 nextProps.hasOwnProperty(propKey) ||

@@ -623,7 +637,7 @@ export function diffProperties(

637 continue;

638 }

639 if (propKey === STYLE) {

626 - var lastStyle = lastProps[propKey];

640 + const lastStyle = lastProps[propKey];

641 for (styleName in lastStyle) {

642 if (lastStyle.hasOwnProperty(styleName)) {

643 if (!styleUpdates) {

@@ -655,8 +669,8 @@ export function diffProperties(

669 }

670 }

671 for (propKey in nextProps) {

658 - var nextProp = nextProps[propKey];

659 - var lastProp = lastProps != null ? lastProps[propKey] : undefined;

672 + const nextProp = nextProps[propKey];

673 + const lastProp = lastProps != null ? lastProps[propKey] : undefined;

674 if (

675 !nextProps.hasOwnProperty(propKey) ||

676 nextProp === lastProp ||

@@ -708,8 +722,8 @@ export function diffProperties(

722 styleUpdates = nextProp;

723 }

724 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {

711 - var nextHtml = nextProp ? nextProp[HTML] : undefined;

712 - var lastHtml = lastProp ? lastProp[HTML] : undefined;

725 + const nextHtml = nextProp ? nextProp[HTML] : undefined;

726 + const lastHtml = lastProp ? lastProp[HTML] : undefined;

727 if (nextHtml != null) {

728 if (lastHtml !== nextHtml) {

729 (updatePayload = updatePayload || []).push(propKey, '' + nextHtml);

@@ -775,8 +789,8 @@ export function updateProperties(

789 ReactDOMFiberInput.updateChecked(domElement, nextRawProps);

790 }

791

778 - var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);

779 - var isCustomComponentTag = isCustomComponent(tag, nextRawProps);

792 + const wasCustomComponentTag = isCustomComponent(tag, lastRawProps);

793 + const isCustomComponentTag = isCustomComponent(tag, nextRawProps);

794 // Apply the diff.

795 updateDOMProperties(

796 domElement,

@@ -812,10 +826,12 @@ export function diffHydratedProperties(

826 parentNamespace: string,

827 rootContainerElement: Element | Document,

828 ): null | Array<mixed> {

829 + let isCustomComponentTag;

830 + let extraAttributeNames: Set<string>;

831 +

832 if (__DEV__) {

816 - var suppressHydrationWarning =

817 - rawProps[SUPPRESS_HYDRATION_WARNING] === true;

818 - var isCustomComponentTag = isCustomComponent(tag, rawProps);

833 + suppressHydrationWarning = rawProps[SUPPRESS_HYDRATION_WARNING] === true;

834 + isCustomComponentTag = isCustomComponent(tag, rawProps);

835 validatePropertiesInDevelopment(tag, rawProps);

836 if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) {

837 warning(

@@ -837,7 +853,7 @@ export function diffHydratedProperties(

853 case 'video':

854 case 'audio':

855 // Create listener for each media event

840 - for (var event in mediaEvents) {

856 + for (const event in mediaEvents) {

857 if (mediaEvents.hasOwnProperty(event)) {

858 trapBubbledEvent(event, mediaEvents[event], domElement);

859 }

@@ -887,10 +903,10 @@ export function diffHydratedProperties(

903 assertValidProps(tag, rawProps, getStack);

904

905 if (__DEV__) {

890 - var extraAttributeNames: Set<string> = new Set();

891 - var attributes = domElement.attributes;

892 - for (var i = 0; i < attributes.length; i++) {

893 - var name = attributes[i].name.toLowerCase();

906 + extraAttributeNames = new Set();

907 + const attributes = domElement.attributes;

908 + for (let i = 0; i < attributes.length; i++) {

909 + const name = attributes[i].name.toLowerCase();

910 switch (name) {

911 // Built-in SSR attribute is whitelisted

912 case 'data-reactroot':

@@ -911,12 +927,12 @@ export function diffHydratedProperties(

927 }

928 }

929

914 - var updatePayload = null;

915 - for (var propKey in rawProps) {

930 + let updatePayload = null;

931 + for (const propKey in rawProps) {

932 if (!rawProps.hasOwnProperty(propKey)) {

933 continue;

934 }

919 - var nextProp = rawProps[propKey];

935 + const nextProp = rawProps[propKey];

936 if (propKey === CHILDREN) {

937 // For text content children we compare against textContent. This

938 // might match additional HTML that is hidden when we read it using

@@ -951,8 +967,8 @@ export function diffHydratedProperties(

967 }

968 } else if (__DEV__) {

969 // Validate that the properties correspond to their expected values.

954 - var serverValue;

955 - var propertyInfo;

970 + let serverValue;

971 + let propertyInfo;

972 if (suppressHydrationWarning) {

973 // Don't bother comparing. We're ignoring all these warnings.

974 } else if (

packages/react-dom/src/client/ReactDOMFiberInput.js

+25 -25

@@ -25,17 +25,17 @@ type InputWithWrapperState = HTMLInputElement & {

25 },

26 };

28 -var {

28 +const {

29 getCurrentFiberOwnerName,

30 getCurrentFiberStackAddendum,

31 } = ReactDebugCurrentFiber;

32 -var didWarnValueDefaultValue = false;

33 -var didWarnCheckedDefaultChecked = false;

34 -var didWarnControlledToUncontrolled = false;

35 -var didWarnUncontrolledToControlled = false;

32 +let didWarnValueDefaultValue = false;

33 +let didWarnCheckedDefaultChecked = false;

34 +let didWarnControlledToUncontrolled = false;

35 +let didWarnUncontrolledToControlled = false;

37 function isControlled(props) {

38 - var usesChecked = props.type === 'checkbox' || props.type === 'radio';

38 + const usesChecked = props.type === 'checkbox' || props.type === 'radio';

39 return usesChecked ? props.checked != null : props.value != null;

40 }

@@ -57,10 +57,10 @@ function isControlled(props) {

57 */

59 export function getHostProps(element: Element, props: Object) {

60 - var node = ((element: any): InputWithWrapperState);

61 - var checked = props.checked;

60 + const node = ((element: any): InputWithWrapperState);

61 + const checked = props.checked;

63 - var hostProps = Object.assign({}, props, {

63 + const hostProps = Object.assign({}, props, {

64 defaultChecked: undefined,

65 defaultValue: undefined,

66 value: undefined,

@@ -116,8 +116,8 @@ export function initWrapperState(element: Element, props: Object) {

116 }

117 }

118

119 - var node = ((element: any): InputWithWrapperState);

120 - var defaultValue = props.defaultValue == null ? '' : props.defaultValue;

119 + const node = ((element: any): InputWithWrapperState);

120 + const defaultValue = props.defaultValue == null ? '' : props.defaultValue;

121

122 node._wrapperState = {

123 initialChecked:

@@ -130,17 +130,17 @@ export function initWrapperState(element: Element, props: Object) {

130 }

131

132 export function updateChecked(element: Element, props: Object) {

133 - var node = ((element: any): InputWithWrapperState);

134 - var checked = props.checked;

133 + const node = ((element: any): InputWithWrapperState);

134 + const checked = props.checked;

135 if (checked != null) {

136 DOMPropertyOperations.setValueForProperty(node, 'checked', checked);

137 }

138 }

139

140 export function updateWrapper(element: Element, props: Object) {

141 - var node = ((element: any): InputWithWrapperState);

141 + const node = ((element: any): InputWithWrapperState);

142 if (__DEV__) {

143 - var controlled = isControlled(props);

143 + const controlled = isControlled(props);

144

145 if (

146 !node._wrapperState.controlled &&

@@ -178,7 +178,7 @@ export function updateWrapper(element: Element, props: Object) {

178

179 updateChecked(element, props);

180

181 - var value = getSafeValue(props.value);

181 + const value = getSafeValue(props.value);

182

183 if (value != null) {

184 if (props.type === 'number') {

@@ -206,7 +206,7 @@ export function updateWrapper(element: Element, props: Object) {

206 }

207

208 export function postMountWrapper(element: Element, props: Object) {

209 - var node = ((element: any): InputWithWrapperState);

209 + const node = ((element: any): InputWithWrapperState);

210

211 if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {

212 // 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) {

226 // will sometimes influence the value of checked (even after detachment).

227 // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416

228 // We need to temporarily unset name to avoid disrupting radio button groups.

229 - var name = node.name;

229 + const name = node.name;

230 if (name !== '') {

231 node.name = '';

232 }

@@ -238,15 +238,15 @@ export function postMountWrapper(element: Element, props: Object) {

238 }

239

240 export function restoreControlledState(element: Element, props: Object) {

241 - var node = ((element: any): InputWithWrapperState);

241 + const node = ((element: any): InputWithWrapperState);

242 updateWrapper(node, props);

243 updateNamedCousins(node, props);

244 }

245

246 function updateNamedCousins(rootNode, props) {

247 - var name = props.name;

247 + const name = props.name;

248 if (props.type === 'radio' && name != null) {

249 - var queryRoot: Element = rootNode;

249 + let queryRoot: Element = rootNode;

250

251 while (queryRoot.parentNode) {

252 queryRoot = ((queryRoot.parentNode: any): Element);

@@ -259,12 +259,12 @@ function updateNamedCousins(rootNode, props) {

259 // the input might not even be in a form. It might not even be in the

260 // document. Let's just use the local `querySelectorAll` to ensure we don't

261 // miss anything.

262 - var group = queryRoot.querySelectorAll(

262 + const group = queryRoot.querySelectorAll(

263 'input[name=' + JSON.stringify('' + name) + '][type="radio"]',

264 );

265

266 - for (var i = 0; i < group.length; i++) {

267 - var otherNode = ((group[i]: any): HTMLInputElement);

266 + for (let i = 0; i < group.length; i++) {

267 + const otherNode = ((group[i]: any): HTMLInputElement);

268 if (otherNode === rootNode || otherNode.form !== rootNode.form) {

269 continue;

270 }

@@ -272,7 +272,7 @@ function updateNamedCousins(rootNode, props) {

272 // and the same name are rendered into the same form (same as #1939).

273 // That's probably okay; we don't support it just as we don't support

274 // mixing React radio buttons with non-React ones.

275 - var otherProps = getFiberCurrentPropsFromNode(otherNode);

275 + const otherProps = getFiberCurrentPropsFromNode(otherNode);

276 invariant(

277 otherProps,

278 'ReactDOMInput: Mixing React and non-React radio inputs with the ' +

packages/react-dom/src/client/ReactDOMFiberSelect.js

+20 -18

@@ -13,13 +13,15 @@ import warning from 'fbjs/lib/warning';

14 import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';

16 -var {

16 +const {

17 getCurrentFiberOwnerName,

18 getCurrentFiberStackAddendum,

19 } = ReactDebugCurrentFiber;

21 +let didWarnValueDefaultValue;

22 +

23 if (__DEV__) {

22 - var didWarnValueDefaultValue = false;

24 + didWarnValueDefaultValue = false;

25 }

27 type SelectWithWrapperState = HTMLSelectElement & {

@@ -30,14 +32,14 @@ type SelectWithWrapperState = HTMLSelectElement & {

32 };

34 function getDeclarationErrorAddendum() {

33 - var ownerName = getCurrentFiberOwnerName();

35 + const ownerName = getCurrentFiberOwnerName();

36 if (ownerName) {

37 return '\n\nCheck the render method of `' + ownerName + '`.';

38 }

39 return '';

40 }

40 -var valuePropNames = ['value', 'defaultValue'];

42 +const valuePropNames = ['value', 'defaultValue'];

44 /**

45 * Validation function for `value` and `defaultValue`.

@@ -49,12 +51,12 @@ function checkSelectPropTypes(props) {

51 getCurrentFiberStackAddendum,

52 );

52 - for (var i = 0; i < valuePropNames.length; i++) {

53 - var propName = valuePropNames[i];

54 + for (let i = 0; i < valuePropNames.length; i++) {

55 + const propName = valuePropNames[i];

56 if (props[propName] == null) {

57 continue;

58 }

57 - var isArray = Array.isArray(props[propName]);

59 + const isArray = Array.isArray(props[propName]);

60 if (props.multiple && !isArray) {

61 warning(

62 false,

@@ -84,7 +86,7 @@ function updateOptions(

86 type IndexableHTMLOptionsCollection = HTMLOptionsCollection & {

87 [key: number]: HTMLOptionElement,

88 };

87 - var options: IndexableHTMLOptionsCollection = node.options;

89 + const options: IndexableHTMLOptionsCollection = node.options;

91 if (multiple) {

92 let selectedValues = (propValue: Array<string>);

@@ -94,7 +96,7 @@ function updateOptions(

96 selectedValue['$' + selectedValues[i]] = true;

97 }

98 for (let i = 0; i < options.length; i++) {

97 - var selected = selectedValue.hasOwnProperty('$' + options[i].value);

99 + const selected = selectedValue.hasOwnProperty('$' + options[i].value);

100 if (options[i].selected !== selected) {

101 options[i].selected = selected;

102 }

@@ -148,12 +150,12 @@ export function getHostProps(element: Element, props: Object) {

150 }

151

152 export function initWrapperState(element: Element, props: Object) {

151 - var node = ((element: any): SelectWithWrapperState);

153 + const node = ((element: any): SelectWithWrapperState);

154 if (__DEV__) {

155 checkSelectPropTypes(props);

156 }

157

156 - var value = props.value;

158 + const value = props.value;

159 node._wrapperState = {

160 initialValue: value != null ? value : props.defaultValue,

161 wasMultiple: !!props.multiple,

@@ -179,9 +181,9 @@ export function initWrapperState(element: Element, props: Object) {

181 }

182

183 export function postMountWrapper(element: Element, props: Object) {

182 - var node = ((element: any): SelectWithWrapperState);

184 + const node = ((element: any): SelectWithWrapperState);

185 node.multiple = !!props.multiple;

184 - var value = props.value;

186 + const value = props.value;

187 if (value != null) {

188 updateOptions(node, !!props.multiple, value, false);

189 } else if (props.defaultValue != null) {

@@ -190,15 +192,15 @@ export function postMountWrapper(element: Element, props: Object) {

192 }

193

194 export function postUpdateWrapper(element: Element, props: Object) {

193 - var node = ((element: any): SelectWithWrapperState);

195 + const node = ((element: any): SelectWithWrapperState);

196 // After the initial mount, we control selected-ness manually so don't pass

197 // this value down

198 node._wrapperState.initialValue = undefined;

199

198 - var wasMultiple = node._wrapperState.wasMultiple;

200 + const wasMultiple = node._wrapperState.wasMultiple;

201 node._wrapperState.wasMultiple = !!props.multiple;

202

201 - var value = props.value;

203 + const value = props.value;

204 if (value != null) {

205 updateOptions(node, !!props.multiple, value, false);

206 } else if (wasMultiple !== !!props.multiple) {

@@ -213,8 +215,8 @@ export function postUpdateWrapper(element: Element, props: Object) {

215 }

216

217 export function restoreControlledState(element: Element, props: Object) {

216 - var node = ((element: any): SelectWithWrapperState);

217 - var value = props.value;

218 + const node = ((element: any): SelectWithWrapperState);

219 + const value = props.value;

220

221 if (value != null) {

222 updateOptions(node, !!props.multiple, value, false);

packages/react-dom/src/client/__tests__/getNodeForCharacterOffset-test.js

+8 -7

@@ -10,17 +10,18 @@

10 'use strict';

12 // TODO: can we express this test with only public API?

13 -var getNodeForCharacterOffset = require('../getNodeForCharacterOffset').default;

13 +const getNodeForCharacterOffset = require('../getNodeForCharacterOffset')

14 + .default;

16 // Create node from HTML string

17 function createNode(html) {

17 - var node = (getTestDocument() || document).createElement('div');

18 + const node = (getTestDocument() || document).createElement('div');

19 node.innerHTML = html;

20 return node;

21 }

23 function getTestDocument(markup) {

23 - var doc = document.implementation.createHTMLDocument('');

24 + const doc = document.implementation.createHTMLDocument('');

25 doc.open();

26 doc.write(

27 markup ||

@@ -38,21 +39,21 @@ function expectNodeOffset(result, textContent, nodeOffset) {

40 describe('getNodeForCharacterOffset', () => {

41 it('should handle siblings', () => {

41 - var node = createNode('<i>123</i><i>456</i><i>789</i>');

42 + const node = createNode('<i>123</i><i>456</i><i>789</i>');

44 expectNodeOffset(getNodeForCharacterOffset(node, 0), '123', 0);

45 expectNodeOffset(getNodeForCharacterOffset(node, 4), '456', 1);

46 });

48 it('should handle trailing chars', () => {

48 - var node = createNode('<i>123</i><i>456</i><i>789</i>');

49 + const node = createNode('<i>123</i><i>456</i><i>789</i>');

51 expectNodeOffset(getNodeForCharacterOffset(node, 3), '123', 3);

52 expectNodeOffset(getNodeForCharacterOffset(node, 9), '789', 3);

53 });

55 it('should handle trees', () => {

55 - var node = createNode(

56 + const node = createNode(

57 '<i>' +

58 '<i>1</i>' +

59 '<i>' +

@@ -74,7 +75,7 @@ describe('getNodeForCharacterOffset', () => {

75 });

77 it('should handle non-existent offset', () => {

77 - var node = createNode('<i>123</i>');

78 + const node = createNode('<i>123</i>');

80 expect(getNodeForCharacterOffset(node, -1)).toBeUndefined();

81 expect(getNodeForCharacterOffset(node, 4)).toBeUndefined();

packages/react-dom/src/events/BeforeInputEventPlugin.js

+23 -23

@@ -14,13 +14,13 @@ import * as FallbackCompositionState from './FallbackCompositionState';

14 import SyntheticCompositionEvent from './SyntheticCompositionEvent';

15 import SyntheticInputEvent from './SyntheticInputEvent';

17 -var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space

18 -var START_KEYCODE = 229;

17 +const END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space

18 +const START_KEYCODE = 229;

20 -var canUseCompositionEvent =

20 +const canUseCompositionEvent =

21 ExecutionEnvironment.canUseDOM && 'CompositionEvent' in window;

23 -var documentMode = null;

23 +let documentMode = null;

24 if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) {

25 documentMode = document.documentMode;

26 }

@@ -28,7 +28,7 @@ if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) {

28 // Webkit offers a very useful `textInput` event that can be used to

29 // directly represent `beforeInput`. The IE `textinput` event is not as

30 // useful, so we don't use it.

31 -var canUseTextInputEvent =

31 +const canUseTextInputEvent =

32 ExecutionEnvironment.canUseDOM &&

33 'TextEvent' in window &&

34 !documentMode &&

@@ -37,7 +37,7 @@ var canUseTextInputEvent =

37 // In IE9+, we have access to composition events, but the data supplied

38 // by the native compositionend event may be incorrect. Japanese ideographic

39 // spaces, for instance (\u3000) are not recorded correctly.

40 -var useFallbackCompositionData =

40 +const useFallbackCompositionData =

41 ExecutionEnvironment.canUseDOM &&

42 (!canUseCompositionEvent ||

43 (documentMode && documentMode > 8 && documentMode <= 11));

@@ -47,7 +47,7 @@ var useFallbackCompositionData =

47 * text input events. Rely on keypress instead.

48 */

49 function isPresto() {

50 - var opera = window.opera;

50 + const opera = window.opera;

51 return (

52 typeof opera === 'object' &&

53 typeof opera.version === 'function' &&

@@ -55,11 +55,11 @@ function isPresto() {

55 );

56 }

58 -var SPACEBAR_CODE = 32;

59 -var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);

58 +const SPACEBAR_CODE = 32;

59 +const SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);

61 // Events and their corresponding property names.

62 -var eventTypes = {

62 +const eventTypes = {

63 beforeInput: {

64 phasedRegistrationNames: {

65 bubbled: 'onBeforeInput',

@@ -117,7 +117,7 @@ var eventTypes = {

117 };

118

119 // Track whether we've ever handled a keypress on the space key.

120 -var hasSpaceKeypress = false;

120 +let hasSpaceKeypress = false;

121

122 /**

123 * Return whether a native keypress event is assumed to be a command.

@@ -197,7 +197,7 @@ function isFallbackCompositionEnd(topLevelType, nativeEvent) {

197 * @return {?string}

198 */

199 function getDataFromCustomEvent(nativeEvent) {

200 - var detail = nativeEvent.detail;

200 + const detail = nativeEvent.detail;

201 if (typeof detail === 'object' && 'data' in detail) {

202 return detail.data;

203 }

@@ -205,7 +205,7 @@ function getDataFromCustomEvent(nativeEvent) {

205 }

206

207 // Track the current IME composition status, if any.

208 -var isComposing = false;

208 +let isComposing = false;

209

210 /**

211 * @return {?object} A SyntheticCompositionEvent.

@@ -216,8 +216,8 @@ function extractCompositionEvent(

216 nativeEvent,

217 nativeEventTarget,

218 ) {

219 - var eventType;

220 - var fallbackData;

219 + let eventType;

220 + let fallbackData;

221

222 if (canUseCompositionEvent) {

223 eventType = getCompositionEventType(topLevelType);

@@ -245,7 +245,7 @@ function extractCompositionEvent(

245 }

246 }

247

248 - var event = SyntheticCompositionEvent.getPooled(

248 + const event = SyntheticCompositionEvent.getPooled(

249 eventType,

250 targetInst,

251 nativeEvent,

@@ -257,7 +257,7 @@ function extractCompositionEvent(

257 // This matches the property of native CompositionEventInterface.

258 event.data = fallbackData;

259 } else {

260 - var customData = getDataFromCustomEvent(nativeEvent);

260 + const customData = getDataFromCustomEvent(nativeEvent);

261 if (customData !== null) {

262 event.data = customData;

263 }

@@ -291,7 +291,7 @@ function getNativeBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {

291 * To avoid this issue, use the keypress event as if no `textInput`

292 * event is available.

293 */

294 - var which = nativeEvent.which;

294 + const which = nativeEvent.which;

295 if (which !== SPACEBAR_CODE) {

296 return null;

297 }

@@ -301,7 +301,7 @@ function getNativeBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {

301

302 case 'topTextInput':

303 // Record the characters to be added to the DOM.

304 - var chars = nativeEvent.data;

304 + const chars = nativeEvent.data;

305

306 // If it's a spacebar character, assume that we have already handled

307 // it at the keypress level and bail immediately. Android Chrome

@@ -337,7 +337,7 @@ function getFallbackBeforeInputChars(topLevelType: TopLevelTypes, nativeEvent) {

337 (!canUseCompositionEvent &&

338 isFallbackCompositionEnd(topLevelType, nativeEvent))

339 ) {

340 - var chars = FallbackCompositionState.getData();

340 + const chars = FallbackCompositionState.getData();

341 FallbackCompositionState.reset();

342 isComposing = false;

343 return chars;

@@ -400,7 +400,7 @@ function extractBeforeInputEvent(

400 nativeEvent,

401 nativeEventTarget,

402 ) {

403 - var chars;

403 + let chars;

404

405 if (canUseTextInputEvent) {

406 chars = getNativeBeforeInputChars(topLevelType, nativeEvent);

@@ -414,7 +414,7 @@ function extractBeforeInputEvent(

414 return null;

415 }

416

417 - var event = SyntheticInputEvent.getPooled(

417 + const event = SyntheticInputEvent.getPooled(

418 eventTypes.beforeInput,

419 targetInst,

420 nativeEvent,

@@ -444,7 +444,7 @@ function extractBeforeInputEvent(

444 * allowing us to share composition fallback code for both `beforeInput` and

445 * `composition` event types.

446 */

447 -var BeforeInputEventPlugin = {

447 +const BeforeInputEventPlugin = {

448 eventTypes: eventTypes,

449

450 extractEvents: function(

packages/react-dom/src/events/BrowserEventConstants.js

+2 -2

@@ -14,7 +14,7 @@ import getVendorPrefixedEventName from './getVendorPrefixedEventName';

14 * trap at a lower node than `document`), binding at `document` would

15 * cause duplicate events so we don't include them here.

16 */

17 -var topLevelTypes = {

17 +const topLevelTypes = {

18 topAbort: 'abort',

19 topAnimationEnd: getVendorPrefixedEventName('animationend') || 'animationend',

20 topAnimationIteration:

@@ -90,7 +90,7 @@ var topLevelTypes = {

91 export type TopLevelTypes = $Enum<typeof topLevelTypes>;

93 -var BrowserEventConstants = {

93 +const BrowserEventConstants = {

94 topLevelTypes,

95 };

packages/react-dom/src/events/ChangeEventPlugin.js

+13 -13

@@ -19,7 +19,7 @@ import {getNodeFromInstance} from '../client/ReactDOMComponentTree';

19 import * as inputValueTracking from '../client/inputValueTracking';

20 import {setDefaultValue} from '../client/ReactDOMFiberInput';

22 -var eventTypes = {

22 +const eventTypes = {

23 change: {

24 phasedRegistrationNames: {

25 bubbled: 'onChange',

@@ -39,7 +39,7 @@ var eventTypes = {

39 };

41 function createAndAccumulateChangeEvent(inst, nativeEvent, target) {

42 - var event = SyntheticEvent.getPooled(

42 + const event = SyntheticEvent.getPooled(

43 eventTypes.change,

44 inst,

45 nativeEvent,

@@ -54,21 +54,21 @@ function createAndAccumulateChangeEvent(inst, nativeEvent, target) {

54 /**

55 * For IE shims

56 */

57 -var activeElement = null;

58 -var activeElementInst = null;

57 +let activeElement = null;

58 +let activeElementInst = null;

60 /**

61 * SECTION: handle `change` event

62 */

63 function shouldUseChangeEvent(elem) {

64 - var nodeName = elem.nodeName && elem.nodeName.toLowerCase();

64 + const nodeName = elem.nodeName && elem.nodeName.toLowerCase();

65 return (

66 nodeName === 'select' || (nodeName === 'input' && elem.type === 'file')

67 );

68 }

70 function manualDispatchChangeEvent(nativeEvent) {

71 - var event = createAndAccumulateChangeEvent(

71 + const event = createAndAccumulateChangeEvent(

72 activeElementInst,

73 nativeEvent,

74 getEventTarget(nativeEvent),

@@ -109,7 +109,7 @@ function getTargetInstForChangeEvent(topLevelType, targetInst) {

109 /**

110 * SECTION: handle `input` event

111 */

112 -var isInputEventSupported = false;

112 +let isInputEventSupported = false;

113 if (ExecutionEnvironment.canUseDOM) {

114 // IE9 claims to support the input event but fails to trigger it when

115 // deleting text, so we ignore its input events.

@@ -202,7 +202,7 @@ function shouldUseClickEvent(elem) {

202 // Use the `click` event to detect changes to checkbox and radio inputs.

203 // This approach works across all browsers, whereas `change` does not fire

204 // until `blur` in IE8.

205 - var nodeName = elem.nodeName;

205 + const nodeName = elem.nodeName;

206 return (

207 nodeName &&

208 nodeName.toLowerCase() === 'input' &&

@@ -249,7 +249,7 @@ function handleControlledInputBlur(inst, node) {

249 * - textarea

250 * - select

251 */

252 -var ChangeEventPlugin = {

252 +const ChangeEventPlugin = {

253 eventTypes: eventTypes,

254

255 _isInputEventSupported: isInputEventSupported,

@@ -260,9 +260,9 @@ var ChangeEventPlugin = {

260 nativeEvent,

261 nativeEventTarget,

262 ) {

263 - var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;

263 + const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;

264

265 - var getTargetInstFunc, handleEventFunc;

265 + let getTargetInstFunc, handleEventFunc;

266 if (shouldUseChangeEvent(targetNode)) {

267 getTargetInstFunc = getTargetInstForChangeEvent;

268 } else if (isTextInputElement(targetNode)) {

@@ -277,9 +277,9 @@ var ChangeEventPlugin = {

277 }

278

279 if (getTargetInstFunc) {

280 - var inst = getTargetInstFunc(topLevelType, targetInst);

280 + const inst = getTargetInstFunc(topLevelType, targetInst);

281 if (inst) {

282 - var event = createAndAccumulateChangeEvent(

282 + const event = createAndAccumulateChangeEvent(

283 inst,

284 nativeEvent,

285 nativeEventTarget,

packages/react-dom/src/events/DOMEventPluginOrder.js

+1 -1

@@ -14,7 +14,7 @@

14 * `ResponderEventPlugin` must occur before `SimpleEventPlugin` so that

15 * preventing default on events is convenient in `SimpleEventPlugin` handlers.

16 */

17 -var DOMEventPluginOrder = [

17 +const DOMEventPluginOrder = [

18 'ResponderEventPlugin',

19 'SimpleEventPlugin',

20 'TapEventPlugin',

packages/react-dom/src/events/EnterLeaveEventPlugin.js

+11 -11

@@ -13,7 +13,7 @@ import {

13 getNodeFromInstance,

14 } from '../client/ReactDOMComponentTree';

16 -var eventTypes = {

16 +const eventTypes = {

17 mouseEnter: {

18 registrationName: 'onMouseEnter',

19 dependencies: ['topMouseOut', 'topMouseOver'],

@@ -24,7 +24,7 @@ var eventTypes = {

24 },

25 };

27 -var EnterLeaveEventPlugin = {

27 +const EnterLeaveEventPlugin = {

28 eventTypes: eventTypes,

30 /**

@@ -51,13 +51,13 @@ var EnterLeaveEventPlugin = {

51 return null;

52 }

54 - var win;

54 + let win;

55 if (nativeEventTarget.window === nativeEventTarget) {

56 // `nativeEventTarget` is probably a window object.

57 win = nativeEventTarget;

58 } else {

59 // TODO: Figure out why `ownerDocument` is sometimes undefined in IE8.

60 - var doc = nativeEventTarget.ownerDocument;

60 + const doc = nativeEventTarget.ownerDocument;

61 if (doc) {

62 win = doc.defaultView || doc.parentWindow;

63 } else {

@@ -65,11 +65,11 @@ var EnterLeaveEventPlugin = {

65 }

66 }

68 - var from;

69 - var to;

68 + let from;

69 + let to;

70 if (topLevelType === 'topMouseOut') {

71 from = targetInst;

72 - var related = nativeEvent.relatedTarget || nativeEvent.toElement;

72 + const related = nativeEvent.relatedTarget || nativeEvent.toElement;

73 to = related ? getClosestInstanceFromNode(related) : null;

74 } else {

75 // Moving to a node from outside the window.

@@ -82,10 +82,10 @@ var EnterLeaveEventPlugin = {

82 return null;

83 }

85 - var fromNode = from == null ? win : getNodeFromInstance(from);

86 - var toNode = to == null ? win : getNodeFromInstance(to);

85 + const fromNode = from == null ? win : getNodeFromInstance(from);

86 + const toNode = to == null ? win : getNodeFromInstance(to);

88 - var leave = SyntheticMouseEvent.getPooled(

88 + const leave = SyntheticMouseEvent.getPooled(

89 eventTypes.mouseLeave,

90 from,

91 nativeEvent,

@@ -95,7 +95,7 @@ var EnterLeaveEventPlugin = {

95 leave.target = fromNode;

96 leave.relatedTarget = toNode;

98 - var enter = SyntheticMouseEvent.getPooled(

98 + const enter = SyntheticMouseEvent.getPooled(

99 eventTypes.mouseEnter,

100 to,

101 nativeEvent,

packages/react-dom/src/events/FallbackCompositionState.js

+9 -9

@@ -18,7 +18,7 @@ import getTextContentAccessor from '../client/getTextContentAccessor';

18 *

19 *

20 */

21 -var compositionState = {

21 +const compositionState = {

22 _root: null,

23 _startText: null,

24 _fallbackText: null,

@@ -41,12 +41,12 @@ export function getData() {

41 return compositionState._fallbackText;

42 }

44 - var start;

45 - var startValue = compositionState._startText;

46 - var startLength = startValue.length;

47 - var end;

48 - var endValue = getText();

49 - var endLength = endValue.length;

44 + let start;

45 + const startValue = compositionState._startText;

46 + const startLength = startValue.length;

47 + let end;

48 + const endValue = getText();

49 + const endLength = endValue.length;

51 for (start = 0; start < startLength; start++) {

52 if (startValue[start] !== endValue[start]) {

@@ -54,14 +54,14 @@ export function getData() {

54 }

55 }

57 - var minEnd = startLength - start;

57 + const minEnd = startLength - start;

58 for (end = 1; end <= minEnd; end++) {

59 if (startValue[startLength - end] !== endValue[endLength - end]) {

60 break;

61 }

62 }

64 - var sliceTail = end > 1 ? 1 - end : undefined;

64 + const sliceTail = end > 1 ? 1 - end : undefined;

65 compositionState._fallbackText = endValue.slice(start, sliceTail);

66 return compositionState._fallbackText;

67 }

packages/react-dom/src/events/ReactBrowserEventEmitter.js

+13 -13

@@ -18,7 +18,7 @@ import BrowserEventConstants from './BrowserEventConstants';

19 export * from 'events/ReactEventEmitterMixin';

21 -var {topLevelTypes} = BrowserEventConstants;

21 +const {topLevelTypes} = BrowserEventConstants;

23 /**

24 * Summary of `ReactBrowserEventEmitter` event handling:

@@ -76,13 +76,13 @@ var {topLevelTypes} = BrowserEventConstants;

76 * React Core . General Purpose Event Plugin System

77 */

79 -var alreadyListeningTo = {};

80 -var reactTopListenersCounter = 0;

79 +const alreadyListeningTo = {};

80 +let reactTopListenersCounter = 0;

82 /**

83 * To ensure no conflicts with other potential React instances on the page

84 */

85 -var topListenersIDKey = '_reactListenersID' + ('' + Math.random()).slice(2);

85 +const topListenersIDKey = '_reactListenersID' + ('' + Math.random()).slice(2);

87 function getListeningForDocument(mountAt) {

88 // In IE8, `mountAt` is a host object and doesn't have `hasOwnProperty`

@@ -116,12 +116,12 @@ function getListeningForDocument(mountAt) {

116 * @param {object} contentDocumentHandle Document which owns the container

117 */

118 export function listenTo(registrationName, contentDocumentHandle) {

119 - var mountAt = contentDocumentHandle;

120 - var isListening = getListeningForDocument(mountAt);

121 - var dependencies = registrationNameDependencies[registrationName];

119 + const mountAt = contentDocumentHandle;

120 + const isListening = getListeningForDocument(mountAt);

121 + const dependencies = registrationNameDependencies[registrationName];

122

123 - for (var i = 0; i < dependencies.length; i++) {

124 - var dependency = dependencies[i];

123 + for (let i = 0; i < dependencies.length; i++) {

124 + const dependency = dependencies[i];

125 if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) {

126 if (dependency === 'topScroll') {

127 trapCapturedEvent('topScroll', 'scroll', mountAt);

@@ -152,10 +152,10 @@ export function listenTo(registrationName, contentDocumentHandle) {

152 }

153

154 export function isListeningToAllDependencies(registrationName, mountAt) {

155 - var isListening = getListeningForDocument(mountAt);

156 - var dependencies = registrationNameDependencies[registrationName];

157 - for (var i = 0; i < dependencies.length; i++) {

158 - var dependency = dependencies[i];

155 + const isListening = getListeningForDocument(mountAt);

156 + const dependencies = registrationNameDependencies[registrationName];

157 + for (let i = 0; i < dependencies.length; i++) {

158 + const dependency = dependencies[i];

159 if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) {

160 return false;

161 }

packages/react-dom/src/events/ReactDOMEventListener.js

+9 -9

@@ -13,8 +13,8 @@ import EventListener from 'fbjs/lib/EventListener';

13 import getEventTarget from './getEventTarget';

14 import {getClosestInstanceFromNode} from '../client/ReactDOMComponentTree';

16 -var CALLBACK_BOOKKEEPING_POOL_SIZE = 10;

17 -var callbackBookkeepingPool = [];

16 +const CALLBACK_BOOKKEEPING_POOL_SIZE = 10;

17 +const callbackBookkeepingPool = [];

19 /**

20 * Find the deepest React component completely containing the root of the

@@ -63,19 +63,19 @@ function releaseTopLevelCallbackBookKeeping(instance) {

63 }

65 function handleTopLevelImpl(bookKeeping) {

66 - var targetInst = bookKeeping.targetInst;

66 + let targetInst = bookKeeping.targetInst;

68 // Loop through the hierarchy, in case there's any nested components.

69 // It's important that we build the array of ancestors before calling any

70 // event handlers, because event handlers can modify the DOM, leading to

71 // inconsistencies with ReactMount's node cache. See #1105.

72 - var ancestor = targetInst;

72 + let ancestor = targetInst;

73 do {

74 if (!ancestor) {

75 bookKeeping.ancestors.push(ancestor);

76 break;

77 }

78 - var root = findRootContainerNode(ancestor);

78 + const root = findRootContainerNode(ancestor);

79 if (!root) {

80 break;

81 }

@@ -83,7 +83,7 @@ function handleTopLevelImpl(bookKeeping) {

83 ancestor = getClosestInstanceFromNode(root);

84 } while (ancestor);

86 - for (var i = 0; i < bookKeeping.ancestors.length; i++) {

86 + for (let i = 0; i < bookKeeping.ancestors.length; i++) {

87 targetInst = bookKeeping.ancestors[i];

88 _handleTopLevel(

89 bookKeeping.topLevelType,

@@ -157,8 +157,8 @@ export function dispatchEvent(topLevelType, nativeEvent) {

157 return;

158 }

159

160 - var nativeEventTarget = getEventTarget(nativeEvent);

161 - var targetInst = getClosestInstanceFromNode(nativeEventTarget);

160 + const nativeEventTarget = getEventTarget(nativeEvent);

161 + let targetInst = getClosestInstanceFromNode(nativeEventTarget);

162 if (

163 targetInst !== null &&

164 typeof targetInst.tag === 'number' &&

@@ -171,7 +171,7 @@ export function dispatchEvent(topLevelType, nativeEvent) {

171 targetInst = null;

172 }

173

174 - var bookKeeping = getTopLevelCallbackBookKeeping(

174 + const bookKeeping = getTopLevelCallbackBookKeeping(

175 topLevelType,

176 nativeEvent,

177 targetInst,

packages/react-dom/src/events/SelectEventPlugin.js

+12 -12

@@ -17,12 +17,12 @@ import {getNodeFromInstance} from '../client/ReactDOMComponentTree';

17 import * as ReactInputSelection from '../client/ReactInputSelection';

18 import {DOCUMENT_NODE} from '../shared/HTMLNodeType';

20 -var skipSelectionChangeEvent =

20 +const skipSelectionChangeEvent =

21 ExecutionEnvironment.canUseDOM &&

22 'documentMode' in document &&

23 document.documentMode <= 11;

25 -var eventTypes = {

25 +const eventTypes = {

26 select: {

27 phasedRegistrationNames: {

28 bubbled: 'onSelect',

@@ -41,10 +41,10 @@ var eventTypes = {

41 },

42 };

44 -var activeElement = null;

45 -var activeElementInst = null;

46 -var lastSelection = null;

47 -var mouseDown = false;

44 +let activeElement = null;

45 +let activeElementInst = null;

46 +let lastSelection = null;

47 +let mouseDown = false;

49 /**

50 * Get an object which is a unique representation of the current selection.

@@ -65,7 +65,7 @@ function getSelection(node) {

65 end: node.selectionEnd,

66 };

67 } else if (window.getSelection) {

68 - var selection = window.getSelection();

68 + const selection = window.getSelection();

69 return {

70 anchorNode: selection.anchorNode,

71 anchorOffset: selection.anchorOffset,

@@ -95,11 +95,11 @@ function constructSelectEvent(nativeEvent, nativeEventTarget) {

95 }

97 // Only fire when selection has actually changed.

98 - var currentSelection = getSelection(activeElement);

98 + const currentSelection = getSelection(activeElement);

99 if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) {

100 lastSelection = currentSelection;

101

102 - var syntheticEvent = SyntheticEvent.getPooled(

102 + const syntheticEvent = SyntheticEvent.getPooled(

103 eventTypes.select,

104 activeElementInst,

105 nativeEvent,

@@ -131,7 +131,7 @@ function constructSelectEvent(nativeEvent, nativeEventTarget) {

131 * - Fires for collapsed selection.

132 * - Fires after user input.

133 */

134 -var SelectEventPlugin = {

134 +const SelectEventPlugin = {

135 eventTypes: eventTypes,

136

137 extractEvents: function(

@@ -140,7 +140,7 @@ var SelectEventPlugin = {

140 nativeEvent,

141 nativeEventTarget,

142 ) {

143 - var doc =

143 + const doc =

144 nativeEventTarget.window === nativeEventTarget

145 ? nativeEventTarget.document

146 : nativeEventTarget.nodeType === DOCUMENT_NODE

@@ -152,7 +152,7 @@ var SelectEventPlugin = {

152 return null;

153 }

154

155 - var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;

155 + const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;

156

157 switch (topLevelType) {

158 // Track the input node that has focus.

packages/react-dom/src/events/SimpleEventPlugin.js

+13 -11

@@ -49,8 +49,10 @@ import getEventCharCode from './getEventCharCode';

49 * 'topAbort': { sameConfig }

50 * };

51 */

52 -var eventTypes: EventTypes = {};

53 -var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};

52 +const eventTypes: EventTypes = {};

53 +const topLevelEventsToDispatchConfig: {

54 + [key: TopLevelTypes]: DispatchConfig,

55 +} = {};

56 [

57 'abort',

58 'animationEnd',

@@ -118,11 +120,11 @@ var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};

120 'waiting',

121 'wheel',

122 ].forEach(event => {

121 - var capitalizedEvent = event[0].toUpperCase() + event.slice(1);

122 - var onEvent = 'on' + capitalizedEvent;

123 - var topEvent = 'top' + capitalizedEvent;

123 + const capitalizedEvent = event[0].toUpperCase() + event.slice(1);

124 + const onEvent = 'on' + capitalizedEvent;

125 + const topEvent = 'top' + capitalizedEvent;

126

125 - var type = {

127 + const type = {

128 phasedRegistrationNames: {

129 bubbled: onEvent,

130 captured: onEvent + 'Capture',

@@ -134,7 +136,7 @@ var topLevelEventsToDispatchConfig: {[key: TopLevelTypes]: DispatchConfig} = {};

136 });

137

138 // Only used in DEV for exhaustiveness validation.

137 -var knownHTMLTopLevelTypes = [

139 +const knownHTMLTopLevelTypes = [

140 'topAbort',

141 'topCancel',

142 'topCanPlay',

@@ -168,7 +170,7 @@ var knownHTMLTopLevelTypes = [

170 'topWaiting',

171 ];

172

171 -var SimpleEventPlugin: PluginModule<MouseEvent> = {

173 +const SimpleEventPlugin: PluginModule<MouseEvent> = {

174 eventTypes: eventTypes,

175

176 extractEvents: function(

@@ -177,11 +179,11 @@ var SimpleEventPlugin: PluginModule<MouseEvent> = {

179 nativeEvent: MouseEvent,

180 nativeEventTarget: EventTarget,

181 ): null | ReactSyntheticEvent {

180 - var dispatchConfig = topLevelEventsToDispatchConfig[topLevelType];

182 + const dispatchConfig = topLevelEventsToDispatchConfig[topLevelType];

183 if (!dispatchConfig) {

184 return null;

185 }

184 - var EventConstructor;

186 + let EventConstructor;

187 switch (topLevelType) {

188 case 'topKeyPress':

189 // Firefox creates a keypress event for function keys too. This removes

@@ -268,7 +270,7 @@ var SimpleEventPlugin: PluginModule<MouseEvent> = {

270 EventConstructor = SyntheticEvent;

271 break;

272 }

271 - var event = EventConstructor.getPooled(

273 + const event = EventConstructor.getPooled(

274 dispatchConfig,

275 targetInst,

276 nativeEvent,

packages/react-dom/src/events/SyntheticAnimationEvent.js

+1 -1

@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

12 * @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface

13 * @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent

14 */

15 -var AnimationEventInterface = {

15 +const AnimationEventInterface = {

16 animationName: null,

17 elapsedTime: null,

18 pseudoElement: null,

packages/react-dom/src/events/SyntheticClipboardEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

11 * @interface Event

12 * @see http://www.w3.org/TR/clipboard-apis/

13 */

14 -var ClipboardEventInterface = {

14 +const ClipboardEventInterface = {

15 clipboardData: function(event) {

16 return 'clipboardData' in event

17 ? event.clipboardData

packages/react-dom/src/events/SyntheticCompositionEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

11 * @interface Event

12 * @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents

13 */

14 -var CompositionEventInterface = {

14 +const CompositionEventInterface = {

15 data: null,

16 };

packages/react-dom/src/events/SyntheticDragEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticMouseEvent from './SyntheticMouseEvent';

11 * @interface DragEvent

12 * @see http://www.w3.org/TR/DOM-Level-3-Events/

13 */

14 -var DragEventInterface = {

14 +const DragEventInterface = {

15 dataTransfer: null,

16 };

packages/react-dom/src/events/SyntheticFocusEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticUIEvent from './SyntheticUIEvent';

11 * @interface FocusEvent

12 * @see http://www.w3.org/TR/DOM-Level-3-Events/

13 */

14 -var FocusEventInterface = {

14 +const FocusEventInterface = {

15 relatedTarget: null,

16 };

packages/react-dom/src/events/SyntheticInputEvent.js

+1 -1

@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

12 * @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105

13 * /#events-inputevents

14 */

15 -var InputEventInterface = {

15 +const InputEventInterface = {

16 data: null,

17 };

packages/react-dom/src/events/SyntheticKeyboardEvent.js

+1 -1

@@ -14,7 +14,7 @@ import getEventModifierState from './getEventModifierState';

14 * @interface KeyboardEvent

15 * @see http://www.w3.org/TR/DOM-Level-3-Events/

16 */

17 -var KeyboardEventInterface = {

17 +const KeyboardEventInterface = {

18 key: getEventKey,

19 location: null,

20 ctrlKey: null,

packages/react-dom/src/events/SyntheticMouseEvent.js

+1 -1

@@ -12,7 +12,7 @@ import getEventModifierState from './getEventModifierState';

12 * @interface MouseEvent

13 * @see http://www.w3.org/TR/DOM-Level-3-Events/

14 */

15 -var MouseEventInterface = {

15 +const MouseEventInterface = {

16 screenX: null,

17 screenY: null,

18 clientX: null,

packages/react-dom/src/events/SyntheticTouchEvent.js

+1 -1

@@ -12,7 +12,7 @@ import getEventModifierState from './getEventModifierState';

12 * @interface TouchEvent

13 * @see http://www.w3.org/TR/touch-events/

14 */

15 -var TouchEventInterface = {

15 +const TouchEventInterface = {

16 touches: null,

17 targetTouches: null,

18 changedTouches: null,

packages/react-dom/src/events/SyntheticTransitionEvent.js

+1 -1

@@ -12,7 +12,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

12 * @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events-

13 * @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent

14 */

15 -var TransitionEventInterface = {

15 +const TransitionEventInterface = {

16 propertyName: null,

17 elapsedTime: null,

18 pseudoElement: null,

packages/react-dom/src/events/SyntheticUIEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticEvent from 'events/SyntheticEvent';

11 * @interface UIEvent

12 * @see http://www.w3.org/TR/DOM-Level-3-Events/

13 */

14 -var UIEventInterface = {

14 +const UIEventInterface = {

15 view: null,

16 detail: null,

17 };

packages/react-dom/src/events/SyntheticWheelEvent.js

+1 -1

@@ -11,7 +11,7 @@ import SyntheticMouseEvent from './SyntheticMouseEvent';

11 * @interface WheelEvent

12 * @see http://www.w3.org/TR/DOM-Level-3-Events/

13 */

14 -var WheelEventInterface = {

14 +const WheelEventInterface = {

15 deltaX: function(event) {

16 return 'deltaX' in event

17 ? event.deltaX

packages/react-dom/src/events/TapEventPlugin.js

+15 -15

@@ -46,10 +46,10 @@ type CoordinatesType = {

46 * Number of pixels that are tolerated in between a `touchStart` and `touchEnd`

47 * in order to still be considered a 'tap' event.

48 */

49 -var tapMoveThreshold = 10;

50 -var startCoords: CoordinatesType = {x: 0, y: 0};

49 +const tapMoveThreshold = 10;

50 +const startCoords: CoordinatesType = {x: 0, y: 0};

52 -var Axis: AxisType = {

52 +const Axis: AxisType = {

53 x: {page: 'pageX', client: 'clientX', envScroll: 'currentPageScrollLeft'},

54 y: {page: 'pageY', client: 'clientY', envScroll: 'currentPageScrollTop'},

55 };

@@ -58,7 +58,7 @@ function getAxisCoordOfEvent(

58 axis: AxisCoordinateData,

59 nativeEvent: _Touch,

60 ): number {

61 - var singleTouch = TouchEventUtils.extractSingleTouch(nativeEvent);

61 + const singleTouch = TouchEventUtils.extractSingleTouch(nativeEvent);

62 if (singleTouch) {

63 return singleTouch[axis.page];

64 }

@@ -66,26 +66,26 @@ function getAxisCoordOfEvent(

66 }

68 function getDistance(coords: CoordinatesType, nativeEvent: _Touch): number {

69 - var pageX = getAxisCoordOfEvent(Axis.x, nativeEvent);

70 - var pageY = getAxisCoordOfEvent(Axis.y, nativeEvent);

69 + const pageX = getAxisCoordOfEvent(Axis.x, nativeEvent);

70 + const pageY = getAxisCoordOfEvent(Axis.y, nativeEvent);

71 return Math.pow(

72 Math.pow(pageX - coords.x, 2) + Math.pow(pageY - coords.y, 2),

73 0.5,

74 );

75 }

77 -var touchEvents = [

77 +const touchEvents = [

78 'topTouchStart',

79 'topTouchCancel',

80 'topTouchEnd',

81 'topTouchMove',

82 ];

84 -var dependencies = ['topMouseDown', 'topMouseMove', 'topMouseUp'].concat(

84 +const dependencies = ['topMouseDown', 'topMouseMove', 'topMouseUp'].concat(

85 touchEvents,

86 );

88 -var eventTypes = {

88 +const eventTypes = {

89 touchTap: {

90 phasedRegistrationNames: {

91 bubbled: 'onTouchTap',

@@ -95,11 +95,11 @@ var eventTypes = {

95 },

96 };

98 -var usedTouch = false;

99 -var usedTouchTime = 0;

100 -var TOUCH_DELAY = 1000;

98 +let usedTouch = false;

99 +let usedTouchTime = 0;

100 +const TOUCH_DELAY = 1000;

101

102 -var TapEventPlugin = {

102 +const TapEventPlugin = {

103 tapMoveThreshold: tapMoveThreshold,

104

105 eventTypes: eventTypes,

@@ -124,8 +124,8 @@ var TapEventPlugin = {

124 return null;

125 }

126 }

127 - var event = null;

128 - var distance = getDistance(startCoords, nativeEvent);

127 + let event = null;

128 + const distance = getDistance(startCoords, nativeEvent);

129 if (isEndish(topLevelType) && distance < tapMoveThreshold) {

130 event = SyntheticUIEvent.getPooled(

131 eventTypes.touchTap,

packages/react-dom/src/events/__tests__/BeforeInputEventPlugin-test.internal.js

+14 -14

@@ -9,10 +9,10 @@

10 'use strict';

12 -var React = require('react');

13 -var ReactTestUtils = require('react-dom/test-utils');

12 +const React = require('react');

13 +const ReactTestUtils = require('react-dom/test-utils');

15 -var EventMapping = {

15 +const EventMapping = {

16 compositionstart: 'topCompositionStart',

17 compositionend: 'topCompositionEnd',

18 keyup: 'topKeyUp',

@@ -23,7 +23,7 @@ var EventMapping = {

23 };

25 describe('BeforeInputEventPlugin', function() {

26 - var ModuleCache;

26 + let ModuleCache;

28 function simulateIE11() {

29 document.documentMode = 11;

@@ -56,7 +56,7 @@ describe('BeforeInputEventPlugin', function() {

56 }

58 function extract(node, eventType, optionalData) {

59 - var evt = document.createEvent('HTMLEvents');

59 + let evt = document.createEvent('HTMLEvents');

60 evt.initEvent(eventType, true, true);

61 evt = Object.assign(evt, optionalData);

62 return ModuleCache.BeforeInputEventPlugin.extractEvents(

@@ -74,8 +74,8 @@ describe('BeforeInputEventPlugin', function() {

74 function accumulateEvents(node, events) {

75 // We don't use accumulateInto module to apply partial application.

76 return function() {

77 - var newArgs = [node].concat(Array.prototype.slice.call(arguments));

78 - var newEvents = extract.apply(this, newArgs);

77 + const newArgs = [node].concat(Array.prototype.slice.call(arguments));

78 + const newEvents = extract.apply(this, newArgs);

79 Array.prototype.push.apply(events, newEvents);

80 };

81 }

@@ -89,7 +89,7 @@ describe('BeforeInputEventPlugin', function() {

89 function verifyEvents(actualEvents, expectedEvents) {

90 expect(actualEvents.length).toBe(expectedEvents.length);

91 expectedEvents.forEach(function(expected, idx) {

92 - var actual = actualEvents[idx];

92 + const actual = actualEvents[idx];

93 expect(function() {

94 if (actual === null && expected.type === null) {

95 // Both are null. Expected.

@@ -121,7 +121,7 @@ describe('BeforeInputEventPlugin', function() {

121 // instead of a standard name `textInput`. As of now, React does not have

122 // a corresponding topEvent to IE's textinput, but both events are added to

123 // this scenario data for future use.

124 - var Test_Scenario = [

124 + const Test_Scenario = [

125 // Composition test

126 {run: accumulateEvents, arg: ['compositionstart', {data: ''}]},

127 {run: accumulateEvents, arg: ['textInput', {data: 'A'}]},

@@ -154,7 +154,7 @@ describe('BeforeInputEventPlugin', function() {

154 // Webkit behavior is simple. We expect SyntheticInputEvent at each

155 // textInput, SyntheticCompositionEvent at composition, and nothing from

156 // keyUp.

157 - var Expected_Webkit = () => [

157 + const Expected_Webkit = () => [

158 {type: ModuleCache.SyntheticCompositionEvent, data: {}},

159 {type: null},

160 {type: null},

@@ -189,7 +189,7 @@ describe('BeforeInputEventPlugin', function() {

189 // We expect no SyntheticInputEvent from textinput. Fallback beforeInput is

190 // expected to be triggered at compositionend with a text of the target

191 // element, not event data.

192 - var Expected_IE11 = () => [

192 + const Expected_IE11 = () => [

193 {type: ModuleCache.SyntheticCompositionEvent, data: {}},

194 {type: null},

195 {type: null},

@@ -234,10 +234,10 @@ describe('BeforeInputEventPlugin', function() {

234 return <div contentEditable="true" />;

235 }

236 }

237 - var rendered = ReactTestUtils.renderIntoDocument(<EditableDiv />);

237 + const rendered = ReactTestUtils.renderIntoDocument(<EditableDiv />);

238

239 - var node = ModuleCache.ReactDOM.findDOMNode(rendered);

240 - var events = [];

239 + const node = ModuleCache.ReactDOM.findDOMNode(rendered);

240 + const events = [];

241

242 Scenario.forEach(el => el.run.call(this, node, events).apply(this, el.arg));

243 verifyEvents(events, ExpectedResult());

packages/react-dom/src/events/__tests__/ChangeEventPlugin-test.js

+38 -37

@@ -9,21 +9,21 @@

10 'use strict';

12 -var React = require('react');

13 -var ReactDOM = require('react-dom');

12 +const React = require('react');

13 +const ReactDOM = require('react-dom');

15 -var setUntrackedChecked = Object.getOwnPropertyDescriptor(

15 +const setUntrackedChecked = Object.getOwnPropertyDescriptor(

16 HTMLInputElement.prototype,

17 'checked',

18 ).set;

20 -var setUntrackedValue = Object.getOwnPropertyDescriptor(

20 +const setUntrackedValue = Object.getOwnPropertyDescriptor(

21 HTMLInputElement.prototype,

22 'value',

23 ).set;

25 describe('ChangeEventPlugin', () => {

26 - var container;

26 + let container;

28 beforeEach(() => {

29 container = document.createElement('div');

@@ -43,14 +43,14 @@ describe('ChangeEventPlugin', () => {

43 // See https://github.com/facebook/react/pull/5746.

45 it('should consider initial text value to be current', () => {

46 - var called = 0;

46 + let called = 0;

48 function cb(e) {

49 called++;

50 expect(e.type).toBe('change');

51 }

53 - var node = ReactDOM.render(

53 + const node = ReactDOM.render(

54 <input type="text" onChange={cb} defaultValue="foo" />,

55 container,

56 );

@@ -61,14 +61,14 @@ describe('ChangeEventPlugin', () => {

61 });

63 it('should consider initial checkbox checked=true to be current', () => {

64 - var called = 0;

64 + let called = 0;

66 function cb(e) {

67 called++;

68 expect(e.type).toBe('change');

69 }

71 - var node = ReactDOM.render(

71 + const node = ReactDOM.render(

72 <input type="checkbox" onChange={cb} defaultChecked={true} />,

73 container,

74 );

@@ -85,14 +85,14 @@ describe('ChangeEventPlugin', () => {

85 });

87 it('should consider initial checkbox checked=false to be current', () => {

88 - var called = 0;

88 + let called = 0;

90 function cb(e) {

91 called++;

92 expect(e.type).toBe('change');

93 }

95 - var node = ReactDOM.render(

95 + const node = ReactDOM.render(

96 <input type="checkbox" onChange={cb} defaultChecked={false} />,

97 container,

98 );

@@ -109,14 +109,14 @@ describe('ChangeEventPlugin', () => {

109 });

110

111 it('should fire change for checkbox input', () => {

112 - var called = 0;

112 + let called = 0;

113

114 function cb(e) {

115 called++;

116 expect(e.type).toBe('change');

117 }

118

119 - var node = ReactDOM.render(

119 + const node = ReactDOM.render(

120 <input type="checkbox" onChange={cb} />,

121 container,

122 );

@@ -139,14 +139,14 @@ describe('ChangeEventPlugin', () => {

139 });

140

141 it('should not fire change setting the value programmatically', () => {

142 - var called = 0;

142 + let called = 0;

143

144 function cb(e) {

145 called++;

146 expect(e.type).toBe('change');

147 }

148

149 - var input = ReactDOM.render(

149 + const input = ReactDOM.render(

150 <input type="text" defaultValue="foo" onChange={cb} />,

151 container,

152 );

@@ -175,14 +175,14 @@ describe('ChangeEventPlugin', () => {

175 });

176

177 it('should not distinguish equal string and number values', () => {

178 - var called = 0;

178 + let called = 0;

179

180 function cb(e) {

181 called++;

182 expect(e.type).toBe('change');

183 }

184

185 - var input = ReactDOM.render(

185 + const input = ReactDOM.render(

186 <input type="text" defaultValue="42" onChange={cb} />,

187 container,

188 );

@@ -200,14 +200,14 @@ describe('ChangeEventPlugin', () => {

200

201 // See a similar input test above for a detailed description of why.

202 it('should not fire change when setting checked programmatically', () => {

203 - var called = 0;

203 + let called = 0;

204

205 function cb(e) {

206 called++;

207 expect(e.type).toBe('change');

208 }

209

210 - var input = ReactDOM.render(

210 + const input = ReactDOM.render(

211 <input type="checkbox" onChange={cb} defaultChecked={false} />,

212 container,

213 );

@@ -232,20 +232,20 @@ describe('ChangeEventPlugin', () => {

232 });

233

234 it('should unmount', () => {

235 - var input = ReactDOM.render(<input />, container);

235 + const input = ReactDOM.render(<input />, container);

236

237 ReactDOM.unmountComponentAtNode(container);

238 });

239

240 it('should only fire change for checked radio button once', () => {

241 - var called = 0;

241 + let called = 0;

242

243 function cb(e) {

244 called++;

245 expect(e.type).toBe('change');

246 }

247

248 - var input = ReactDOM.render(

248 + const input = ReactDOM.render(

249 <input type="radio" onChange={cb} />,

250 container,

251 );

@@ -257,8 +257,8 @@ describe('ChangeEventPlugin', () => {

257 });

258

259 it('should track radio button cousins in a group', () => {

260 - var called1 = 0;

261 - var called2 = 0;

260 + let called1 = 0;

261 + let called2 = 0;

262

263 function cb1(e) {

264 called1++;

@@ -270,15 +270,15 @@ describe('ChangeEventPlugin', () => {

270 expect(e.type).toBe('change');

271 }

272

273 - var div = ReactDOM.render(

273 + const div = ReactDOM.render(

274 <div>

275 <input type="radio" name="group" onChange={cb1} />

276 <input type="radio" name="group" onChange={cb2} />

277 </div>,

278 container,

279 );

280 - var option1 = div.childNodes[0];

281 - var option2 = div.childNodes[1];

280 + const option1 = div.childNodes[0];

281 + const option2 = div.childNodes[1];

282

283 // Select first option.

284 option1.dispatchEvent(

@@ -304,14 +304,14 @@ describe('ChangeEventPlugin', () => {

304 });

305

306 it('should deduplicate input value change events', () => {

307 - var called = 0;

307 + let called = 0;

308

309 function cb(e) {

310 called++;

311 expect(e.type).toBe('change');

312 }

313

314 - var input;

314 + let input;

315 ['text', 'number', 'range'].forEach(type => {

316 called = 0;

317 input = ReactDOM.render(<input type={type} onChange={cb} />, container);

@@ -367,14 +367,14 @@ describe('ChangeEventPlugin', () => {

367 });

368

369 it('should listen for both change and input events when supported', () => {

370 - var called = 0;

370 + let called = 0;

371

372 function cb(e) {

373 called++;

374 expect(e.type).toBe('change');

375 }

376

377 - var input = ReactDOM.render(

377 + const input = ReactDOM.render(

378 <input type="range" onChange={cb} />,

379 container,

380 );

@@ -389,14 +389,14 @@ describe('ChangeEventPlugin', () => {

389 });

390

391 it('should only fire events when the value changes for range inputs', () => {

392 - var called = 0;

392 + let called = 0;

393

394 function cb(e) {

395 called++;

396 expect(e.type).toBe('change');

397 }

398

399 - var input = ReactDOM.render(

399 + const input = ReactDOM.render(

400 <input type="range" onChange={cb} />,

401 container,

402 );

@@ -412,20 +412,21 @@ describe('ChangeEventPlugin', () => {

412 });

413

414 it('does not crash for nodes with custom value property', () => {

415 + let originalCreateElement;

416 // https://github.com/facebook/react/issues/10196

417 try {

417 - var originalCreateElement = document.createElement;

418 + originalCreateElement = document.createElement;

419 document.createElement = function() {

419 - var node = originalCreateElement.apply(this, arguments);

420 + const node = originalCreateElement.apply(this, arguments);

421 Object.defineProperty(node, 'value', {

422 get() {},

423 set() {},

424 });

425 return node;

426 };

426 - var div = document.createElement('div');

427 + const div = document.createElement('div');

428 // Mount

428 - var node = ReactDOM.render(<input type="text" />, div);

429 + const node = ReactDOM.render(<input type="text" />, div);

430 // Update

431 ReactDOM.render(<input type="text" />, div);

432 // Change

packages/react-dom/src/events/__tests__/EnterLeaveEventPlugin-test.js

+3 -3

@@ -9,11 +9,11 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

12 +let React;

13 +let ReactDOM;

15 describe('EnterLeaveEventPlugin', () => {

16 - var container;

16 + let container;

18 beforeEach(() => {

19 jest.resetModules();

packages/react-dom/src/events/__tests__/FallbackCompositionState-test.js

+7 -7

@@ -10,9 +10,9 @@

10 'use strict';

12 describe('FallbackCompositionState', () => {

13 - var FallbackCompositionState;

13 + let FallbackCompositionState;

15 - var TEXT = 'Hello world';

15 + const TEXT = 'Hello world';

17 beforeEach(() => {

18 // TODO: can we express this test with only public API?

@@ -20,27 +20,27 @@ describe('FallbackCompositionState', () => {

20 });

22 function getInput() {

23 - var input = document.createElement('input');

23 + const input = document.createElement('input');

24 input.value = TEXT;

25 return input;

26 }

28 function getTextarea() {

29 - var textarea = document.createElement('textarea');

29 + const textarea = document.createElement('textarea');

30 textarea.value = TEXT;

31 return textarea;

32 }

34 function getContentEditable() {

35 - var editable = document.createElement('div');

36 - var inner = document.createElement('span');

35 + const editable = document.createElement('div');

36 + const inner = document.createElement('span');

37 inner.appendChild(document.createTextNode(TEXT));

38 editable.appendChild(inner);

39 return editable;

40 }

42 function assertExtractedData(modifiedValue, expectedData) {

43 - var input = getInput();

43 + const input = getInput();

44 FallbackCompositionState.initialize(input);

45 input.value = modifiedValue;

46 expect(FallbackCompositionState.getData()).toBe(expectedData);

packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js

+10 -10

@@ -9,11 +9,11 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

12 +let React;

13 +let ReactDOM;

15 describe('SelectEventPlugin', () => {

16 - var container;

16 + let container;

18 beforeEach(() => {

19 React = require('react');

@@ -30,8 +30,8 @@ describe('SelectEventPlugin', () => {

31 // See https://github.com/facebook/react/pull/3639 for details.

32 it('does not get confused when dependent events are registered independently', () => {

33 - var select = jest.fn();

34 - var onSelect = event => {

33 + const select = jest.fn();

34 + const onSelect = event => {

35 expect(typeof event).toBe('object');

36 expect(event.type).toBe('select');

37 expect(event.target).toBe(node);

@@ -39,7 +39,7 @@ describe('SelectEventPlugin', () => {

39 };

41 // Pass `onMouseDown` so React registers a top-level listener.

42 - var node = ReactDOM.render(

42 + const node = ReactDOM.render(

43 <input type="text" onMouseDown={function() {}} />,

44 container,

45 );

@@ -76,21 +76,21 @@ describe('SelectEventPlugin', () => {

76 });

78 it('should fire `onSelect` when a listener is present', () => {

79 - var select = jest.fn();

80 - var onSelect = event => {

79 + const select = jest.fn();

80 + const onSelect = event => {

81 expect(typeof event).toBe('object');

82 expect(event.type).toBe('select');

83 expect(event.target).toBe(node);

84 select(event.currentTarget);

85 };

87 - var node = ReactDOM.render(

87 + const node = ReactDOM.render(

88 <input type="text" onSelect={onSelect} />,

89 container,

90 );

91 node.focus();

93 - var nativeEvent = new MouseEvent('focus', {

93 + let nativeEvent = new MouseEvent('focus', {

94 bubbles: true,

95 cancelable: true,

96 });

packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.js

+27 -27

@@ -10,11 +10,11 @@

10 'use strict';

12 describe('SimpleEventPlugin', function() {

13 - var React;

14 - var ReactDOM;

15 - var ReactTestUtils;

13 + let React;

14 + let ReactDOM;

15 + let ReactTestUtils;

17 - var onClick;

17 + let onClick;

19 function expectClickThru(element) {

20 ReactTestUtils.SimulateNative.click(ReactDOM.findDOMNode(element));

@@ -40,67 +40,67 @@ describe('SimpleEventPlugin', function() {

40 });

42 it('A non-interactive tags click when disabled', function() {

43 - var element = <div onClick={onClick} />;

43 + const element = <div onClick={onClick} />;

44 expectClickThru(mounted(element));

45 });

47 it('A non-interactive tags clicks bubble when disabled', function() {

48 - var element = ReactTestUtils.renderIntoDocument(

48 + const element = ReactTestUtils.renderIntoDocument(

49 <div onClick={onClick}>

50 <div />

51 </div>,

52 );

53 - var child = ReactDOM.findDOMNode(element).firstChild;

53 + const child = ReactDOM.findDOMNode(element).firstChild;

55 ReactTestUtils.SimulateNative.click(child);

56 expect(onClick.mock.calls.length).toBe(1);

57 });

59 it('does not register a click when clicking a child of a disabled element', function() {

60 - var element = ReactTestUtils.renderIntoDocument(

60 + const element = ReactTestUtils.renderIntoDocument(

61 <button onClick={onClick} disabled={true}>

62 <span />

63 </button>,

64 );

65 - var child = ReactDOM.findDOMNode(element).querySelector('span');

65 + const child = ReactDOM.findDOMNode(element).querySelector('span');

67 ReactTestUtils.SimulateNative.click(child);

68 expect(onClick.mock.calls.length).toBe(0);

69 });

71 it('triggers click events for children of disabled elements', function() {

72 - var element = ReactTestUtils.renderIntoDocument(

72 + const element = ReactTestUtils.renderIntoDocument(

73 <button disabled={true}>

74 <span onClick={onClick} />

75 </button>,

76 );

77 - var child = ReactDOM.findDOMNode(element).querySelector('span');

77 + const child = ReactDOM.findDOMNode(element).querySelector('span');

79 ReactTestUtils.SimulateNative.click(child);

80 expect(onClick.mock.calls.length).toBe(1);

81 });

83 it('triggers parent captured click events when target is a child of a disabled elements', function() {

84 - var element = ReactTestUtils.renderIntoDocument(

84 + const element = ReactTestUtils.renderIntoDocument(

85 <div onClickCapture={onClick}>

86 <button disabled={true}>

87 <span />

88 </button>

89 </div>,

90 );

91 - var child = ReactDOM.findDOMNode(element).querySelector('span');

91 + const child = ReactDOM.findDOMNode(element).querySelector('span');

93 ReactTestUtils.SimulateNative.click(child);

94 expect(onClick.mock.calls.length).toBe(1);

95 });

97 it('triggers captured click events for children of disabled elements', function() {

98 - var element = ReactTestUtils.renderIntoDocument(

98 + const element = ReactTestUtils.renderIntoDocument(

99 <button disabled={true}>

100 <span onClickCapture={onClick} />

101 </button>,

102 );

103 - var child = ReactDOM.findDOMNode(element).querySelector('span');

103 + const child = ReactDOM.findDOMNode(element).querySelector('span');

104

105 ReactTestUtils.SimulateNative.click(child);

106 expect(onClick.mock.calls.length).toBe(1);

@@ -109,7 +109,7 @@ describe('SimpleEventPlugin', function() {

109 ['button', 'input', 'select', 'textarea'].forEach(function(tagName) {

110 describe(tagName, function() {

111 it('should forward clicks when it starts out not disabled', () => {

112 - var element = React.createElement(tagName, {

112 + const element = React.createElement(tagName, {

113 onClick: onClick,

114 });

115

@@ -117,7 +117,7 @@ describe('SimpleEventPlugin', function() {

117 });

118

119 it('should not forward clicks when it starts out disabled', () => {

120 - var element = React.createElement(tagName, {

120 + const element = React.createElement(tagName, {

121 onClick: onClick,

122 disabled: true,

123 });

@@ -126,8 +126,8 @@ describe('SimpleEventPlugin', function() {

126 });

127

128 it('should forward clicks when it becomes not disabled', () => {

129 - var container = document.createElement('div');

130 - var element = ReactDOM.render(

129 + const container = document.createElement('div');

130 + let element = ReactDOM.render(

131 React.createElement(tagName, {onClick: onClick, disabled: true}),

132 container,

133 );

@@ -139,8 +139,8 @@ describe('SimpleEventPlugin', function() {

139 });

140

141 it('should not forward clicks when it becomes disabled', () => {

142 - var container = document.createElement('div');

143 - var element = ReactDOM.render(

142 + const container = document.createElement('div');

143 + let element = ReactDOM.render(

144 React.createElement(tagName, {onClick: onClick}),

145 container,

146 );

@@ -152,8 +152,8 @@ describe('SimpleEventPlugin', function() {

152 });

153

154 it('should work correctly if the listener is changed', () => {

155 - var container = document.createElement('div');

156 - var element = ReactDOM.render(

155 + const container = document.createElement('div');

156 + let element = ReactDOM.render(

157 React.createElement(tagName, {onClick: onClick, disabled: true}),

158 container,

159 );

@@ -170,11 +170,11 @@ describe('SimpleEventPlugin', function() {

170 // See http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html

171

172 it('does not add a local click to interactive elements', function() {

173 - var container = document.createElement('div');

173 + const container = document.createElement('div');

174

175 ReactDOM.render(<button onClick={onClick} />, container);

176

177 - var node = container.firstChild;

177 + const node = container.firstChild;

178

179 node.dispatchEvent(new MouseEvent('click'));

180

@@ -182,11 +182,11 @@ describe('SimpleEventPlugin', function() {

182 });

183

184 it('adds a local click listener to non-interactive elements', function() {

185 - var container = document.createElement('div');

185 + const container = document.createElement('div');

186

187 ReactDOM.render(<div onClick={onClick} />, container);

188

189 - var node = container.firstChild;

189 + const node = container.firstChild;

190

191 node.dispatchEvent(new MouseEvent('click'));

192

packages/react-dom/src/events/__tests__/SyntheticClipboardEvent-test.js

+19 -19

@@ -9,11 +9,11 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

12 +let React;

13 +let ReactDOM;

15 describe('SyntheticClipboardEvent', () => {

16 - var container;

16 + let container;

18 beforeEach(() => {

19 React = require('react');

@@ -33,21 +33,21 @@ describe('SyntheticClipboardEvent', () => {

33 describe('clipboardData', () => {

34 describe('when event has clipboardData', () => {

35 it("returns event's clipboardData", () => {

36 - var expectedCount = 0;

36 + let expectedCount = 0;

38 // Mock clipboardData since jsdom implementation doesn't have a constructor

39 - var clipboardData = {

39 + const clipboardData = {

40 dropEffect: null,

41 effectAllowed: null,

42 files: null,

43 items: null,

44 types: null,

45 };

46 - var eventHandler = event => {

46 + const eventHandler = event => {

47 expect(event.clipboardData).toBe(clipboardData);

48 expectedCount++;

49 };

50 - var div = ReactDOM.render(

50 + const div = ReactDOM.render(

51 <div

52 onCopy={eventHandler}

53 onCut={eventHandler}

@@ -56,7 +56,7 @@ describe('SyntheticClipboardEvent', () => {

56 container,

57 );

59 - var event;

59 + let event;

60 event = document.createEvent('Event');

61 event.initEvent('copy', true, true);

62 event.clipboardData = clipboardData;

@@ -80,10 +80,10 @@ describe('SyntheticClipboardEvent', () => {

81 describe('EventInterface', () => {

82 it('normalizes properties from the Event interface', () => {

83 - var expectedCount = 0;

84 - var div;

83 + let expectedCount = 0;

84 + let div;

86 - var eventHandler = type => event => {

86 + const eventHandler = type => event => {

87 expect(event.target).toBe(div);

88 expect(event.type).toBe(type);

89 expectedCount++;

@@ -98,7 +98,7 @@ describe('SyntheticClipboardEvent', () => {

98 container,

99 );

100

101 - var event;

101 + let event;

102 event = document.createEvent('Event');

103 event.initEvent('copy', true, true);

104 // Emulate IE8

@@ -142,9 +142,9 @@ describe('SyntheticClipboardEvent', () => {

142 });

143

144 it('is able to `preventDefault` and `stopPropagation`', () => {

145 - var expectedCount = 0;

145 + let expectedCount = 0;

146

147 - var eventHandler = event => {

147 + const eventHandler = event => {

148 expect(event.isDefaultPrevented()).toBe(false);

149 event.preventDefault();

150 expect(event.isDefaultPrevented()).toBe(true);

@@ -154,7 +154,7 @@ describe('SyntheticClipboardEvent', () => {

154 expectedCount++;

155 };

156

157 - var div = ReactDOM.render(

157 + const div = ReactDOM.render(

158 <div

159 onCopy={eventHandler}

160 onCut={eventHandler}

@@ -163,7 +163,7 @@ describe('SyntheticClipboardEvent', () => {

163 container,

164 );

165

166 - var event;

166 + let event;

167 event = document.createEvent('Event');

168 event.initEvent('copy', true, true);

169 div.dispatchEvent(event);

@@ -181,14 +181,14 @@ describe('SyntheticClipboardEvent', () => {

181

182 it('is able to `persist`', () => {

183 const persistentEvents = [];

184 - var eventHandler = event => {

184 + const eventHandler = event => {

185 expect(event.isPersistent()).toBe(false);

186 event.persist();

187 expect(event.isPersistent()).toBe(true);

188 persistentEvents.push(event);

189 };

190

191 - var div = ReactDOM.render(

191 + const div = ReactDOM.render(

192 <div

193 onCopy={eventHandler}

194 onCut={eventHandler}

@@ -197,7 +197,7 @@ describe('SyntheticClipboardEvent', () => {

197 container,

198 );

199

200 - var event;

200 + let event;

201 event = document.createEvent('Event');

202 event.initEvent('copy', true, true);

203 div.dispatchEvent(event);

packages/react-dom/src/events/__tests__/SyntheticEvent-test.js

+53 -53

@@ -9,12 +9,12 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

14 -var ReactTestUtils;

12 +let React;

13 +let ReactDOM;

14 +let ReactTestUtils;

16 describe('SyntheticEvent', () => {

17 - var container;

17 + let container;

19 beforeEach(() => {

20 React = require('react');

@@ -31,17 +31,17 @@ describe('SyntheticEvent', () => {

31 });

33 it('should normalize `target` from the nativeEvent', () => {

34 - var node;

35 - var expectedCount = 0;

34 + let node;

35 + let expectedCount = 0;

37 - var eventHandler = syntheticEvent => {

37 + const eventHandler = syntheticEvent => {

38 expect(syntheticEvent.target).toBe(node);

40 expectedCount++;

41 };

42 node = ReactDOM.render(<div onClick={eventHandler} />, container);

44 - var event = document.createEvent('Event');

44 + const event = document.createEvent('Event');

45 event.initEvent('click', true, true);

46 // Emulate IE8

47 Object.defineProperty(event, 'target', {

@@ -58,10 +58,10 @@ describe('SyntheticEvent', () => {

58 });

60 it('should be able to `preventDefault`', () => {

61 - var node;

62 - var expectedCount = 0;

61 + let node;

62 + let expectedCount = 0;

64 - var eventHandler = syntheticEvent => {

64 + const eventHandler = syntheticEvent => {

65 expect(syntheticEvent.isDefaultPrevented()).toBe(false);

66 syntheticEvent.preventDefault();

67 expect(syntheticEvent.isDefaultPrevented()).toBe(true);

@@ -71,7 +71,7 @@ describe('SyntheticEvent', () => {

71 };

72 node = ReactDOM.render(<div onClick={eventHandler} />, container);

74 - var event = document.createEvent('Event');

74 + const event = document.createEvent('Event');

75 event.initEvent('click', true, true);

76 node.dispatchEvent(event);

@@ -79,17 +79,17 @@ describe('SyntheticEvent', () => {

79 });

81 it('should be prevented if nativeEvent is prevented', () => {

82 - var node;

83 - var expectedCount = 0;

82 + let node;

83 + let expectedCount = 0;

85 - var eventHandler = syntheticEvent => {

85 + const eventHandler = syntheticEvent => {

86 expect(syntheticEvent.isDefaultPrevented()).toBe(true);

88 expectedCount++;

89 };

90 node = ReactDOM.render(<div onClick={eventHandler} />, container);

92 - var event;

92 + let event;

93 event = document.createEvent('Event');

94 event.initEvent('click', true, true);

95 event.preventDefault();

@@ -112,10 +112,10 @@ describe('SyntheticEvent', () => {

112 });

113

114 it('should be able to `stopPropagation`', () => {

115 - var node;

116 - var expectedCount = 0;

115 + let node;

116 + let expectedCount = 0;

117

118 - var eventHandler = syntheticEvent => {

118 + const eventHandler = syntheticEvent => {

119 expect(syntheticEvent.isPropagationStopped()).toBe(false);

120 syntheticEvent.stopPropagation();

121 expect(syntheticEvent.isPropagationStopped()).toBe(true);

@@ -124,7 +124,7 @@ describe('SyntheticEvent', () => {

124 };

125 node = ReactDOM.render(<div onClick={eventHandler} />, container);

126

127 - var event = document.createEvent('Event');

127 + const event = document.createEvent('Event');

128 event.initEvent('click', true, true);

129 node.dispatchEvent(event);

130

@@ -132,11 +132,11 @@ describe('SyntheticEvent', () => {

132 });

133

134 it('should be able to `persist`', () => {

135 - var node;

136 - var expectedCount = 0;

137 - var syntheticEvent;

135 + let node;

136 + let expectedCount = 0;

137 + let syntheticEvent;

138

139 - var eventHandler = e => {

139 + const eventHandler = e => {

140 expect(e.isPersistent()).toBe(false);

141 e.persist();

142 syntheticEvent = e;

@@ -146,7 +146,7 @@ describe('SyntheticEvent', () => {

146 };

147 node = ReactDOM.render(<div onClick={eventHandler} />, container);

148

149 - var event = document.createEvent('Event');

149 + const event = document.createEvent('Event');

150 event.initEvent('click', true, true);

151 node.dispatchEvent(event);

152

@@ -158,18 +158,18 @@ describe('SyntheticEvent', () => {

158

159 it('should be nullified and log warnings if the synthetic event has not been persisted', () => {

160 spyOnDev(console, 'error');

161 - var node;

162 - var expectedCount = 0;

163 - var syntheticEvent;

161 + let node;

162 + let expectedCount = 0;

163 + let syntheticEvent;

164

165 - var eventHandler = e => {

165 + const eventHandler = e => {

166 syntheticEvent = e;

167

168 expectedCount++;

169 };

170 node = ReactDOM.render(<div onClick={eventHandler} />, container);

171

172 - var event = document.createEvent('Event');

172 + const event = document.createEvent('Event');

173 event.initEvent('click', true, true);

174 node.dispatchEvent(event);

175

@@ -193,18 +193,18 @@ describe('SyntheticEvent', () => {

193

194 it('should warn when setting properties of a synthetic event that has not been persisted', () => {

195 spyOnDev(console, 'error');

196 - var node;

197 - var expectedCount = 0;

198 - var syntheticEvent;

196 + let node;

197 + let expectedCount = 0;

198 + let syntheticEvent;

199

200 - var eventHandler = e => {

200 + const eventHandler = e => {

201 syntheticEvent = e;

202

203 expectedCount++;

204 };

205 node = ReactDOM.render(<div onClick={eventHandler} />, container);

206

207 - var event = document.createEvent('Event');

207 + const event = document.createEvent('Event');

208 event.initEvent('click', true, true);

209 node.dispatchEvent(event);

210

@@ -224,17 +224,17 @@ describe('SyntheticEvent', () => {

224

225 it('should warn when calling `preventDefault` if the synthetic event has not been persisted', () => {

226 spyOnDev(console, 'error');

227 - var node;

228 - var expectedCount = 0;

229 - var syntheticEvent;

227 + let node;

228 + let expectedCount = 0;

229 + let syntheticEvent;

230

231 - var eventHandler = e => {

231 + const eventHandler = e => {

232 syntheticEvent = e;

233 expectedCount++;

234 };

235 node = ReactDOM.render(<div onClick={eventHandler} />, container);

236

237 - var event = document.createEvent('Event');

237 + const event = document.createEvent('Event');

238 event.initEvent('click', true, true);

239 node.dispatchEvent(event);

240

@@ -254,17 +254,17 @@ describe('SyntheticEvent', () => {

254

255 it('should warn when calling `stopPropagation` if the synthetic event has not been persisted', () => {

256 spyOnDev(console, 'error');

257 - var node;

258 - var expectedCount = 0;

259 - var syntheticEvent;

257 + let node;

258 + let expectedCount = 0;

259 + let syntheticEvent;

260

261 - var eventHandler = e => {

261 + const eventHandler = e => {

262 syntheticEvent = e;

263 expectedCount++;

264 };

265 node = ReactDOM.render(<div onClick={eventHandler} />, container);

266

267 - var event = document.createEvent('Event');

267 + const event = document.createEvent('Event');

268 event.initEvent('click', true, true);

269

270 node.dispatchEvent(event);

@@ -288,12 +288,12 @@ describe('SyntheticEvent', () => {

288 // way we simulate events.

289 xit('should properly log warnings when events simulated with rendered components', () => {

290 spyOnDev(console, 'error');

291 - var event;

292 - var element = document.createElement('div');

291 + let event;

292 + const element = document.createElement('div');

293 function assignEvent(e) {

294 event = e;

295 }

296 - var node = ReactDOM.render(<div onClick={assignEvent} />, element);

296 + const node = ReactDOM.render(<div onClick={assignEvent} />, element);

297 ReactTestUtils.Simulate.click(ReactDOM.findDOMNode(node));

298 if (__DEV__) {

299 expect(console.error.calls.count()).toBe(0);

@@ -316,18 +316,18 @@ describe('SyntheticEvent', () => {

316

317 it('should warn if Proxy is supported and the synthetic event is added a property', () => {

318 spyOnDev(console, 'error');

319 - var node;

320 - var expectedCount = 0;

321 - var syntheticEvent;

319 + let node;

320 + let expectedCount = 0;

321 + let syntheticEvent;

322

323 - var eventHandler = e => {

323 + const eventHandler = e => {

324 e.foo = 'bar';

325 syntheticEvent = e;

326 expectedCount++;

327 };

328 node = ReactDOM.render(<div onClick={eventHandler} />, container);

329

330 - var event = document.createEvent('Event');

330 + const event = document.createEvent('Event');

331 event.initEvent('click', true, true);

332

333 node.dispatchEvent(event);

packages/react-dom/src/events/__tests__/SyntheticWheelEvent-test.js

+12 -12

@@ -9,11 +9,11 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

12 +let React;

13 +let ReactDOM;

15 describe('SyntheticWheelEvent', () => {

16 - var container;

16 + let container;

18 beforeEach(() => {

19 React = require('react');

@@ -31,7 +31,7 @@ describe('SyntheticWheelEvent', () => {

32 it('should normalize properties from the Event interface', () => {

33 const events = [];

34 - var onWheel = event => {

34 + const onWheel = event => {

35 event.persist();

36 events.push(event);

37 };

@@ -58,7 +58,7 @@ describe('SyntheticWheelEvent', () => {

59 it('should normalize properties from the MouseEvent interface', () => {

60 const events = [];

61 - var onWheel = event => {

61 + const onWheel = event => {

62 event.persist();

63 events.push(event);

64 };

@@ -76,14 +76,14 @@ describe('SyntheticWheelEvent', () => {

76 });

78 it('should normalize properties from the WheelEvent interface', () => {

79 - var events = [];

80 - var onWheel = event => {

79 + const events = [];

80 + const onWheel = event => {

81 event.persist();

82 events.push(event);

83 };

84 ReactDOM.render(<div onWheel={onWheel} />, container);

86 - var event = new MouseEvent('wheel', {

86 + let event = new MouseEvent('wheel', {

87 bubbles: true,

88 });

89 // jsdom doesn't support these so we add them manually.

@@ -111,8 +111,8 @@ describe('SyntheticWheelEvent', () => {

111 });

112

113 it('should be able to `preventDefault` and `stopPropagation`', () => {

114 - var events = [];

115 - var onWheel = event => {

114 + const events = [];

115 + const onWheel = event => {

116 expect(event.isDefaultPrevented()).toBe(false);

117 event.preventDefault();

118 expect(event.isDefaultPrevented()).toBe(true);

@@ -141,8 +141,8 @@ describe('SyntheticWheelEvent', () => {

141 });

142

143 it('should be able to `persist`', () => {

144 - var events = [];

145 - var onWheel = event => {

144 + const events = [];

145 + const onWheel = event => {

146 expect(event.isPersistent()).toBe(false);

147 event.persist();

148 expect(event.isPersistent()).toBe(true);

packages/react-dom/src/events/__tests__/getEventKey-test.js

+9 -9

@@ -9,11 +9,11 @@

10 'use strict';

12 -var React;

13 -var ReactDOM;

12 +let React;

13 +let ReactDOM;

15 describe('getEventKey', () => {

16 - var container;

16 + let container;

18 beforeEach(() => {

19 React = require('react');

@@ -41,7 +41,7 @@ describe('getEventKey', () => {

42 ReactDOM.render(<Comp />, container);

44 - var nativeEvent = new KeyboardEvent('keydown', {

44 + const nativeEvent = new KeyboardEvent('keydown', {

45 key: 'Del',

46 bubbles: true,

47 cancelable: true,

@@ -62,7 +62,7 @@ describe('getEventKey', () => {

63 ReactDOM.render(<Comp />, container);

65 - var nativeEvent = new KeyboardEvent('keydown', {

65 + const nativeEvent = new KeyboardEvent('keydown', {

66 key: 'f',

67 bubbles: true,

68 cancelable: true,

@@ -86,7 +86,7 @@ describe('getEventKey', () => {

87 ReactDOM.render(<Comp />, container);

89 - var nativeEvent = new KeyboardEvent('keypress', {

89 + const nativeEvent = new KeyboardEvent('keypress', {

90 charCode: 13,

91 bubbles: true,

92 cancelable: true,

@@ -107,7 +107,7 @@ describe('getEventKey', () => {

107

108 ReactDOM.render(<Comp />, container);

109

110 - var nativeEvent = new KeyboardEvent('keypress', {

110 + const nativeEvent = new KeyboardEvent('keypress', {

111 charCode: 65,

112 bubbles: true,

113 cancelable: true,

@@ -130,7 +130,7 @@ describe('getEventKey', () => {

130

131 ReactDOM.render(<Comp />, container);

132

133 - var nativeEvent = new KeyboardEvent('keydown', {

133 + const nativeEvent = new KeyboardEvent('keydown', {

134 keyCode: 45,

135 bubbles: true,

136 cancelable: true,

@@ -151,7 +151,7 @@ describe('getEventKey', () => {

151

152 ReactDOM.render(<Comp />, container);

153

154 - var nativeEvent = new KeyboardEvent('keydown', {

154 + const nativeEvent = new KeyboardEvent('keydown', {

155 keyCode: 1337,

156 bubbles: true,

157 cancelable: true,

packages/react-dom/src/events/getEventCharCode.js

+2 -2

@@ -16,8 +16,8 @@

16 * @return {number} Normalized `charCode` property.

17 */

18 function getEventCharCode(nativeEvent) {

19 - var charCode;

20 - var keyCode = nativeEvent.keyCode;

19 + let charCode;

20 + const keyCode = nativeEvent.keyCode;

22 if ('charCode' in nativeEvent) {

23 charCode = nativeEvent.charCode;

packages/react-dom/src/events/getEventKey.js

+4 -4

@@ -13,7 +13,7 @@ import getEventCharCode from './getEventCharCode';

13 * Normalization of deprecated HTML5 `key` values

14 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names

15 */

16 -var normalizeKey = {

16 +const normalizeKey = {

17 Esc: 'Escape',

18 Spacebar: ' ',

19 Left: 'ArrowLeft',

@@ -33,7 +33,7 @@ var normalizeKey = {

33 * Only special keys supported, all others depend on keyboard layout or browser

34 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names

35 */

36 -var translateToKey = {

36 +const translateToKey = {

37 '8': 'Backspace',

38 '9': 'Tab',

39 '12': 'Clear',

@@ -83,7 +83,7 @@ function getEventKey(nativeEvent: KeyboardEvent): string {

84 // FireFox implements `key` but returns `MozPrintableKey` for all

85 // printable characters (normalized to `Unidentified`), ignore it.

86 - var key = normalizeKey[nativeEvent.key] || nativeEvent.key;

86 + const key = normalizeKey[nativeEvent.key] || nativeEvent.key;

87 if (key !== 'Unidentified') {

88 return key;

89 }

@@ -91,7 +91,7 @@ function getEventKey(nativeEvent: KeyboardEvent): string {

92 // Browser does not implement `key`, polyfill as much of it as we can.

93 if (nativeEvent.type === 'keypress') {

94 - var charCode = getEventCharCode(nativeEvent);

94 + const charCode = getEventCharCode(nativeEvent);

96 // The enter-key is technically both printable and non-printable and can

97 // thus be captured by `keypress`, no other non-printable key should.

packages/react-dom/src/events/getEventModifierState.js

+4 -4

@@ -10,7 +10,7 @@

10 * @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers

11 */

13 -var modifierKeyToProp = {

13 +const modifierKeyToProp = {

14 Alt: 'altKey',

15 Control: 'ctrlKey',

16 Meta: 'metaKey',

@@ -21,12 +21,12 @@ var modifierKeyToProp = {

21 // modifier keys exposed by the event itself, does not support Lock-keys.

22 // Currently, all major browsers except Chrome seems to support Lock-keys.

23 function modifierStateGetter(keyArg) {

24 - var syntheticEvent = this;

25 - var nativeEvent = syntheticEvent.nativeEvent;

24 + const syntheticEvent = this;

25 + const nativeEvent = syntheticEvent.nativeEvent;

26 if (nativeEvent.getModifierState) {

27 return nativeEvent.getModifierState(keyArg);

28 }

29 - var keyProp = modifierKeyToProp[keyArg];

29 + const keyProp = modifierKeyToProp[keyArg];

30 return keyProp ? !!nativeEvent[keyProp] : false;

31 }

packages/react-dom/src/events/getEventTarget.js

+1 -1

@@ -15,7 +15,7 @@ import {TEXT_NODE} from '../shared/HTMLNodeType';

15 * @return {DOMEventTarget} Target node.

16 */

17 function getEventTarget(nativeEvent) {

18 - var target = nativeEvent.target || nativeEvent.srcElement || window;

18 + let target = nativeEvent.target || nativeEvent.srcElement || window;

20 // Normalize SVG <use> element events #4963

21 if (target.correspondingUseElement) {

packages/react-dom/src/events/getVendorPrefixedEventName.js

+6 -6

@@ -15,7 +15,7 @@ import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';

15 * @returns {object}

16 */

17 function makePrefixMap(styleProp, eventName) {

18 - var prefixes = {};

18 + const prefixes = {};

20 prefixes[styleProp.toLowerCase()] = eventName.toLowerCase();

21 prefixes['Webkit' + styleProp] = 'webkit' + eventName;

@@ -29,7 +29,7 @@ function makePrefixMap(styleProp, eventName) {

29 /**

30 * A list of event names to a configurable list of vendor prefixes.

31 */

32 -var vendorPrefixes = {

32 +const vendorPrefixes = {

33 animationend: makePrefixMap('Animation', 'AnimationEnd'),

34 animationiteration: makePrefixMap('Animation', 'AnimationIteration'),

35 animationstart: makePrefixMap('Animation', 'AnimationStart'),

@@ -39,12 +39,12 @@ var vendorPrefixes = {

39 /**

40 * Event names that have already been detected and prefixed (if applicable).

41 */

42 -var prefixedEventNames = {};

42 +const prefixedEventNames = {};

44 /**

45 * Element to check for prefixes on.

46 */

47 -var style = {};

47 +let style = {};

49 /**

50 * Bootstrap if a DOM exists.

@@ -81,9 +81,9 @@ function getVendorPrefixedEventName(eventName) {

81 return eventName;

82 }

84 - var prefixMap = vendorPrefixes[eventName];

84 + const prefixMap = vendorPrefixes[eventName];

86 - for (var styleProp in prefixMap) {

86 + for (const styleProp in prefixMap) {

87 if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) {

88 return (prefixedEventNames[eventName] = prefixMap[styleProp]);

89 }

packages/react-dom/src/events/isEventSupported.js

+4 -4

@@ -7,7 +7,7 @@

8 import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';

10 -var useHasFeature;

10 +let useHasFeature;

11 if (ExecutionEnvironment.canUseDOM) {

12 useHasFeature =

13 document.implementation &&

@@ -39,11 +39,11 @@ function isEventSupported(eventNameSuffix, capture) {

39 return false;

40 }

42 - var eventName = 'on' + eventNameSuffix;

43 - var isSupported = eventName in document;

42 + const eventName = 'on' + eventNameSuffix;

43 + let isSupported = eventName in document;

45 if (!isSupported) {

46 - var element = document.createElement('div');

46 + const element = document.createElement('div');

47 element.setAttribute(eventName, 'return;');

48 isSupported = typeof element[eventName] === 'function';

49 }

packages/react-dom/src/test-utils/ReactTestUtils.js

+25 -24

@@ -20,8 +20,8 @@ import invariant from 'fbjs/lib/invariant';

21 import BrowserEventConstants from '../events/BrowserEventConstants';

23 -var {findDOMNode} = ReactDOM;

24 -var {

23 +const {findDOMNode} = ReactDOM;

24 +const {

25 EventPluginHub,

26 EventPluginRegistry,

27 EventPropagators,

@@ -30,7 +30,7 @@ var {

30 ReactDOMEventListener,

31 } = ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;

33 -var topLevelTypes = BrowserEventConstants.topLevelTypes;

33 +const topLevelTypes = BrowserEventConstants.topLevelTypes;

35 function Event(suffix) {}

@@ -42,7 +42,7 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {

42 if (!fiber) {

43 return [];

44 }

45 - var currentParent = findCurrentFiberUsingSlowPath(fiber);

45 + const currentParent = findCurrentFiberUsingSlowPath(fiber);

46 if (!currentParent) {

47 return [];

48 }

@@ -55,7 +55,7 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {

55 node.tag === ClassComponent ||

56 node.tag === FunctionalComponent

57 ) {

58 - var publicInst = node.stateNode;

58 + const publicInst = node.stateNode;

59 if (test(publicInst)) {

60 ret.push(publicInst);

61 }

@@ -88,9 +88,9 @@ function findAllInRenderedFiberTreeInternal(fiber, test) {

88 * utilities will suffice for testing purposes.

89 * @lends ReactTestUtils

90 */

91 -var ReactTestUtils = {

91 +const ReactTestUtils = {

92 renderIntoDocument: function(element) {

93 - var div = document.createElement('div');

93 + const div = document.createElement('div');

94 // None of our tests actually require attaching the container to the

95 // DOM, and doing so creates a mess that we rely on test isolation to

96 // clean up, so we're going to stop honoring the name of this method

@@ -132,8 +132,8 @@ var ReactTestUtils = {

132 if (!ReactTestUtils.isCompositeComponent(inst)) {

133 return false;

134 }

135 - var internalInstance = ReactInstanceMap.get(inst);

136 - var constructor = internalInstance.type;

135 + const internalInstance = ReactInstanceMap.get(inst);

136 + const constructor = internalInstance.type;

137 return constructor === type;

138 },

139

@@ -145,7 +145,7 @@ var ReactTestUtils = {

145 ReactTestUtils.isCompositeComponent(inst),

146 'findAllInRenderedTree(...): instance must be a composite component',

147 );

148 - var internalInstance = ReactInstanceMap.get(inst);

148 + const internalInstance = ReactInstanceMap.get(inst);

149 return findAllInRenderedFiberTreeInternal(internalInstance, test);

150 },

151

@@ -157,12 +157,12 @@ var ReactTestUtils = {

157 scryRenderedDOMComponentsWithClass: function(root, classNames) {

158 return ReactTestUtils.findAllInRenderedTree(root, function(inst) {

159 if (ReactTestUtils.isDOMComponent(inst)) {

160 - var className = inst.className;

160 + let className = inst.className;

161 if (typeof className !== 'string') {

162 // SVG, probably.

163 className = inst.getAttribute('class') || '';

164 }

165 - var classList = className.split(/\s+/);

165 + const classList = className.split(/\s+/);

166

167 if (!Array.isArray(classNames)) {

168 invariant(

@@ -187,7 +187,7 @@ var ReactTestUtils = {

187 * @return {!ReactDOMComponent} The one match.

188 */

189 findRenderedDOMComponentWithClass: function(root, className) {

190 - var all = ReactTestUtils.scryRenderedDOMComponentsWithClass(

190 + const all = ReactTestUtils.scryRenderedDOMComponentsWithClass(

191 root,

192 className,

193 );

@@ -224,7 +224,7 @@ var ReactTestUtils = {

224 * @return {!ReactDOMComponent} The one match.

225 */

226 findRenderedDOMComponentWithTag: function(root, tagName) {

227 - var all = ReactTestUtils.scryRenderedDOMComponentsWithTag(root, tagName);

227 + const all = ReactTestUtils.scryRenderedDOMComponentsWithTag(root, tagName);

228 if (all.length !== 1) {

229 throw new Error(

230 'Did not find exactly one match (found: ' +

@@ -254,7 +254,7 @@ var ReactTestUtils = {

254 * @return {!ReactComponent} The one match.

255 */

256 findRenderedComponentWithType: function(root, componentType) {

257 - var all = ReactTestUtils.scryRenderedComponentsWithType(

257 + const all = ReactTestUtils.scryRenderedComponentsWithType(

258 root,

259 componentType,

260 );

@@ -356,17 +356,17 @@ function makeSimulator(eventType) {

356 'a component instance. Pass the DOM node you wish to simulate the event on instead.',

357 );

358

359 - var dispatchConfig =

359 + const dispatchConfig =

360 EventPluginRegistry.eventNameDispatchConfigs[eventType];

361

362 - var fakeNativeEvent = new Event();

362 + const fakeNativeEvent = new Event();

363 fakeNativeEvent.target = domNode;

364 fakeNativeEvent.type = eventType.toLowerCase();

365

366 // We don't use SyntheticEvent.getPooled in order to not have to worry about

367 // properly destroying any properties assigned from `eventData` upon release

368 - var targetInst = ReactDOMComponentTree.getInstanceFromNode(domNode);

369 - var event = new SyntheticEvent(

368 + const targetInst = ReactDOMComponentTree.getInstanceFromNode(domNode);

369 + const event = new SyntheticEvent(

370 dispatchConfig,

371 targetInst,

372 fakeNativeEvent,

@@ -398,7 +398,7 @@ function makeSimulator(eventType) {

398 function buildSimulators() {

399 ReactTestUtils.Simulate = {};

400

401 - var eventType;

401 + let eventType;

402 for (eventType in EventPluginRegistry.eventNameDispatchConfigs) {

403 /**

404 * @param {!Element|ReactDOMComponent} domComponentOrNode

@@ -409,12 +409,13 @@ function buildSimulators() {

409 }

410

411 // Rebuild ReactTestUtils.Simulate whenever event plugins are injected

412 -var oldInjectEventPluginOrder = EventPluginHub.injection.injectEventPluginOrder;

412 +const oldInjectEventPluginOrder =

413 + EventPluginHub.injection.injectEventPluginOrder;

414 EventPluginHub.injection.injectEventPluginOrder = function() {

415 oldInjectEventPluginOrder.apply(this, arguments);

416 buildSimulators();

417 };

417 -var oldInjectEventPlugins = EventPluginHub.injection.injectEventPluginsByName;

418 +const oldInjectEventPlugins = EventPluginHub.injection.injectEventPluginsByName;

419 EventPluginHub.injection.injectEventPluginsByName = function() {

420 oldInjectEventPlugins.apply(this, arguments);

421 buildSimulators();

@@ -440,7 +441,7 @@ buildSimulators();

441

442 function makeNativeSimulator(eventType) {

443 return function(domComponentOrNode, nativeEventData) {

443 - var fakeNativeEvent = new Event(eventType);

444 + const fakeNativeEvent = new Event(eventType);

445 Object.assign(fakeNativeEvent, nativeEventData);

446 if (ReactTestUtils.isDOMComponent(domComponentOrNode)) {

447 ReactTestUtils.simulateNativeEventOnDOMComponent(

@@ -461,7 +462,7 @@ function makeNativeSimulator(eventType) {

462

463 Object.keys(topLevelTypes).forEach(function(eventType) {

464 // Event type is stored as 'topClick' - we transform that to 'click'

464 - var convenienceName =

465 + const convenienceName =

466 eventType.indexOf('top') === 0

467 ? eventType.charAt(3).toLowerCase() + eventType.substr(4)

468 : eventType;

packages/react-dom/test-utils.js

+1 -1

@@ -9,7 +9,7 @@

10 'use strict';

12 -var ReactTestUtils = require('./src/test-utils/ReactTestUtils');

12 +const ReactTestUtils = require('./src/test-utils/ReactTestUtils');

14 // TODO: decide on the top-level export form.

15 // This is hacky but makes it work with both Rollup and Jest.