diff --git a/.eslintrc.js b/.eslintrc.js index 9f459489f0..af9d3de041 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -126,6 +126,7 @@ module.exports = { }, rules: { 'no-var': ERROR, + 'prefer-const': ERROR, strict: OFF, }, }, diff --git a/packages/babel-plugin-react-jsx/src/TransformJSXToReactBabelPlugin.js b/packages/babel-plugin-react-jsx/src/TransformJSXToReactBabelPlugin.js index 2d8ebc8c6e..aaea6a229b 100644 --- a/packages/babel-plugin-react-jsx/src/TransformJSXToReactBabelPlugin.js +++ b/packages/babel-plugin-react-jsx/src/TransformJSXToReactBabelPlugin.js @@ -115,7 +115,7 @@ You can turn on the 'throwIfNamespace' flag to bypass this warning.`, 'Fragment tags are only supported in React 16 and up.', ); } - let callExpr = buildJSXFragmentCall(path, file); + const callExpr = buildJSXFragmentCall(path, file); if (callExpr) { path.replaceWith(t.inherits(callExpr, path.node)); diff --git a/packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js b/packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js index b4bc461913..9e439da199 100644 --- a/packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js +++ b/packages/eslint-plugin-react-hooks/src/ExhaustiveDeps.js @@ -62,10 +62,10 @@ export default { const scopeManager = context.getSourceCode().scopeManager; // Should be shared between visitors. - let setStateCallSites = new WeakMap(); - let stateVariables = new WeakSet(); - let staticKnownValueCache = new WeakMap(); - let functionWithoutCapturedValueCache = new WeakMap(); + const setStateCallSites = new WeakMap(); + const stateVariables = new WeakSet(); + const staticKnownValueCache = new WeakMap(); + const functionWithoutCapturedValueCache = new WeakMap(); function memoizeWithWeakMap(fn, map) { return function(arg) { if (map.has(arg)) { @@ -400,12 +400,12 @@ export default { // Search the direct component subscopes for // top-level function definitions matching this reference. const fnNode = def.node; - let childScopes = componentScope.childScopes; + const childScopes = componentScope.childScopes; let fnScope = null; let i; for (i = 0; i < childScopes.length; i++) { - let childScope = childScopes[i]; - let childScopeBlock = childScope.block; + const childScope = childScopes[i]; + const childScopeBlock = childScope.block; if ( // function handleChange() {} (fnNode.type === 'FunctionDeclaration' && @@ -597,7 +597,7 @@ export default { // Warn about assigning to variables in the outer scope. // Those are usually bugs. - let staleAssignments = new Set(); + const staleAssignments = new Set(); function reportStaleAssignment(writeExpr, key) { if (staleAssignments.has(key)) { return; @@ -664,7 +664,7 @@ export default { }); }); if (setStateInsideEffectWithoutDeps) { - let {suggestedDependencies} = collectRecommendations({ + const {suggestedDependencies} = collectRecommendations({ dependencies, declaredDependencies: [], optionalDependencies, @@ -789,7 +789,7 @@ export default { }); } - let { + const { suggestedDependencies, unnecessaryDependencies, missingDependencies, @@ -802,6 +802,8 @@ export default { isEffect, }); + let suggestedDeps = suggestedDependencies; + const problemCount = duplicateDependencies.size + missingDependencies.size + @@ -871,7 +873,7 @@ export default { // for effects though because those have legit // use cases for over-specifying deps. if (!isEffect && missingDependencies.size > 0) { - suggestedDependencies = collectRecommendations({ + suggestedDeps = collectRecommendations({ dependencies, declaredDependencies: [], // Pretend we don't know optionalDependencies, @@ -890,7 +892,7 @@ export default { return declaredDepKeys.join(',') === sortedDeclaredDepKeys.join(','); } if (areDeclaredDepsAlphabetized()) { - suggestedDependencies.sort(); + suggestedDeps.sort(); } function getWarningMessage(deps, singlePrefix, label, fixVerb) { @@ -945,7 +947,7 @@ export default { // a `this` value. This warning can be confusing. // So if we're going to show it, append a clarification. if (!extraWarning && missingDependencies.has('props')) { - let propDep = dependencies.get('props'); + const propDep = dependencies.get('props'); if (propDep == null) { return; } @@ -1146,14 +1148,14 @@ export default { extraWarning, suggest: [ { - desc: `Update the dependencies array to be: [${suggestedDependencies.join( + desc: `Update the dependencies array to be: [${suggestedDeps.join( ', ', )}]`, fix(fixer) { // TODO: consider preserving the comments or formatting? return fixer.replaceText( declaredDependenciesNode, - `[${suggestedDependencies.join(', ')}]`, + `[${suggestedDeps.join(', ')}]`, ); }, }, @@ -1213,9 +1215,9 @@ function collectRecommendations({ // Tree manipulation helpers. function getOrCreateNodeByPath(rootNode, path) { - let keys = path.split('.'); + const keys = path.split('.'); let node = rootNode; - for (let key of keys) { + for (const key of keys) { let child = node.children.get(key); if (!child) { child = createDepTree(); @@ -1226,10 +1228,10 @@ function collectRecommendations({ return node; } function markAllParentsByPath(rootNode, path, fn) { - let keys = path.split('.'); + const keys = path.split('.'); let node = rootNode; - for (let key of keys) { - let child = node.children.get(key); + for (const key of keys) { + const child = node.children.get(key); if (!child) { return; } @@ -1239,8 +1241,8 @@ function collectRecommendations({ } // Now we can learn which dependencies are missing or necessary. - let missingDependencies = new Set(); - let satisfyingDependencies = new Set(); + const missingDependencies = new Set(); + const satisfyingDependencies = new Set(); scanTreeRecursively( depTree, missingDependencies, @@ -1277,9 +1279,9 @@ function collectRecommendations({ } // Collect suggestions in the order they were originally specified. - let suggestedDependencies = []; - let unnecessaryDependencies = new Set(); - let duplicateDependencies = new Set(); + const suggestedDependencies = []; + const unnecessaryDependencies = new Set(); + const duplicateDependencies = new Set(); declaredDependencies.forEach(({key}) => { // Does this declared dep satisfy a real need? if (satisfyingDependencies.has(key)) { @@ -1337,7 +1339,7 @@ function scanForDeclaredBareFunctions({ if (fnRef == null) { return null; } - let fnNode = fnRef.defs[0]; + const fnNode = fnRef.defs[0]; if (fnNode == null) { return null; } @@ -1461,7 +1463,7 @@ function getNodeWithoutReactNamespace(node, options) { // 1 for useImperativeHandle(ref, fn). // For additionally configured Hooks, assume that they're like useEffect (0). function getReactiveHookCallbackIndex(calleeNode, options) { - let node = getNodeWithoutReactNamespace(calleeNode); + const node = getNodeWithoutReactNamespace(calleeNode); if (node.type !== 'Identifier') { return -1; } @@ -1507,7 +1509,7 @@ function getReactiveHookCallbackIndex(calleeNode, options) { * - agnostic to AST node types, it looks for `{ type: string, ... }` */ function fastFindReferenceWithParent(start, target) { - let queue = [start]; + const queue = [start]; let item = null; while (queue.length) { @@ -1521,7 +1523,7 @@ function fastFindReferenceWithParent(start, target) { continue; } - for (let [key, value] of Object.entries(item)) { + for (const [key, value] of Object.entries(item)) { if (key === 'parent') { continue; } diff --git a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js index c5b2e73f83..db4d16582b 100644 --- a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js +++ b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js @@ -226,7 +226,7 @@ export default { function countPathsToEnd(segment, pathHistory) { const {cache} = countPathsToEnd; let paths = cache.get(segment.id); - let pathList = new Set(pathHistory); + const pathList = new Set(pathHistory); // If `pathList` includes the current segment then we've found a cycle! // We need to fill `cyclic` with all segments inside cycle diff --git a/packages/jest-react/src/JestReact.js b/packages/jest-react/src/JestReact.js index 26d116a7f9..57790797b9 100644 --- a/packages/jest-react/src/JestReact.js +++ b/packages/jest-react/src/JestReact.js @@ -99,7 +99,7 @@ function jsonChildrenToJSXChildren(jsonChildren) { if (jsonChildren.length === 1) { return jsonChildToJSXChild(jsonChildren[0]); } else if (jsonChildren.length > 1) { - let jsxChildren = []; + const jsxChildren = []; let allJSXChildrenAreStrings = true; let jsxChildrenString = ''; for (let i = 0; i < jsonChildren.length; i++) { diff --git a/packages/legacy-events/getListener.js b/packages/legacy-events/getListener.js index 8ef609c7b3..5be8ccceaf 100644 --- a/packages/legacy-events/getListener.js +++ b/packages/legacy-events/getListener.js @@ -46,8 +46,6 @@ function shouldPreventMouseEvent(name, type, props) { * @return {?function} The stored callback. */ export default function getListener(inst: Fiber, registrationName: string) { - let listener; - // TODO: shouldPreventMouseEvent is DOM-specific and definitely should not // live here; needs to be moved to a better place soon const stateNode = inst.stateNode; @@ -60,7 +58,7 @@ export default function getListener(inst: Fiber, registrationName: string) { // Work in progress. return null; } - listener = props[registrationName]; + const listener = props[registrationName]; if (shouldPreventMouseEvent(registrationName, inst.type, props)) { return null; } diff --git a/packages/react-art/src/ReactARTHostConfig.js b/packages/react-art/src/ReactARTHostConfig.js index 28bbc236b1..1b010e0996 100644 --- a/packages/react-art/src/ReactARTHostConfig.js +++ b/packages/react-art/src/ReactARTHostConfig.js @@ -68,7 +68,7 @@ function createEventHandler(instance) { function destroyEventListeners(instance) { if (instance._subscriptions) { - for (let type in instance._subscriptions) { + for (const type in instance._subscriptions) { instance._subscriptions[type](); } } @@ -170,7 +170,7 @@ function applyNodeProps(instance, props, prevProps = {}) { } } - for (let type in EVENT_TYPES) { + for (const type in EVENT_TYPES) { addEventListeners(instance, EVENT_TYPES[type], props[type]); } } diff --git a/packages/react-cache/src/ReactCache.js b/packages/react-cache/src/ReactCache.js index 16d516064b..577ec6bb1a 100644 --- a/packages/react-cache/src/ReactCache.js +++ b/packages/react-cache/src/ReactCache.js @@ -97,7 +97,7 @@ function accessResult( entriesForResource = new Map(); entries.set(resource, entriesForResource); } - let entry = entriesForResource.get(key); + const entry = entriesForResource.get(key); if (entry === undefined) { const thenable = fetch(input); thenable.then( diff --git a/packages/react-cache/src/__tests__/ReactCache-test.internal.js b/packages/react-cache/src/__tests__/ReactCache-test.internal.js index 0a459fc9d3..24c3b3d390 100644 --- a/packages/react-cache/src/__tests__/ReactCache-test.internal.js +++ b/packages/react-cache/src/__tests__/ReactCache-test.internal.js @@ -303,7 +303,7 @@ describe('ReactCache', () => { const BadTextResource = createResource( ([text, ms = 0]) => { let listeners = null; - let value = null; + const value = null; return { then(resolve, reject) { if (value !== null) { diff --git a/packages/react-client/src/ReactFlightClient.js b/packages/react-client/src/ReactFlightClient.js index 6c22df48b0..14f4aaaa05 100644 --- a/packages/react-client/src/ReactFlightClient.js +++ b/packages/react-client/src/ReactFlightClient.js @@ -62,7 +62,7 @@ function Chunk(status: any, value: any) { this._value = value; } Chunk.prototype.then = function(resolve: () => mixed) { - let chunk: SomeChunk = this; + const chunk: SomeChunk = this; if (chunk._status === PENDING) { if (chunk._value === null) { chunk._value = []; @@ -81,8 +81,8 @@ export type Response = { }; function readRoot(): T { - let response: Response = this; - let rootChunk = response.rootChunk; + const response: Response = this; + const rootChunk = response.rootChunk; if (rootChunk._status === RESOLVED) { return rootChunk._value; } else if (rootChunk._status === PENDING) { @@ -94,10 +94,10 @@ function readRoot(): T { } export function createResponse(): Response { - let rootChunk: SomeChunk = createPendingChunk(); - let chunks: Map> = new Map(); + const rootChunk: SomeChunk = createPendingChunk(); + const chunks: Map> = new Map(); chunks.set(0, rootChunk); - let response = { + const response = { partialRow: '', rootChunk, chunks: chunks, @@ -117,7 +117,7 @@ function createErrorChunk(error: Error): ErroredChunk { function wakeChunk(listeners: null | Array<() => mixed>) { if (listeners !== null) { for (let i = 0; i < listeners.length; i++) { - let listener = listeners[i]; + const listener = listeners[i]; listener(); } } @@ -128,8 +128,8 @@ function triggerErrorOnChunk(chunk: SomeChunk, error: Error): void { // We already resolved. We didn't expect to see this. return; } - let listeners = chunk._value; - let erroredChunk: ErroredChunk = (chunk: any); + const listeners = chunk._value; + const erroredChunk: ErroredChunk = (chunk: any); erroredChunk._status = ERRORED; erroredChunk._value = error; wakeChunk(listeners); @@ -144,8 +144,8 @@ function resolveChunk(chunk: SomeChunk, value: T): void { // We already resolved. We didn't expect to see this. return; } - let listeners = chunk._value; - let resolvedChunk: ResolvedChunk = (chunk: any); + const listeners = chunk._value; + const resolvedChunk: ResolvedChunk = (chunk: any); resolvedChunk._status = RESOLVED; resolvedChunk._value = value; wakeChunk(listeners); @@ -170,7 +170,7 @@ function readMaybeChunk(maybeChunk: SomeChunk | T): T { // $FlowFixMe return maybeChunk; } - let chunk: SomeChunk = (maybeChunk: any); + const chunk: SomeChunk = (maybeChunk: any); if (chunk._status === RESOLVED) { return chunk._value; } else if (chunk._status === PENDING) { @@ -232,18 +232,18 @@ function initializeBlock( tuple: UninitializedBlockPayload, ): BlockComponent { // Require module first and then data. The ordering matters. - let moduleMetaData: ModuleMetaData = readMaybeChunk(tuple[1]); - let moduleReference: ModuleReference< + const moduleMetaData: ModuleMetaData = readMaybeChunk(tuple[1]); + const moduleReference: ModuleReference< BlockRenderFunction, > = resolveModuleReference(moduleMetaData); // TODO: Do this earlier, as the chunk is resolved. preloadModule(moduleReference); - let moduleExport = requireModule(moduleReference); + const moduleExport = requireModule(moduleReference); // The ordering here is important because this call might suspend. // We don't want that to prevent the module graph for being initialized. - let data: Data = readMaybeChunk(tuple[2]); + const data: Data = readMaybeChunk(tuple[2]); return { $$typeof: REACT_BLOCK_TYPE, @@ -256,7 +256,7 @@ function initializeBlock( function createLazyBlock( tuple: UninitializedBlockPayload, ): LazyComponent, UninitializedBlockPayload> { - let lazyType: LazyComponent< + const lazyType: LazyComponent< BlockComponent, UninitializedBlockPayload, > = { @@ -281,8 +281,8 @@ export function parseModelFromJSON( // This was an escaped string value. return value.substring(1); } else { - let id = parseInt(value.substring(1), 16); - let chunks = response.chunks; + const id = parseInt(value.substring(1), 16); + const chunks = response.chunks; let chunk = chunks.get(id); if (!chunk) { chunk = createPendingChunk(); @@ -296,7 +296,7 @@ export function parseModelFromJSON( } } if (typeof value === 'object' && value !== null) { - let tuple: [mixed, mixed, mixed, mixed] = (value: any); + const tuple: [mixed, mixed, mixed, mixed] = (value: any); switch (tuple[0]) { case REACT_ELEMENT_TYPE: { // TODO: Consider having React just directly accept these arrays as elements. @@ -317,8 +317,8 @@ export function resolveModelChunk( id: number, model: M, ): void { - let chunks = response.chunks; - let chunk = chunks.get(id); + const chunks = response.chunks; + const chunk = chunks.get(id); if (!chunk) { chunks.set(id, createResolvedChunk(model)); } else { @@ -332,10 +332,10 @@ export function resolveErrorChunk( message: string, stack: string, ): void { - let error = new Error(message); + const error = new Error(message); error.stack = stack; - let chunks = response.chunks; - let chunk = chunks.get(id); + const chunks = response.chunks; + const chunk = chunks.get(id); if (!chunk) { chunks.set(id, createErrorChunk(error)); } else { diff --git a/packages/react-client/src/ReactFlightClientStream.js b/packages/react-client/src/ReactFlightClientStream.js index b7fc86469f..2753814b7e 100644 --- a/packages/react-client/src/ReactFlightClientStream.js +++ b/packages/react-client/src/ReactFlightClientStream.js @@ -31,7 +31,7 @@ export type Response = ResponseBase & { }; export function createResponse(): Response { - let response: Response = (createResponseImpl(): any); + const response: Response = (createResponseImpl(): any); response.fromJSON = function(key: string, value: JSONValue) { return parseModelFromJSON(response, this, key, value); }; @@ -45,27 +45,27 @@ function processFullRow(response: Response, row: string): void { if (row === '') { return; } - let tag = row[0]; + const tag = row[0]; switch (tag) { case 'J': { - let colon = row.indexOf(':', 1); - let id = parseInt(row.substring(1, colon), 16); - let json = row.substring(colon + 1); - let model = JSON.parse(json, response.fromJSON); + const colon = row.indexOf(':', 1); + const id = parseInt(row.substring(1, colon), 16); + const json = row.substring(colon + 1); + const model = JSON.parse(json, response.fromJSON); resolveModelChunk(response, id, model); return; } case 'E': { - let colon = row.indexOf(':', 1); - let id = parseInt(row.substring(1, colon), 16); - let json = row.substring(colon + 1); - let errorInfo = JSON.parse(json); + const colon = row.indexOf(':', 1); + const id = parseInt(row.substring(1, colon), 16); + const json = row.substring(colon + 1); + const errorInfo = JSON.parse(json); resolveErrorChunk(response, id, errorInfo.message, errorInfo.stack); return; } default: { // Assume this is the root model. - let model = JSON.parse(row, response.fromJSON); + const model = JSON.parse(row, response.fromJSON); resolveModelChunk(response, 0, model); return; } @@ -79,7 +79,7 @@ export function processStringChunk( ): void { let linebreak = chunk.indexOf('\n', offset); while (linebreak > -1) { - let fullrow = response.partialRow + chunk.substring(offset, linebreak); + const fullrow = response.partialRow + chunk.substring(offset, linebreak); processFullRow(response, fullrow); response.partialRow = ''; offset = linebreak + 1; @@ -95,10 +95,10 @@ export function processBinaryChunk( if (!supportsBinaryStreams) { throw new Error("This environment don't support binary chunks."); } - let stringDecoder = response.stringDecoder; + const stringDecoder = response.stringDecoder; let linebreak = chunk.indexOf(10); // newline while (linebreak > -1) { - let fullrow = + const fullrow = response.partialRow + readFinalStringChunk(stringDecoder, chunk.subarray(0, linebreak)); processFullRow(response, fullrow); diff --git a/packages/react-client/src/__tests__/ReactFlight-test.js b/packages/react-client/src/__tests__/ReactFlight-test.js index b390d0c07f..8e877ea101 100644 --- a/packages/react-client/src/__tests__/ReactFlight-test.js +++ b/packages/react-client/src/__tests__/ReactFlight-test.js @@ -38,7 +38,7 @@ describe('ReactFlight', () => { }; } return function(...args) { - let curriedLoad = () => { + const curriedLoad = () => { return load(...args); }; return ReactNoopFlightServerRuntime.serverBlock(render, curriedLoad); @@ -58,10 +58,10 @@ describe('ReactFlight', () => { ), }; } - let transport = ReactNoopFlightServer.render({ + const transport = ReactNoopFlightServer.render({ foo: , }); - let model = ReactNoopFlightClient.read(transport); + const model = ReactNoopFlightClient.read(transport); expect(model).toEqual({ foo: { bar: ( @@ -84,16 +84,16 @@ describe('ReactFlight', () => { ); } - let loadUser = block(User); - let model = { + const loadUser = block(User); + const model = { User: loadUser('Seb', 'Smith'), }; - let transport = ReactNoopFlightServer.render(model); + const transport = ReactNoopFlightServer.render(model); act(() => { - let rootModel = ReactNoopFlightClient.read(transport); - let UserClient = rootModel.User; + const rootModel = ReactNoopFlightClient.read(transport); + const UserClient = rootModel.User; ReactNoop.render(); }); @@ -111,16 +111,16 @@ describe('ReactFlight', () => { ); } - let loadUser = block(User, load); - let model = { + const loadUser = block(User, load); + const model = { User: loadUser('Seb', 'Smith'), }; - let transport = ReactNoopFlightServer.render(model); + const transport = ReactNoopFlightServer.render(model); act(() => { - let rootModel = ReactNoopFlightClient.read(transport); - let UserClient = rootModel.User; + const rootModel = ReactNoopFlightClient.read(transport); + const UserClient = rootModel.User; ReactNoop.render(); }); diff --git a/packages/react-debug-tools/src/ReactDebugHooks.js b/packages/react-debug-tools/src/ReactDebugHooks.js index a338dd0526..1fab259eb1 100644 --- a/packages/react-debug-tools/src/ReactDebugHooks.js +++ b/packages/react-debug-tools/src/ReactDebugHooks.js @@ -65,7 +65,7 @@ function getPrimitiveStackCache(): Map> { // This initializes a cache of all primitive hooks so that the top // most stack frames added by calling the primitive hook can be removed. if (primitiveStackCache === null) { - let cache = new Map(); + const cache = new Map(); let readHookLog; try { // Use all hooks here to add them to the hook log. @@ -94,7 +94,7 @@ function getPrimitiveStackCache(): Map> { hookLog = []; } for (let i = 0; i < readHookLog.length; i++) { - let hook = readHookLog[i]; + const hook = readHookLog[i]; cache.set(hook.primitive, ErrorStackParser.parse(hook.stackError)); } primitiveStackCache = cache; @@ -104,7 +104,7 @@ function getPrimitiveStackCache(): Map> { let currentHook: null | Hook = null; function nextHook(): null | Hook { - let hook = currentHook; + const hook = currentHook; if (hook !== null) { currentHook = hook.next; } @@ -134,8 +134,8 @@ function useContext( function useState( initialState: (() => S) | S, ): [S, Dispatch>] { - let hook = nextHook(); - let state: S = + const hook = nextHook(); + const state: S = hook !== null ? hook.memoizedState : typeof initialState === 'function' @@ -151,7 +151,7 @@ function useReducer( initialArg: I, init?: I => S, ): [S, Dispatch] { - let hook = nextHook(); + const hook = nextHook(); let state; if (hook !== null) { state = hook.memoizedState; @@ -167,8 +167,8 @@ function useReducer( } function useRef(initialValue: T): {|current: T|} { - let hook = nextHook(); - let ref = hook !== null ? hook.memoizedState : {current: initialValue}; + const hook = nextHook(); + const ref = hook !== null ? hook.memoizedState : {current: initialValue}; hookLog.push({ primitive: 'Ref', stackError: new Error(), @@ -227,7 +227,7 @@ function useDebugValue(value: any, formatterFn: ?(value: any) => any) { } function useCallback(callback: T, inputs: Array | void | null): T { - let hook = nextHook(); + const hook = nextHook(); hookLog.push({ primitive: 'Callback', stackError: new Error(), @@ -240,8 +240,8 @@ function useMemo( nextCreate: () => T, inputs: Array | void | null, ): T { - let hook = nextHook(); - let value = hook !== null ? hook.memoizedState[0] : nextCreate(); + const hook = nextHook(); + const value = hook !== null ? hook.memoizedState[0] : nextCreate(); hookLog.push({primitive: 'Memo', stackError: new Error(), value}); return value; } @@ -367,7 +367,7 @@ export type HooksTree = Array; let mostLikelyAncestorIndex = 0; function findSharedIndex(hookStack, rootStack, rootIndex) { - let source = rootStack[rootIndex].source; + const source = rootStack[rootIndex].source; hookSearch: for (let i = 0; i < hookStack.length; i++) { if (hookStack[i].source === source) { // This looks like a match. Validate that the rest of both stack match up. @@ -412,7 +412,7 @@ function isReactWrapper(functionName, primitiveName) { if (!functionName) { return false; } - let expectedPrimitiveName = 'use' + primitiveName; + const expectedPrimitiveName = 'use' + primitiveName; if (functionName.length < expectedPrimitiveName.length) { return false; } @@ -423,8 +423,8 @@ function isReactWrapper(functionName, primitiveName) { } function findPrimitiveIndex(hookStack, hook) { - let stackCache = getPrimitiveStackCache(); - let primitiveStack = stackCache.get(hook.primitive); + const stackCache = getPrimitiveStackCache(); + const primitiveStack = stackCache.get(hook.primitive); if (primitiveStack === undefined) { return -1; } @@ -453,9 +453,9 @@ function findPrimitiveIndex(hookStack, hook) { function parseTrimmedStack(rootStack, hook) { // Get the stack trace between the primitive hook function and // the root function call. I.e. the stack frames of custom hooks. - let hookStack = ErrorStackParser.parse(hook.stackError); - let rootIndex = findCommonAncestorIndex(rootStack, hookStack); - let primitiveIndex = findPrimitiveIndex(hookStack, hook); + const hookStack = ErrorStackParser.parse(hook.stackError); + const rootIndex = findCommonAncestorIndex(rootStack, hookStack); + const primitiveIndex = findPrimitiveIndex(hookStack, hook); if ( rootIndex === -1 || primitiveIndex === -1 || @@ -482,14 +482,14 @@ function parseCustomHookName(functionName: void | string): string { } function buildTree(rootStack, readHookLog): HooksTree { - let rootChildren = []; + const rootChildren = []; let prevStack = null; let levelChildren = rootChildren; let nativeHookID = 0; - let stackOfChildren = []; + const stackOfChildren = []; for (let i = 0; i < readHookLog.length; i++) { - let hook = readHookLog[i]; - let stack = parseTrimmedStack(rootStack, hook); + const hook = readHookLog[i]; + const stack = parseTrimmedStack(rootStack, hook); if (stack !== null) { // Note: The indices 0 <= n < length-1 will contain the names. // The indices 1 <= n < length will contain the source locations. @@ -499,8 +499,9 @@ function buildTree(rootStack, readHookLog): HooksTree { if (prevStack !== null) { // Compare the current level's stack to the new stack. while (commonSteps < stack.length && commonSteps < prevStack.length) { - let stackSource = stack[stack.length - commonSteps - 1].source; - let prevSource = prevStack[prevStack.length - commonSteps - 1].source; + const stackSource = stack[stack.length - commonSteps - 1].source; + const prevSource = + prevStack[prevStack.length - commonSteps - 1].source; if (stackSource !== prevSource) { break; } @@ -514,7 +515,7 @@ function buildTree(rootStack, readHookLog): HooksTree { // The remaining part of the new stack are custom hooks. Push them // to the tree. for (let j = stack.length - commonSteps - 1; j >= 1; j--) { - let children = []; + const children = []; levelChildren.push({ id: null, isStateEditable: false, @@ -563,7 +564,7 @@ function processDebugValues( hooksTree: HooksTree, parentHooksNode: HooksNode | null, ): void { - let debugValueHooksNodes: Array = []; + const debugValueHooksNodes: Array = []; for (let i = 0; i < hooksTree.length; i++) { const hooksNode = hooksTree[i]; @@ -599,7 +600,7 @@ export function inspectHooks( currentDispatcher = ReactSharedInternals.ReactCurrentDispatcher; } - let previousDispatcher = currentDispatcher.current; + const previousDispatcher = currentDispatcher.current; let readHookLog; currentDispatcher.current = Dispatcher; let ancestorStackError; @@ -611,7 +612,7 @@ export function inspectHooks( hookLog = []; currentDispatcher.current = previousDispatcher; } - let rootStack = ErrorStackParser.parse(ancestorStackError); + const rootStack = ErrorStackParser.parse(ancestorStackError); return buildTree(rootStack, readHookLog); } @@ -642,7 +643,7 @@ function inspectHooksOfForwardRef( ref: Ref, currentDispatcher: CurrentDispatcherRef, ): HooksTree { - let previousDispatcher = currentDispatcher.current; + const previousDispatcher = currentDispatcher.current; let readHookLog; currentDispatcher.current = Dispatcher; let ancestorStackError; @@ -654,7 +655,7 @@ function inspectHooksOfForwardRef( hookLog = []; currentDispatcher.current = previousDispatcher; } - let rootStack = ErrorStackParser.parse(ancestorStackError); + const rootStack = ErrorStackParser.parse(ancestorStackError); return buildTree(rootStack, readHookLog); } @@ -663,7 +664,7 @@ function resolveDefaultProps(Component, baseProps) { // Resolve default props. Taken from ReactElement const props = Object.assign({}, baseProps); const defaultProps = Component.defaultProps; - for (let propName in defaultProps) { + for (const propName in defaultProps) { if (props[propName] === undefined) { props[propName] = defaultProps[propName]; } @@ -695,7 +696,7 @@ export function inspectHooksOfFiber( } // Warm up the cache so that it doesn't consume the currentHook. getPrimitiveStackCache(); - let type = fiber.type; + const type = fiber.type; let props = fiber.memoizedProps; if (type !== fiber.elementType) { props = resolveDefaultProps(type, props); @@ -703,7 +704,7 @@ export function inspectHooksOfFiber( // Set up the current hook so that we can step through and read the // current state from them. currentHook = (fiber.memoizedState: Hook); - let contextMap = new Map(); + const contextMap = new Map(); try { setupContexts(contextMap, fiber); if (fiber.tag === ForwardRef) { diff --git a/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.internal.js b/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.internal.js index b8617a76e9..326e3c39bf 100644 --- a/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.internal.js +++ b/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.internal.js @@ -39,7 +39,7 @@ describe('ReactHooksInspection', () => { }); return
Hello world
; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, @@ -65,7 +65,7 @@ describe('ReactHooksInspection', () => { React.useEffect(effect); return
Hello world
; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, diff --git a/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.js b/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.js index f1c54cdecb..49786ddfd8 100644 --- a/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.js +++ b/packages/react-debug-tools/src/__tests__/ReactHooksInspection-test.js @@ -22,10 +22,10 @@ describe('ReactHooksInspection', () => { it('should inspect a simple useState hook', () => { function Foo(props) { - let [state] = React.useState('hello world'); + const [state] = React.useState('hello world'); return
{state}
; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: true, @@ -39,15 +39,15 @@ describe('ReactHooksInspection', () => { it('should inspect a simple custom hook', () => { function useCustom(value) { - let [state] = React.useState(value); + const [state] = React.useState(value); React.useDebugValue('custom hook label'); return state; } function Foo(props) { - let value = useCustom('hello world'); + const value = useCustom('hello world'); return
{value}
; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, @@ -70,20 +70,20 @@ describe('ReactHooksInspection', () => { it('should inspect a tree of multiple hooks', () => { function effect() {} function useCustom(value) { - let [state] = React.useState(value); + const [state] = React.useState(value); React.useEffect(effect); return state; } function Foo(props) { - let value1 = useCustom('hello'); - let value2 = useCustom('world'); + const value1 = useCustom('hello'); + const value2 = useCustom('world'); return (
{value1} {value2}
); } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, @@ -135,30 +135,30 @@ describe('ReactHooksInspection', () => { it('should inspect a tree of multiple levels of hooks', () => { function effect() {} function useCustom(value) { - let [state] = React.useReducer((s, a) => s, value); + const [state] = React.useReducer((s, a) => s, value); React.useEffect(effect); return state; } function useBar(value) { - let result = useCustom(value); + const result = useCustom(value); React.useLayoutEffect(effect); return result; } function useBaz(value) { React.useLayoutEffect(effect); - let result = useCustom(value); + const result = useCustom(value); return result; } function Foo(props) { - let value1 = useBar('hello'); - let value2 = useBaz('world'); + const value1 = useBar('hello'); + const value2 = useBaz('world'); return (
{value1} {value2}
); } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, @@ -238,12 +238,12 @@ describe('ReactHooksInspection', () => { }); it('should inspect the default value using the useContext hook', () => { - let MyContext = React.createContext('default'); + const MyContext = React.createContext('default'); function Foo(props) { - let value = React.useContext(MyContext); + const value = React.useContext(MyContext); return
{value}
; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, @@ -257,15 +257,15 @@ describe('ReactHooksInspection', () => { it('should support an injected dispatcher', () => { function Foo(props) { - let [state] = React.useState('hello world'); + const [state] = React.useState('hello world'); return
{state}
; } - let initial = {}; + const initial = {}; let current = initial; let getterCalls = 0; - let setterCalls = []; - let FakeDispatcherRef = { + const setterCalls = []; + const FakeDispatcherRef = { get current() { getterCalls++; return current; @@ -299,7 +299,7 @@ describe('ReactHooksInspection', () => { React.useDebugValue('this is invalid'); return null; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toHaveLength(0); }); @@ -312,7 +312,7 @@ describe('ReactHooksInspection', () => { useCustom(); return null; } - let tree = ReactDebugTools.inspectHooks(Foo, {}); + const tree = ReactDebugTools.inspectHooks(Foo, {}); expect(tree).toEqual([ { isStateEditable: false, diff --git a/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js b/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js index 8bece8f1ca..ef41b65426 100644 --- a/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js +++ b/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js @@ -27,17 +27,17 @@ describe('ReactHooksInspectionIntegration', () => { }); it('should inspect the current state of useState hooks', () => { - let useState = React.useState; + const useState = React.useState; function Foo(props) { - let [state1, setState1] = useState('hello'); - let [state2, setState2] = useState('world'); + const [state1, setState1] = useState('hello'); + const [state2, setState2] = useState('world'); return (
{state1} {state2}
); } - let renderer = ReactTestRenderer.create(); + const renderer = ReactTestRenderer.create(); let childFiber = renderer.root.findByType(Foo)._currentFiber(); let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); @@ -58,7 +58,7 @@ describe('ReactHooksInspectionIntegration', () => { }, ]); - let { + const { onMouseDown: setStateA, onMouseUp: setStateB, } = renderer.root.findByType('div').props; @@ -109,12 +109,12 @@ describe('ReactHooksInspectionIntegration', () => { }); it('should inspect the current state of all stateful hooks', () => { - let outsideRef = React.createRef(); + const outsideRef = React.createRef(); function effect() {} function Foo(props) { - let [state1, setState] = React.useState('a'); - let [state2, dispatch] = React.useReducer((s, a) => a.value, 'b'); - let ref = React.useRef('c'); + const [state1, setState] = React.useState('a'); + const [state2, dispatch] = React.useReducer((s, a) => a.value, 'b'); + const ref = React.useRef('c'); React.useLayoutEffect(effect); React.useEffect(effect); @@ -139,7 +139,7 @@ describe('ReactHooksInspectionIntegration', () => { }); ref.current = 'C'; } - let memoizedUpdate = React.useCallback(update, []); + const memoizedUpdate = React.useCallback(update, []); return (
{state1} {state2} @@ -153,7 +153,7 @@ describe('ReactHooksInspectionIntegration', () => { let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let {onClick: updateStates} = renderer.root.findByType('div').props; + const {onClick: updateStates} = renderer.root.findByType('div').props; let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ @@ -269,18 +269,18 @@ describe('ReactHooksInspectionIntegration', () => { }); it('should inspect the value of the current provider in useContext', () => { - let MyContext = React.createContext('default'); + const MyContext = React.createContext('default'); function Foo(props) { - let value = React.useContext(MyContext); + const value = React.useContext(MyContext); return
{value}
; } - let renderer = ReactTestRenderer.create( + const renderer = ReactTestRenderer.create( , ); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -293,16 +293,16 @@ describe('ReactHooksInspectionIntegration', () => { }); it('should inspect forwardRef', () => { - let obj = function() {}; - let Foo = React.forwardRef(function(props, ref) { + const obj = function() {}; + const Foo = React.forwardRef(function(props, ref) { React.useImperativeHandle(ref, () => obj); return
; }); - let ref = React.createRef(); - let renderer = ReactTestRenderer.create(); + const ref = React.createRef(); + const renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -316,14 +316,14 @@ describe('ReactHooksInspectionIntegration', () => { it('should inspect memo', () => { function InnerFoo(props) { - let [value] = React.useState('hello'); + const [value] = React.useState('hello'); return
{value}
; } - let Foo = React.memo(InnerFoo); - let renderer = ReactTestRenderer.create(); + const Foo = React.memo(InnerFoo); + const renderer = ReactTestRenderer.create(); // TODO: Test renderer findByType is broken for memo. Have to search for the inner. - let childFiber = renderer.root.findByType(InnerFoo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const childFiber = renderer.root.findByType(InnerFoo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: true, @@ -337,16 +337,16 @@ describe('ReactHooksInspectionIntegration', () => { it('should inspect custom hooks', () => { function useCustom() { - let [value] = React.useState('hello'); + const [value] = React.useState('hello'); return value; } function Foo(props) { - let value = useCustom(); + const value = useCustom(); return
{value}
; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -373,9 +373,9 @@ describe('ReactHooksInspectionIntegration', () => { const memoizedValue = React.useMemo(() => 'hello', []); return
{memoizedValue}
; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { id: 0, @@ -402,9 +402,9 @@ describe('ReactHooksInspectionIntegration', () => { const [state] = React.useState(() => 'hello', []); return
{state}
; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { id: 0, @@ -427,12 +427,12 @@ describe('ReactHooksInspectionIntegration', () => { describe('useDebugValue', () => { it('should support inspectable values for multiple custom hooks', () => { function useLabeledValue(label) { - let [value] = React.useState(label); + const [value] = React.useState(label); React.useDebugValue(`custom label ${label}`); return value; } function useAnonymous(label) { - let [value] = React.useState(label); + const [value] = React.useState(label); return value; } function Example() { @@ -442,9 +442,9 @@ describe('ReactHooksInspectionIntegration', () => { useLabeledValue('d'); return null; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Example)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Example)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -514,9 +514,9 @@ describe('ReactHooksInspectionIntegration', () => { useOuter(); return null; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Example)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Example)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -561,9 +561,9 @@ describe('ReactHooksInspectionIntegration', () => { useSingleLabelCustom('two'); return null; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Example)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Example)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -618,9 +618,9 @@ describe('ReactHooksInspectionIntegration', () => { React.useDebugValue('this is invalid'); return null; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Example)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Example)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toHaveLength(0); }); @@ -633,9 +633,9 @@ describe('ReactHooksInspectionIntegration', () => { useCustom(); return null; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Example)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Example)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: false, @@ -657,10 +657,10 @@ describe('ReactHooksInspectionIntegration', () => { }); it('should support defaultProps and lazy', async () => { - let Suspense = React.Suspense; + const Suspense = React.Suspense; function Foo(props) { - let [value] = React.useState(props.defaultValue.substr(0, 3)); + const [value] = React.useState(props.defaultValue.substr(0, 3)); return
{value}
; } Foo.defaultProps = { @@ -671,9 +671,9 @@ describe('ReactHooksInspectionIntegration', () => { return {default: result}; } - let LazyFoo = React.lazy(() => fakeImport(Foo)); + const LazyFoo = React.lazy(() => fakeImport(Foo)); - let renderer = ReactTestRenderer.create( + const renderer = ReactTestRenderer.create( , @@ -683,8 +683,8 @@ describe('ReactHooksInspectionIntegration', () => { Scheduler.unstable_flushAll(); - let childFiber = renderer.root._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const childFiber = renderer.root._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { isStateEditable: true, @@ -698,15 +698,15 @@ describe('ReactHooksInspectionIntegration', () => { it('should support an injected dispatcher', () => { function Foo(props) { - let [state] = React.useState('hello world'); + const [state] = React.useState('hello world'); return
{state}
; } - let initial = {}; + const initial = {}; let current = initial; let getterCalls = 0; - let setterCalls = []; - let FakeDispatcherRef = { + const setterCalls = []; + const FakeDispatcherRef = { get current() { getterCalls++; return current; @@ -717,8 +717,8 @@ describe('ReactHooksInspectionIntegration', () => { }, }; - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root._currentFiber(); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root._currentFiber(); expect(() => { ReactDebugTools.inspectHooksOfFiber(childFiber, FakeDispatcherRef); }).toThrow( @@ -798,9 +798,9 @@ describe('ReactHooksInspectionIntegration', () => { React.useMemo(() => 'memo', []); return
; } - let renderer = ReactTestRenderer.create(); - let childFiber = renderer.root.findByType(Foo)._currentFiber(); - let tree = ReactDebugTools.inspectHooksOfFiber(childFiber); + const renderer = ReactTestRenderer.create(); + const childFiber = renderer.root.findByType(Foo)._currentFiber(); + const tree = ReactDebugTools.inspectHooksOfFiber(childFiber); expect(tree).toEqual([ { id: 0, diff --git a/packages/react-devtools-core/src/editor.js b/packages/react-devtools-core/src/editor.js index bbe3fa63d9..5d53cf9215 100644 --- a/packages/react-devtools-core/src/editor.js +++ b/packages/react-devtools-core/src/editor.js @@ -156,11 +156,13 @@ export function launchEditor( return; } - let [editor, ...args] = guessEditor(); + const [editor, ...destructuredArgs] = guessEditor(); if (!editor) { return; } + let args = destructuredArgs; + if (lineNumber) { args = args.concat(getArgumentsForLineNumber(editor, filePath, lineNumber)); } else { diff --git a/packages/react-devtools-extensions/src/main.js b/packages/react-devtools-extensions/src/main.js index 74144f3392..4416fe6b84 100644 --- a/packages/react-devtools-extensions/src/main.js +++ b/packages/react-devtools-extensions/src/main.js @@ -228,11 +228,11 @@ function createPanelIfReactLoaded() { cloneStyleTags = () => { const linkTags = []; // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let linkTag of document.getElementsByTagName('link')) { + for (const linkTag of document.getElementsByTagName('link')) { if (linkTag.rel === 'stylesheet') { const newLinkTag = document.createElement('link'); // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let attribute of linkTag.attributes) { + for (const attribute of linkTag.attributes) { newLinkTag.setAttribute(attribute.nodeName, attribute.nodeValue); } linkTags.push(newLinkTag); diff --git a/packages/react-devtools-extensions/src/panel.js b/packages/react-devtools-extensions/src/panel.js index de7d8a68fc..202b7cf4d6 100644 --- a/packages/react-devtools-extensions/src/panel.js +++ b/packages/react-devtools-extensions/src/panel.js @@ -12,7 +12,7 @@ window.injectStyles = getLinkTags => { const linkTags = getLinkTags(); // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let linkTag of linkTags) { + for (const linkTag of linkTags) { document.head.appendChild(linkTag); } } diff --git a/packages/react-devtools-shared/src/__tests__/profilingCache-test.js b/packages/react-devtools-shared/src/__tests__/profilingCache-test.js index b26c8dbe68..149449b117 100644 --- a/packages/react-devtools-shared/src/__tests__/profilingCache-test.js +++ b/packages/react-devtools-shared/src/__tests__/profilingCache-test.js @@ -72,7 +72,7 @@ describe('ProfilingCache', () => { utils.act(() => ReactDOM.render(, containerA)); utils.act(() => store.profilerStore.stopProfiling()); - let allProfilingDataForRoots = []; + const allProfilingDataForRoots = []; function Validator({previousProfilingDataForRoot, rootID}) { const profilingDataForRoot = store.profilerStore.getDataForRoot(rootID); diff --git a/packages/react-devtools-shared/src/__tests__/storeStressSync-test.js b/packages/react-devtools-shared/src/__tests__/storeStressSync-test.js index 899979932f..587bef95af 100644 --- a/packages/react-devtools-shared/src/__tests__/storeStressSync-test.js +++ b/packages/react-devtools-shared/src/__tests__/storeStressSync-test.js @@ -37,7 +37,7 @@ describe('StoreStress (Legacy Mode)', () => { // We'll be manually flipping this component back and forth in the test. // We only do this for a single node in order to verify that DevTools // can handle a subtree switching alternates while other subtrees are memoized. - let [showX, _setShowX] = React.useState(false); + const [showX, _setShowX] = React.useState(false); setShowX = _setShowX; return showX ? : 'c'; }; @@ -87,7 +87,7 @@ describe('StoreStress (Legacy Mode)', () => { // These cases are picked so that rendering them sequentially in the same // container results in a combination of mounts, updates, unmounts, and reorders. // prettier-ignore - let cases = [ + const cases = [ [a, b, c, d, e], [[a], b, c, d, e], [[a, b], c, d, e], @@ -183,7 +183,7 @@ describe('StoreStress (Legacy Mode)', () => { const e = ; // prettier-ignore - let steps = [ + const steps = [ a, b, c, @@ -207,7 +207,7 @@ describe('StoreStress (Legacy Mode)', () => { }; // 1. Capture the expected render result. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); for (let i = 0; i < steps.length; i++) { act(() => ReactDOM.render({steps[i]}, container)); @@ -308,7 +308,7 @@ describe('StoreStress (Legacy Mode)', () => { // 1. For each step, check Suspense can render them as initial primary content. // This is the only step where we use Jest snapshots. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); for (let i = 0; i < steps.length; i++) { act(() => @@ -719,7 +719,7 @@ describe('StoreStress (Legacy Mode)', () => { // 1. For each step, check Suspense can render them as initial primary content. // This is the only step where we use Jest snapshots. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); for (let i = 0; i < steps.length; i++) { act(() => @@ -744,7 +744,7 @@ describe('StoreStress (Legacy Mode)', () => { // 2. Verify check Suspense can render same steps as initial fallback content. // We don't actually assert here because the tree includes // which is different from the snapshots above. So we take more snapshots. - let fallbackSnapshots = []; + const fallbackSnapshots = []; for (let i = 0; i < steps.length; i++) { act(() => ReactDOM.render( diff --git a/packages/react-devtools-shared/src/__tests__/storeStressTestConcurrent-test.js b/packages/react-devtools-shared/src/__tests__/storeStressTestConcurrent-test.js index fc4fe8bc1e..b972cf3177 100644 --- a/packages/react-devtools-shared/src/__tests__/storeStressTestConcurrent-test.js +++ b/packages/react-devtools-shared/src/__tests__/storeStressTestConcurrent-test.js @@ -42,7 +42,7 @@ describe('StoreStressConcurrent', () => { // We'll be manually flipping this component back and forth in the test. // We only do this for a single node in order to verify that DevTools // can handle a subtree switching alternates while other subtrees are memoized. - let [showX, _setShowX] = React.useState(false); + const [showX, _setShowX] = React.useState(false); setShowX = _setShowX; return showX ? : 'c'; }; @@ -115,7 +115,7 @@ describe('StoreStressConcurrent', () => { // These cases are picked so that rendering them sequentially in the same // container results in a combination of mounts, updates, unmounts, and reorders. // prettier-ignore - let cases = [ + const cases = [ [a, b, c, d, e], [[a], b, c, d, e], [[a, b], c, d, e], @@ -215,7 +215,7 @@ describe('StoreStressConcurrent', () => { const e = ; // prettier-ignore - let steps = [ + const steps = [ a, b, c, @@ -239,7 +239,7 @@ describe('StoreStressConcurrent', () => { }; // 1. Capture the expected render result. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); // $FlowFixMe let root = ReactDOM.createRoot(container); @@ -401,7 +401,7 @@ describe('StoreStressConcurrent', () => { // 1. For each step, check Suspense can render them as initial primary content. // This is the only step where we use Jest snapshots. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); // $FlowFixMe let root = ReactDOM.createRoot(container); @@ -890,7 +890,7 @@ describe('StoreStressConcurrent', () => { // 1. For each step, check Suspense can render them as initial primary content. // This is the only step where we use Jest snapshots. - let snapshots = []; + const snapshots = []; let container = document.createElement('div'); // $FlowFixMe let root = ReactDOM.createRoot(container); @@ -915,7 +915,7 @@ describe('StoreStressConcurrent', () => { // 2. Verify check Suspense can render same steps as initial fallback content. // We don't actually assert here because the tree includes // which is different from the snapshots above. So we take more snapshots. - let fallbackSnapshots = []; + const fallbackSnapshots = []; for (let i = 0; i < steps.length; i++) { act(() => root.render( diff --git a/packages/react-devtools-shared/src/__tests__/treeContext-test.js b/packages/react-devtools-shared/src/__tests__/treeContext-test.js index 67e7ddf01a..b42fb0a9b6 100644 --- a/packages/react-devtools-shared/src/__tests__/treeContext-test.js +++ b/packages/react-devtools-shared/src/__tests__/treeContext-test.js @@ -482,7 +482,7 @@ describe('TreeListContext', () => { utils.act(() => (renderer = TestRenderer.create())); expect(state).toMatchSnapshot('1: initial state'); - let parentID = ((store.getElementIDAtIndex(1): any): number); + const parentID = ((store.getElementIDAtIndex(1): any): number); utils.act(() => dispatch({type: 'SELECT_OWNER', payload: parentID})); utils.act(() => renderer.update()); expect(state).toMatchSnapshot('2: parent owners tree'); @@ -507,7 +507,7 @@ describe('TreeListContext', () => { utils.act(() => (renderer = TestRenderer.create())); expect(state).toMatchSnapshot('1: initial state'); - let parentID = ((store.getElementIDAtIndex(1): any): number); + const parentID = ((store.getElementIDAtIndex(1): any): number); utils.act(() => dispatch({type: 'SELECT_OWNER', payload: parentID})); utils.act(() => renderer.update()); expect(state).toMatchSnapshot('2: parent owners tree'); @@ -545,7 +545,7 @@ describe('TreeListContext', () => { utils.act(() => (renderer = TestRenderer.create())); expect(state).toMatchSnapshot('1: initial state'); - let childID = ((store.getElementIDAtIndex(1): any): number); + const childID = ((store.getElementIDAtIndex(1): any): number); utils.act(() => dispatch({type: 'SELECT_OWNER', payload: childID})); utils.act(() => renderer.update()); expect(state).toMatchSnapshot('2: child owners tree'); @@ -553,7 +553,7 @@ describe('TreeListContext', () => { await utils.actAsync(() => ReactDOM.render(, container)); expect(state).toMatchSnapshot('3: remove child'); - let parentID = ((store.getElementIDAtIndex(0): any): number); + const parentID = ((store.getElementIDAtIndex(0): any): number); utils.act(() => dispatch({type: 'SELECT_OWNER', payload: parentID})); utils.act(() => renderer.update()); expect(state).toMatchSnapshot('4: parent owners tree'); diff --git a/packages/react-devtools-shared/src/backend/NativeStyleEditor/setupNativeStyleEditor.js b/packages/react-devtools-shared/src/backend/NativeStyleEditor/setupNativeStyleEditor.js index afa189f122..35b313e160 100644 --- a/packages/react-devtools-shared/src/backend/NativeStyleEditor/setupNativeStyleEditor.js +++ b/packages/react-devtools-shared/src/backend/NativeStyleEditor/setupNativeStyleEditor.js @@ -171,7 +171,7 @@ function measureStyle( function shallowClone(object: Object): Object { const cloned = {}; - for (let n in object) { + for (const n in object) { cloned[n] = object[n]; } return cloned; diff --git a/packages/react-devtools-shared/src/backend/agent.js b/packages/react-devtools-shared/src/backend/agent.js index f457f43199..030fe0b69d 100644 --- a/packages/react-devtools-shared/src/backend/agent.js +++ b/packages/react-devtools-shared/src/backend/agent.js @@ -211,7 +211,7 @@ export default class Agent extends EventEmitter<{| } getIDForNode(node: Object): number | null { - for (let rendererID in this._rendererInterfaces) { + for (const rendererID in this._rendererInterfaces) { const renderer = ((this._rendererInterfaces[ (rendererID: any) ]: any): RendererInterface); @@ -389,7 +389,7 @@ export default class Agent extends EventEmitter<{| setTraceUpdatesEnabled(traceUpdatesEnabled); - for (let rendererID in this._rendererInterfaces) { + for (const rendererID in this._rendererInterfaces) { const renderer = ((this._rendererInterfaces[ (rendererID: any) ]: any): RendererInterface); @@ -413,7 +413,7 @@ export default class Agent extends EventEmitter<{| startProfiling = (recordChangeDescriptions: boolean) => { this._recordChangeDescriptions = recordChangeDescriptions; this._isProfiling = true; - for (let rendererID in this._rendererInterfaces) { + for (const rendererID in this._rendererInterfaces) { const renderer = ((this._rendererInterfaces[ (rendererID: any) ]: any): RendererInterface); @@ -425,7 +425,7 @@ export default class Agent extends EventEmitter<{| stopProfiling = () => { this._isProfiling = false; this._recordChangeDescriptions = false; - for (let rendererID in this._rendererInterfaces) { + for (const rendererID in this._rendererInterfaces) { const renderer = ((this._rendererInterfaces[ (rendererID: any) ]: any): RendererInterface); @@ -456,7 +456,7 @@ export default class Agent extends EventEmitter<{| }; updateComponentFilters = (componentFilters: Array) => { - for (let rendererID in this._rendererInterfaces) { + for (const rendererID in this._rendererInterfaces) { const renderer = ((this._rendererInterfaces[ (rendererID: any) ]: any): RendererInterface); diff --git a/packages/react-devtools-shared/src/backend/console.js b/packages/react-devtools-shared/src/backend/console.js index 7bd7efbcd5..ab0f1349c6 100644 --- a/packages/react-devtools-shared/src/backend/console.js +++ b/packages/react-devtools-shared/src/backend/console.js @@ -27,7 +27,7 @@ const injectedRenderers: Map< let targetConsole: Object = console; let targetConsoleMethods = {}; -for (let method in console) { +for (const method in console) { targetConsoleMethods[method] = console[method]; } @@ -40,7 +40,7 @@ export function dangerous_setTargetConsoleForTesting( targetConsole = targetConsoleForTesting; targetConsoleMethods = {}; - for (let method in targetConsole) { + for (const method in targetConsole) { targetConsoleMethods[method] = console[method]; } } @@ -77,7 +77,7 @@ export function patch(): void { const originalConsoleMethods = {}; unpatchFn = () => { - for (let method in originalConsoleMethods) { + for (const method in originalConsoleMethods) { try { // $FlowFixMe property error|warn is not writable. targetConsole[method] = originalConsoleMethods[method]; @@ -101,7 +101,7 @@ export function patch(): void { // If there's a component stack for at least one of the injected renderers, append it. // We don't handle the edge case of stacks for more than one (e.g. interleaved renderers?) // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let { + for (const { getCurrentFiber, getDisplayNameForFiber, } of injectedRenderers.values()) { diff --git a/packages/react-devtools-shared/src/backend/describeComponentFrame.js b/packages/react-devtools-shared/src/backend/describeComponentFrame.js index b9830fdf71..1be9d86494 100644 --- a/packages/react-devtools-shared/src/backend/describeComponentFrame.js +++ b/packages/react-devtools-shared/src/backend/describeComponentFrame.js @@ -21,7 +21,7 @@ export default function describeComponentFrame( ) { let sourceInfo = ''; if (source) { - let path = source.fileName; + const path = source.fileName; let fileName = path.replace(BEFORE_SLASH_RE, ''); if (__DEV__) { // In DEV, include code for a common special case: diff --git a/packages/react-devtools-shared/src/backend/legacy/renderer.js b/packages/react-devtools-shared/src/backend/legacy/renderer.js index 6c78d481c7..093fa83122 100644 --- a/packages/react-devtools-shared/src/backend/legacy/renderer.js +++ b/packages/react-devtools-shared/src/backend/legacy/renderer.js @@ -87,7 +87,7 @@ function getElementType(internalInstance: InternalInstance): ElementType { } function getChildren(internalInstance: Object): Array { - let children = []; + const children = []; // If the parent is a native node without rendered children, but with // multiple string children, then the `element` that gets passed in here is @@ -106,7 +106,7 @@ function getChildren(internalInstance: Object): Array { } } else if (internalInstance._renderedChildren) { const renderedChildren = internalInstance._renderedChildren; - for (let name in renderedChildren) { + for (const name in renderedChildren) { const child = renderedChildren[name]; if (getElementType(child) !== ElementTypeOtherOrUnknown) { children.push(child); @@ -386,8 +386,8 @@ export function attach( ? getID(internalInstance._currentElement._owner) : 0; - let displayNameStringID = getStringID(displayName); - let keyStringID = getStringID(key); + const displayNameStringID = getStringID(displayName); + const keyStringID = getStringID(key); pushOperation(TREE_OPERATION_ADD); pushOperation(id); pushOperation(type); @@ -447,7 +447,7 @@ export function attach( renderer.Mount._instancesByReactRootID || renderer.Mount._instancesByContainerID; - for (let key in roots) { + for (const key in roots) { const internalInstance = roots[key]; const id = getID(internalInstance); crawlAndRecordInitialMounts(id, 0, id); @@ -455,8 +455,8 @@ export function attach( } } - let pendingOperations: Array = []; - let pendingStringTable: Map = new Map(); + const pendingOperations: Array = []; + const pendingStringTable: Map = new Map(); let pendingUnmountedIDs: Array = []; let pendingStringTableLength: number = 0; let pendingUnmountedRootID: number | null = null; diff --git a/packages/react-devtools-shared/src/backend/legacy/utils.js b/packages/react-devtools-shared/src/backend/legacy/utils.js index 2634ab1edf..dcf6b969be 100644 --- a/packages/react-devtools-shared/src/backend/legacy/utils.js +++ b/packages/react-devtools-shared/src/backend/legacy/utils.js @@ -29,7 +29,7 @@ export function decorateMany( } export function restoreMany(source: Object, olds: Object): void { - for (let name in olds) { + for (const name in olds) { source[name] = olds[name]; } } diff --git a/packages/react-devtools-shared/src/backend/renderer.js b/packages/react-devtools-shared/src/backend/renderer.js index d0012684af..17e5930f29 100644 --- a/packages/react-devtools-shared/src/backend/renderer.js +++ b/packages/react-devtools-shared/src/backend/renderer.js @@ -543,7 +543,7 @@ export function attach( // Highlight updates let traceUpdatesEnabled: boolean = false; - let traceUpdatesForNodes: Set = new Set(); + const traceUpdatesForNodes: Set = new Set(); function applyComponentFilters(componentFilters: Array) { hideElementsWithTypes.clear(); @@ -675,7 +675,7 @@ export function attach( const displayName = getDisplayNameForFiber(fiber); if (displayName != null) { // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let displayNameRegExp of hideElementsWithDisplayNames) { + for (const displayNameRegExp of hideElementsWithDisplayNames) { if (displayNameRegExp.test(displayName)) { return true; } @@ -686,7 +686,7 @@ export function attach( if (_debugSource != null && hideElementsWithPaths.size > 0) { const {fileName} = _debugSource; // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let pathRegExp of hideElementsWithPaths) { + for (const pathRegExp of hideElementsWithPaths) { if (pathRegExp.test(fileName)) { return true; } @@ -960,7 +960,7 @@ export function attach( const keys = new Set([...Object.keys(prev), ...Object.keys(next)]); const changedKeys = []; // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let key of keys) { + for (const key of keys) { if (prev[key] !== next[key]) { changedKeys.push(key); } @@ -994,11 +994,11 @@ export function attach( } } - let pendingOperations: Array = []; - let pendingRealUnmountedIDs: Array = []; - let pendingSimulatedUnmountedIDs: Array = []; + const pendingOperations: Array = []; + const pendingRealUnmountedIDs: Array = []; + const pendingSimulatedUnmountedIDs: Array = []; let pendingOperationsQueue: Array> | null = []; - let pendingStringTable: Map = new Map(); + const pendingStringTable: Map = new Map(); let pendingStringTableLength: number = 0; let pendingUnmountedRootID: number | null = null; @@ -1173,12 +1173,12 @@ export function attach( ? getFiberID(getPrimaryFiber(parentFiber)) : 0; - let displayNameStringID = getStringID(displayName); + const displayNameStringID = getStringID(displayName); // This check is a guard to handle a React element that has been modified // in such a way as to bypass the default stringification of the "key" property. - let keyString = key === null ? null : '' + key; - let keyStringID = getStringID(keyString); + const keyString = key === null ? null : '' + key; + const keyStringID = getStringID(keyString); pushOperation(TREE_OPERATION_ADD); pushOperation(id); @@ -1974,7 +1974,7 @@ export function attach( return null; } - let alternate = fiber.alternate; + const alternate = fiber.alternate; if (!alternate) { // If there is no alternate, then we only need to check if it is mounted. const state = isFiberMountedImpl(fiber); @@ -1992,12 +1992,12 @@ export function attach( let a: Fiber = fiber; let b: Fiber = alternate; while (true) { - let parentA = a.return; + const parentA = a.return; if (parentA === null) { // We're at the root. break; } - let parentB = parentA.alternate; + const parentB = parentA.alternate; if (parentB === null) { // There is no alternate. This is an unusual case. Currently, it only // happens when a Suspense component is hidden. An extra fragment fiber @@ -2131,7 +2131,7 @@ export function attach( } function prepareViewElementSource(id: number): void { - let fiber = idToFiberMap.get(id); + const fiber = idToFiberMap.get(id); if (fiber == null) { console.warn(`Could not find Fiber with id "${id}"`); return; @@ -2163,7 +2163,7 @@ export function attach( } function getOwnersList(id: number): Array | null { - let fiber = findCurrentFiberUsingSlowPathById(id); + const fiber = findCurrentFiberUsingSlowPathById(id); if (fiber == null) { return null; } @@ -2200,7 +2200,7 @@ export function attach( let instance = null; let style = null; - let fiber = findCurrentFiberUsingSlowPathById(id); + const fiber = findCurrentFiberUsingSlowPathById(id); if (fiber !== null) { instance = fiber.stateNode; @@ -2213,7 +2213,7 @@ export function attach( } function inspectElementRaw(id: number): InspectedElement | null { - let fiber = findCurrentFiberUsingSlowPathById(id); + const fiber = findCurrentFiberUsingSlowPathById(id); if (fiber == null) { return null; } @@ -2328,7 +2328,7 @@ export function attach( const originalConsoleMethods = {}; // Temporarily disable all console logging before re-running the hook. - for (let method in console) { + for (const method in console) { try { originalConsoleMethods[method] = console[method]; // $FlowFixMe property error|warn is not writable. @@ -2343,7 +2343,7 @@ export function attach( ); } finally { // Restore original console functionality. - for (let method in originalConsoleMethods) { + for (const method in originalConsoleMethods) { try { // $FlowFixMe property error|warn is not writable. console[method] = originalConsoleMethods[method]; @@ -2462,7 +2462,7 @@ export function attach( function updateSelectedElement(inspectedElement: InspectedElement): void { const {hooks, id, props} = inspectedElement; - let fiber = idToFiberMap.get(id); + const fiber = idToFiberMap.get(id); if (fiber == null) { console.warn(`Could not find Fiber with id "${id}"`); return; @@ -2912,7 +2912,7 @@ export function attach( return false; } - let forceFallbackForSuspenseIDs = new Set(); + const forceFallbackForSuspenseIDs = new Set(); function shouldSuspendFiberAccordingToSet(fiber) { const id = getFiberID(getPrimaryFiber(((fiber: any): Fiber))); return forceFallbackForSuspenseIDs.has(id); diff --git a/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js b/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js index 00c300e362..7e6cc59565 100644 --- a/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js +++ b/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js @@ -155,11 +155,11 @@ export default class Overlay { constructor() { // Find the root window, because overlays are positioned relative to it. - let currentWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; + const currentWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; this.window = currentWindow; // When opened in shells/dev, the tooltip should be bound by the app iframe, not by the topmost window. - let tipBoundsWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; + const tipBoundsWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; this.tipBoundsWindow = tipBoundsWindow; const doc = currentWindow.document; diff --git a/packages/react-devtools-shared/src/backend/views/TraceUpdates/index.js b/packages/react-devtools-shared/src/backend/views/TraceUpdates/index.js index 1861b7d155..e94d4fd5c1 100644 --- a/packages/react-devtools-shared/src/backend/views/TraceUpdates/index.js +++ b/packages/react-devtools-shared/src/backend/views/TraceUpdates/index.js @@ -135,7 +135,7 @@ function measureNode(node: Object): Rect | null { return null; } - let currentWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; + const currentWindow = window.__REACT_DEVTOOLS_TARGET_WINDOW__ || window; return getNestedBoundingClientRect(node, currentWindow); } diff --git a/packages/react-devtools-shared/src/devtools/ProfilerStore.js b/packages/react-devtools-shared/src/devtools/ProfilerStore.js index 12299a9219..b2e4ad051d 100644 --- a/packages/react-devtools-shared/src/devtools/ProfilerStore.js +++ b/packages/react-devtools-shared/src/devtools/ProfilerStore.js @@ -297,7 +297,7 @@ export default class ProfilerStore extends EventEmitter<{| // Record all renderer IDs initially too (in case of unmount) // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let rendererID of this._store.rootIDToRendererID.values()) { + for (const rendererID of this._store.rootIDToRendererID.values()) { if (!this._initialRendererIDs.has(rendererID)) { this._initialRendererIDs.add(rendererID); } diff --git a/packages/react-devtools-shared/src/devtools/store.js b/packages/react-devtools-shared/src/devtools/store.js index 1e246cab0b..3d98d0ff15 100644 --- a/packages/react-devtools-shared/src/devtools/store.js +++ b/packages/react-devtools-shared/src/devtools/store.js @@ -479,7 +479,7 @@ export default class Store extends EventEmitter<{| getOwnersListForElement(ownerID: number): Array { const list = []; - let element = this._idToElement.get(ownerID); + const element = this._idToElement.get(ownerID); if (element != null) { list.push({ ...element, diff --git a/packages/react-devtools-shared/src/devtools/utils.js b/packages/react-devtools-shared/src/devtools/utils.js index c5a07f3146..bd281d28e1 100644 --- a/packages/react-devtools-shared/src/devtools/utils.js +++ b/packages/react-devtools-shared/src/devtools/utils.js @@ -44,7 +44,8 @@ export function printElement(element: Element, includeWeight: boolean = false) { } } - let hocs = hocDisplayNames === null ? '' : ` [${hocDisplayNames.join('][')}]`; + const hocs = + hocDisplayNames === null ? '' : ` [${hocDisplayNames.join('][')}]`; let suffix = ''; if (includeWeight) { diff --git a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js index 454d574a79..9e62f9e262 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js @@ -76,7 +76,7 @@ const resource: Resource< InspectedElementFrontend, > = createResource( (element: Element) => { - let request = inProgressRequests.get(element); + const request = inProgressRequests.get(element); if (request != null) { return request.promise; } @@ -351,16 +351,19 @@ function hydrateHelper( path?: Array, ): Object | null { if (dehydratedData !== null) { - let {cleaned, data, unserializable} = dehydratedData; + const {cleaned, data, unserializable} = dehydratedData; if (path) { const {length} = path; if (length > 0) { // Hydration helper requires full paths, but inspection dehydrates with relative paths. // In that event it's important that we adjust the "cleaned" paths to match. - cleaned = cleaned.map(cleanedPath => cleanedPath.slice(length)); - unserializable = unserializable.map(unserializablePath => - unserializablePath.slice(length), + return hydrate( + data, + cleaned.map(cleanedPath => cleanedPath.slice(length)), + unserializable.map(unserializablePath => + unserializablePath.slice(length), + ), ); } } diff --git a/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js b/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js index 54726c7e04..3a102a8e34 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js @@ -217,7 +217,7 @@ export default function KeyValue({ const hasChildren = entries.length > 0; const displayName = getMetaValueLabel(value); - let areChildrenReadOnly = isReadOnly || !!value[meta.readonly]; + const areChildrenReadOnly = isReadOnly || !!value[meta.readonly]; children = entries.map>(([key, keyValue]) => ( = createResource( (element: Element) => { - let request = inProgressRequests.get(element); + const request = inProgressRequests.get(element); if (request != null) { return request.promise; } @@ -108,7 +108,7 @@ function NativeStyleContextController({children}: Props) { // This effect handler invalidates the suspense cache and schedules rendering updates with React. useEffect(() => { const onStyleAndLayout = ({id, layout, style}: StyleAndLayoutBackend) => { - let element = store.getElementByID(id); + const element = store.getElementByID(id); if (element !== null) { const styleAndLayout: StyleAndLayoutFrontend = { layout, diff --git a/packages/react-devtools-shared/src/devtools/views/Components/OwnersListContext.js b/packages/react-devtools-shared/src/devtools/views/Components/OwnersListContext.js index 493ee8d966..a979d0fa3d 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/OwnersListContext.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/OwnersListContext.js @@ -35,7 +35,7 @@ type InProgressRequest = {| const inProgressRequests: WeakMap = new WeakMap(); const resource: Resource> = createResource( (element: Element) => { - let request = inProgressRequests.get(element); + const request = inProgressRequests.get(element); if (request != null) { return request.promise; } diff --git a/packages/react-devtools-shared/src/devtools/views/Components/Tree.js b/packages/react-devtools-shared/src/devtools/views/Components/Tree.js index 07c779d758..43114cd4d9 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/Tree.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/Tree.js @@ -409,7 +409,7 @@ function updateIndentationSizeVar( let maxIndentationSize: number = indentationSizeRef.current; // eslint-disable-next-line no-for-of-loops/no-for-of-loops - for (let child of innerDiv.children) { + for (const child of innerDiv.children) { const depth = parseInt(child.getAttribute('data-depth'), 10) || 0; let childWidth: number = 0; diff --git a/packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js b/packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js index 8d23660dbc..61de6eaa97 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js @@ -157,7 +157,8 @@ type State = {| |}; function reduceTreeState(store: Store, state: State, action: Action): State { - let {numElements, ownerID, selectedElementIndex, selectedElementID} = state; + let {numElements, selectedElementIndex, selectedElementID} = state; + const ownerID = state.ownerID; let lookupIDForIndex = true; @@ -277,13 +278,13 @@ function reduceTreeState(store: Store, state: State, action: Action): State { function reduceSearchState(store: Store, state: State, action: Action): State { let { - ownerID, searchIndex, searchResults, searchText, selectedElementID, selectedElementIndex, } = state; + const ownerID = state.ownerID; const prevSearchIndex = searchIndex; const prevSearchText = searchText; @@ -452,10 +453,8 @@ function reduceOwnersState(store: Store, state: State, action: Action): State { selectedElementIndex, ownerID, ownerFlatTree, - searchIndex, - searchResults, - searchText, } = state; + const {searchIndex, searchResults, searchText} = state; let prevSelectedElementIndex = selectedElementIndex; @@ -734,7 +733,7 @@ function TreeContextController({ prevSelectedElementID.current = state.selectedElementID; if (state.selectedElementID !== null) { - let element = store.getElementByID(state.selectedElementID); + const element = store.getElementByID(state.selectedElementID); if (element !== null && element.parentID > 0) { store.toggleIsCollapsed(element.parentID, false); } diff --git a/packages/react-devtools-shared/src/devtools/views/DevTools.js b/packages/react-devtools-shared/src/devtools/views/DevTools.js index 28714cb927..56f11a1c3f 100644 --- a/packages/react-devtools-shared/src/devtools/views/DevTools.js +++ b/packages/react-devtools-shared/src/devtools/views/DevTools.js @@ -107,11 +107,13 @@ export default function DevTools({ viewAttributeSourceFunction, viewElementSourceFunction, }: Props) { - let [tab, setTab] = useLocalStorage( + const [currentTab, setTab] = useLocalStorage( 'React::DevTools::defaultTab', defaultTab, ); + let tab = currentTab; + if (overrideTab != null) { tab = overrideTab; } diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js index c998998cb4..5b94c94e2d 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js @@ -64,7 +64,7 @@ function CommitFlamegraphListItem({data, index, style}: Props) { const row = rows[index]; - let selectedNodeOffset = scaleX( + const selectedNodeOffset = scaleX( selectedChartNode !== null ? selectedChartNode.offset : 0, width, ); diff --git a/packages/react-devtools-shared/src/events.js b/packages/react-devtools-shared/src/events.js index aacffb3845..c1b82e025a 100644 --- a/packages/react-devtools-shared/src/events.js +++ b/packages/react-devtools-shared/src/events.js @@ -14,7 +14,7 @@ export default class EventEmitter { event: Event, listener: (...$ElementType) => any, ): void { - let listeners = this.listenersMap.get(event); + const listeners = this.listenersMap.get(event); if (listeners === undefined) { this.listenersMap.set(event, [listener]); } else { diff --git a/packages/react-devtools-shared/src/hydration.js b/packages/react-devtools-shared/src/hydration.js index e7d7630cde..c134f7797d 100644 --- a/packages/react-devtools-shared/src/hydration.js +++ b/packages/react-devtools-shared/src/hydration.js @@ -287,7 +287,7 @@ export function dehydrate( return createDehydrated(type, true, data, cleaned, path); } else { const object = {}; - for (let name in data) { + for (const name in data) { object[name] = dehydrate( data[name], cleaned, diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 19b6ece3a7..f4982e814b 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -49,7 +49,7 @@ const cachedDisplayNames: WeakMap = new WeakMap(); // On large trees, encoding takes significant time. // Try to reuse the already encoded strings. -let encodedStringCache = new LRU({max: 1000}); +const encodedStringCache = new LRU({max: 1000}); export function alphaSortKeys(a: string, b: string): number { if (a > b) { @@ -96,7 +96,7 @@ export function utfDecodeString(array: Array): string { } export function utfEncodeString(string: string): Array { - let cached = encodedStringCache.get(string); + const cached = encodedStringCache.get(string); if (cached !== undefined) { return cached; } @@ -281,12 +281,12 @@ export function separateDisplayNameAndHOCs( // Pulled from react-compat // https://github.com/developit/preact-compat/blob/7c5de00e7c85e2ffd011bf3af02899b63f699d3a/src/index.js#L349 export function shallowDiffers(prev: Object, next: Object): boolean { - for (let attribute in prev) { + for (const attribute in prev) { if (!(attribute in next)) { return true; } } - for (let attribute in next) { + for (const attribute in next) { if (prev[attribute] !== next[attribute]) { return true; } diff --git a/packages/react-devtools-shell/src/app/SuspenseTree/index.js b/packages/react-devtools-shell/src/app/SuspenseTree/index.js index 0044485b8b..4e910e1698 100644 --- a/packages/react-devtools-shell/src/app/SuspenseTree/index.js +++ b/packages/react-devtools-shell/src/app/SuspenseTree/index.js @@ -47,13 +47,13 @@ function PrimaryFallbackTest({initialSuspend}) { } function useTestSequence(label, T1, T2) { - let [step, setStep] = useState(0); - let next = ( + const [step, setStep] = useState(0); + const next = ( ); - let allSteps = [ + const allSteps = [ {next}, {next} mount diff --git a/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js b/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js index 5708d67edb..f4327898ba 100644 --- a/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js +++ b/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js @@ -143,7 +143,7 @@ describe('ReactCompositeComponent-state', () => { ReactDOM.unmountComponentAtNode(container); - let expected = [ + const expected = [ // there is no state when getInitialState() is called ['getInitialState', null], ['componentWillMount-start', 'red'], @@ -283,8 +283,6 @@ describe('ReactCompositeComponent-state', () => { }); it('should batch unmounts', () => { - let outer; - class Inner extends React.Component { render() { return
; @@ -306,7 +304,7 @@ describe('ReactCompositeComponent-state', () => { } const container = document.createElement('div'); - outer = ReactDOM.render(, container); + const outer = ReactDOM.render(, container); expect(() => { ReactDOM.unmountComponentAtNode(container); }).not.toThrow(); @@ -380,7 +378,7 @@ describe('ReactCompositeComponent-state', () => { }); it('should treat assigning to this.state inside cWRP as a replaceState, with a warning', () => { - let ops = []; + const ops = []; class Test extends React.Component { state = {step: 1, extra: true}; UNSAFE_componentWillReceiveProps() { @@ -423,7 +421,7 @@ describe('ReactCompositeComponent-state', () => { }); it('should treat assigning to this.state inside cWM as a replaceState, with a warning', () => { - let ops = []; + const ops = []; class Test extends React.Component { state = {step: 1, extra: true}; UNSAFE_componentWillMount() { diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js index 1ad7752a86..49dc7a3b3c 100644 --- a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js @@ -564,8 +564,8 @@ describe('ReactDOMComponent', () => { {'>
': 'selected'}, null, ); - let result1 = ReactDOMServer.renderToString(element1); - let result2 = ReactDOMServer.renderToString(element2); + const result1 = ReactDOMServer.renderToString(element1); + const result2 = ReactDOMServer.renderToString(element2); expect(result1.toLowerCase()).not.toContain('onclick'); expect(result2.toLowerCase()).not.toContain('script'); } @@ -588,8 +588,8 @@ describe('ReactDOMComponent', () => { {'>': 'selected'}, null, ); - let result1 = ReactDOMServer.renderToString(element1); - let result2 = ReactDOMServer.renderToString(element2); + const result1 = ReactDOMServer.renderToString(element1); + const result2 = ReactDOMServer.renderToString(element2); expect(result1.toLowerCase()).not.toContain('onclick'); expect(result2.toLowerCase()).not.toContain('script'); } @@ -1166,7 +1166,7 @@ describe('ReactDOMComponent', () => { let realToString; try { realToString = Object.prototype.toString; - let wrappedToString = function() { + const wrappedToString = function() { // Emulate browser behavior which is missing in jsdom if (this instanceof window.HTMLUnknownElement) { return '[object HTMLUnknownElement]'; @@ -2553,10 +2553,10 @@ describe('ReactDOMComponent', () => { }); it('receives events in specific order', () => { - let eventOrder = []; - let track = tag => () => eventOrder.push(tag); - let outerRef = React.createRef(); - let innerRef = React.createRef(); + const eventOrder = []; + const track = tag => () => eventOrder.push(tag); + const outerRef = React.createRef(); + const innerRef = React.createRef(); function OuterReactApp() { return ( diff --git a/packages/react-dom/src/__tests__/ReactDOMEventListener-test.js b/packages/react-dom/src/__tests__/ReactDOMEventListener-test.js index 729044b6b4..0333fd7561 100644 --- a/packages/react-dom/src/__tests__/ReactDOMEventListener-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMEventListener-test.js @@ -12,7 +12,7 @@ describe('ReactDOMEventListener', () => { let React; let ReactDOM; - let ReactFeatureFlags = require('shared/ReactFeatureFlags'); + const ReactFeatureFlags = require('shared/ReactFeatureFlags'); beforeEach(() => { jest.resetModules(); diff --git a/packages/react-dom/src/__tests__/ReactDOMFiber-test.js b/packages/react-dom/src/__tests__/ReactDOMFiber-test.js index ef872dfeb4..51c66e773f 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFiber-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFiber-test.js @@ -211,7 +211,7 @@ describe('ReactDOMFiber', () => { }; const assertNamespacesMatch = function(tree) { - let testContainer = document.createElement('div'); + const testContainer = document.createElement('div'); svgEls = []; htmlEls = []; mathEls = []; @@ -1224,7 +1224,7 @@ describe('ReactDOMFiber', () => { // Regression test for https://github.com/facebook/react/issues/12643#issuecomment-413727104 it('should not diff memoized host components', () => { - let inputRef = React.createRef(); + const inputRef = React.createRef(); let didCallOnChange = false; class Child extends React.Component { diff --git a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js index ed995df527..e88bfc7b46 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js @@ -49,7 +49,7 @@ describe('ReactDOMFiberAsync', () => { }); it('flushSync batches sync updates and flushes them at the end of the batch', () => { - let ops = []; + const ops = []; let instance; class Component extends React.Component { @@ -87,7 +87,7 @@ describe('ReactDOMFiberAsync', () => { }); it('flushSync flushes updates even if nested inside another flushSync', () => { - let ops = []; + const ops = []; let instance; class Component extends React.Component { @@ -156,9 +156,9 @@ describe('ReactDOMFiberAsync', () => { }); it.experimental('does not perform deferred updates synchronously', () => { - let inputRef = React.createRef(); - let asyncValueRef = React.createRef(); - let syncValueRef = React.createRef(); + const inputRef = React.createRef(); + const asyncValueRef = React.createRef(); + const syncValueRef = React.createRef(); class Counter extends React.Component { state = {asyncValue: '', syncValue: ''}; @@ -246,7 +246,7 @@ describe('ReactDOMFiberAsync', () => { }); it.experimental('flushSync flushes updates before end of the tick', () => { - let ops = []; + const ops = []; let instance; class Component extends React.Component { @@ -317,7 +317,7 @@ describe('ReactDOMFiberAsync', () => { Scheduler.unstable_flushAll(); expect(container.textContent).toEqual('1'); - let ops = []; + const ops = []; ReactDOM.unstable_flushControlled(() => { inst.increment(); ReactDOM.unstable_flushControlled(() => { @@ -350,7 +350,7 @@ describe('ReactDOMFiberAsync', () => { } ReactDOM.render(, container); - let ops = []; + const ops = []; ReactDOM.unstable_batchedUpdates(() => { inst.increment(); ReactDOM.unstable_flushControlled(() => { @@ -428,22 +428,22 @@ describe('ReactDOMFiberAsync', () => { // Flush Scheduler.unstable_flushAll(); - let disableButton = disableButtonRef.current; + const disableButton = disableButtonRef.current; expect(disableButton.tagName).toBe('BUTTON'); // Dispatch a click event on the Disable-button. - let firstEvent = document.createEvent('Event'); + const firstEvent = document.createEvent('Event'); firstEvent.initEvent('click', true, true); disableButton.dispatchEvent(firstEvent); // There should now be a pending update to disable the form. // This should not have flushed yet since it's in concurrent mode. - let submitButton = submitButtonRef.current; + const submitButton = submitButtonRef.current; expect(submitButton.tagName).toBe('BUTTON'); // In the meantime, we can dispatch a new client event on the submit button. - let secondEvent = document.createEvent('Event'); + const secondEvent = document.createEvent('Event'); secondEvent.initEvent('click', true, true); // This should force the pending update to flush which disables the submit button before the event is invoked. submitButton.dispatchEvent(secondEvent); @@ -499,22 +499,22 @@ describe('ReactDOMFiberAsync', () => { // Flush Scheduler.unstable_flushAll(); - let disableButton = disableButtonRef.current; + const disableButton = disableButtonRef.current; expect(disableButton.tagName).toBe('BUTTON'); // Dispatch a click event on the Disable-button. - let firstEvent = document.createEvent('Event'); + const firstEvent = document.createEvent('Event'); firstEvent.initEvent('click', true, true); disableButton.dispatchEvent(firstEvent); // There should now be a pending update to disable the form. // This should not have flushed yet since it's in concurrent mode. - let submitButton = submitButtonRef.current; + const submitButton = submitButtonRef.current; expect(submitButton.tagName).toBe('BUTTON'); // In the meantime, we can dispatch a new client event on the submit button. - let secondEvent = document.createEvent('Event'); + const secondEvent = document.createEvent('Event'); secondEvent.initEvent('click', true, true); // This should force the pending update to flush which disables the submit button before the event is invoked. submitButton.dispatchEvent(secondEvent); @@ -562,22 +562,22 @@ describe('ReactDOMFiberAsync', () => { // Flush Scheduler.unstable_flushAll(); - let enableButton = enableButtonRef.current; + const enableButton = enableButtonRef.current; expect(enableButton.tagName).toBe('BUTTON'); // Dispatch a click event on the Enable-button. - let firstEvent = document.createEvent('Event'); + const firstEvent = document.createEvent('Event'); firstEvent.initEvent('click', true, true); enableButton.dispatchEvent(firstEvent); // There should now be a pending update to enable the form. // This should not have flushed yet since it's in concurrent mode. - let submitButton = submitButtonRef.current; + const submitButton = submitButtonRef.current; expect(submitButton.tagName).toBe('BUTTON'); // In the meantime, we can dispatch a new client event on the submit button. - let secondEvent = document.createEvent('Event'); + const secondEvent = document.createEvent('Event'); secondEvent.initEvent('click', true, true); // This should force the pending update to flush which enables the submit button before the event is invoked. submitButton.dispatchEvent(secondEvent); diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js index 3d34b66110..040f723192 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js @@ -24,10 +24,10 @@ describe('ReactDOMFizzServer', () => { }); async function readResult(stream) { - let reader = stream.getReader(); + const reader = stream.getReader(); let result = ''; while (true) { - let {done, value} = await reader.read(); + const {done, value} = await reader.read(); if (done) { return result; } @@ -36,10 +36,10 @@ describe('ReactDOMFizzServer', () => { } it('should call renderToReadableStream', async () => { - let stream = ReactDOMFizzServer.renderToReadableStream( + const stream = ReactDOMFizzServer.renderToReadableStream(
hello world
, ); - let result = await readResult(stream); + const result = await readResult(stream); expect(result).toBe('
hello world
'); }); }); diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js index 79fa80b322..41bbded094 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js @@ -23,7 +23,7 @@ describe('ReactDOMFizzServer', () => { }); function getTestWritable() { - let writable = new Stream.PassThrough(); + const writable = new Stream.PassThrough(); writable.setEncoding('utf8'); writable.result = ''; writable.on('data', chunk => (writable.result += chunk)); @@ -31,7 +31,7 @@ describe('ReactDOMFizzServer', () => { } it('should call pipeToNodeWritable', () => { - let writable = getTestWritable(); + const writable = getTestWritable(); ReactDOMFizzServer.pipeToNodeWritable(
hello world
, writable); jest.runAllTimers(); expect(writable.result).toBe('
hello world
'); diff --git a/packages/react-dom/src/__tests__/ReactDOMHooks-test.js b/packages/react-dom/src/__tests__/ReactDOMHooks-test.js index 5e7e003ebe..dcee716e31 100644 --- a/packages/react-dom/src/__tests__/ReactDOMHooks-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMHooks-test.js @@ -32,8 +32,8 @@ describe('ReactDOMHooks', () => { }); it('can ReactDOM.render() from useEffect', () => { - let container2 = document.createElement('div'); - let container3 = document.createElement('div'); + const container2 = document.createElement('div'); + const container3 = document.createElement('div'); function Example1({n}) { React.useEffect(() => { diff --git a/packages/react-dom/src/__tests__/ReactDOMInput-test.js b/packages/react-dom/src/__tests__/ReactDOMInput-test.js index 391e14fe01..6459b2f10e 100644 --- a/packages/react-dom/src/__tests__/ReactDOMInput-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMInput-test.js @@ -383,7 +383,7 @@ describe('ReactDOMInput', () => { }); it('should display `defaultValue` of number 0', () => { - let stub = ; + const stub = ; const node = ReactDOM.render(stub, container); expect(node.getAttribute('value')).toBe('0'); @@ -415,14 +415,14 @@ describe('ReactDOMInput', () => { }); it('should display "true" for `defaultValue` of `true`', () => { - let stub = ; + const stub = ; const node = ReactDOM.render(stub, container); expect(node.value).toBe('true'); }); it('should display "false" for `defaultValue` of `false`', () => { - let stub = ; + const stub = ; const node = ReactDOM.render(stub, container); expect(node.value).toBe('false'); @@ -887,7 +887,7 @@ describe('ReactDOMInput', () => { }); it('should set a value on a submit input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; @@ -895,7 +895,7 @@ describe('ReactDOMInput', () => { }); it('should not set an undefined value on a submit input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; @@ -908,7 +908,7 @@ describe('ReactDOMInput', () => { }); it('should not set an undefined value on a reset input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; @@ -921,7 +921,7 @@ describe('ReactDOMInput', () => { }); it('should not set a null value on a submit input', () => { - let stub = ; + const stub = ; expect(() => { ReactDOM.render(stub, container); }).toErrorDev('`value` prop on `input` should not be null'); @@ -936,7 +936,7 @@ describe('ReactDOMInput', () => { }); it('should not set a null value on a reset input', () => { - let stub = ; + const stub = ; expect(() => { ReactDOM.render(stub, container); }).toErrorDev('`value` prop on `input` should not be null'); @@ -951,7 +951,7 @@ describe('ReactDOMInput', () => { }); it('should set a value on a reset input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; @@ -959,7 +959,7 @@ describe('ReactDOMInput', () => { }); it('should set an empty string value on a submit input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; @@ -967,7 +967,7 @@ describe('ReactDOMInput', () => { }); it('should set an empty string value on a reset input', () => { - let stub = ; + const stub = ; ReactDOM.render(stub, container); const node = container.firstChild; diff --git a/packages/react-dom/src/__tests__/ReactDOMOption-test.js b/packages/react-dom/src/__tests__/ReactDOMOption-test.js index 6d66655bf6..a81dd32f1f 100644 --- a/packages/react-dom/src/__tests__/ReactDOMOption-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMOption-test.js @@ -22,7 +22,7 @@ describe('ReactDOMOption', () => { }); it('should flatten children to a string', () => { - let stub = ( + const stub = ( @@ -50,7 +50,7 @@ describe('ReactDOMOption', () => { }); it('should ignore null/undefined/false children without warning', () => { - let stub = ( + const stub = (