Skip to content

Commit f1db9c3

Browse files
author
Juan
authored
[DevTools] Support object destructuring pattern without runtime errors (#22128)
## Summary Before this commit, if a hook returned an object and we declared a variable using object destructuring on the returned value, we would produce a runtime 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).
1 parent 7ed0706 commit f1db9c3

26 files changed

+195
-38
lines changed

packages/react-devtools-extensions/src/SourceMapMetadataConsumer.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -89,9 +89,9 @@ export class SourceMapMetadataConsumer {
8989
return getHookNameForLocation({line, column}, hookMap);
9090
}
9191

92-
hasHookMap(source: ?string) {
92+
hasHookMap(source: ?string): boolean {
9393
if (source == null) {
94-
return null;
94+
return false;
9595
}
9696
return this._getHookMapForSource(source) != null;
9797
}

packages/react-devtools-extensions/src/__tests__/__source__/ComponentWithCustomHook.js

+8-1
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,12 @@
77
* @flow
88
*/
99

10-
import React, {useEffect, useState} from 'react';
10+
import React, {useDebugValue, useEffect, useState} from 'react';
1111

1212
export function Component() {
1313
const [count, setCount] = useState(0);
1414
const isDarkMode = useIsDarkMode();
15+
const {foo} = useFoo();
1516

1617
useEffect(() => {
1718
// ...
@@ -23,6 +24,7 @@ export function Component() {
2324
<>
2425
<div>Dark mode? {isDarkMode}</div>
2526
<div>Count: {count}</div>
27+
<div>Foo: {foo}</div>
2628
<button onClick={handleClick}>Update count</button>
2729
</>
2830
);
@@ -37,3 +39,8 @@ function useIsDarkMode() {
3739

3840
return isDarkMode;
3941
}
42+
43+
function useFoo() {
44+
useDebugValue('foo');
45+
return {foo: true};
46+
}

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/bundle/index.js

+11-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/bundle/index.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithCustomHook.js

+11-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithCustomHook.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js

+11-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithCustomHook.js

+11-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithCustomHook.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithCustomHook.js

+11-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)