[DevTools] Using array destructuring without assigning first variable does not error (#22129)
## Summary Before this commit, if a hook returned an array the was destructured, but without assigning a variable to the first element in the array, this would produce an error. This was detected via internal testing. This commit fixes that and adds regression tests. ## Test Plan - yarn flow - yarn test - yarn test-build-devtools - added new regression tests - named hooks still work on manual test of browser extension on a few different apps (code sandbox, create-react-app, internally).
Juan committed
Aug 18, 2021 at 18:26 UTC
42ef45b1294ec4f0ee0f5318dc24721ba226852e
3 files changed
+4
-3
packages/react-devtools-extensions/src/__tests__/__source__/__untransformed__/ComponentWithUseState.js
+2
-1
@@ -14,7 +14,8 @@ function Component(props) {
14
const [foo] = useState(true);
15
const bar = useState(true);
16
const [baz] = React.useState(true);
17
+ const [, forceUpdate] = useState();
18
return `${foo}-${bar}-${baz}`;
19
}
20
20
-module.exports = {Component};
\ No newline at end of file
21
+module.exports = {Component};
packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js
+1
-1
@@ -95,7 +95,7 @@ describe('parseHookNames', () => {
95
const Component = require('./__source__/__untransformed__/ComponentWithUseState')
96
.Component;
97
const hookNames = await getHookNamesForComponent(Component);
98
- expectHookNamesToEqual(hookNames, ['foo', 'bar', 'baz']);
98
+ expectHookNamesToEqual(hookNames, ['foo', 'bar', 'baz', null]);
99
});
100
101
it('should parse names for useReducer()', async () => {
packages/react-devtools-extensions/src/astUtils.js
+1
-1
@@ -271,7 +271,7 @@ function getHookVariableName(
271
const nodeType = hook.node.id.type;
272
switch (nodeType) {
273
case AST_NODE_TYPES.ARRAY_PATTERN:
274
- return !isCustomHook ? hook.node.id.elements[0].name : null;
274
+ return !isCustomHook ? hook.node.id.elements[0]?.name ?? null : null;
275
276
case AST_NODE_TYPES.IDENTIFIER:
277
return hook.node.id.name;