From 04ba0986d6252699c9a1af6ab47f2e4a200ee739 Mon Sep 17 00:00:00 2001 From: Juan Date: Wed, 11 Aug 2021 10:46:19 -0400 Subject: [PATCH] [DevTools] Support extended source maps with named hooks information (#22010) ## Summary Adds support for statically extracting names for hook calls from source code, and extending source maps with that information so that DevTools does not have to directly parse source code at runtime, which will speed up the Named Hooks feature and allow it to be enabled by default. Specifically, this PR includes the following parts: - [x] Adding logic to statically extract relevant hook names from the parsed source code (i.e. the babel ast). Note that this logic differs slightly from the existing logic in that the existing logic also uses runtime information from DevTools (such as whether given hooks are a custom hook) to extract names for hooks, whereas this code is meant to run entirely at build time, so it does not rely on that information. - [x] Generating an encoded "hook map", which encodes the information about a hooks *original* source location, and it's corresponding name. This "hook map" will be used to generate extended source maps, included tentatively under an extra `x_react_hook_map` field. The map itself is formatted and encoded in a very similar way as how the `names` and `mappings` fields of a standard source map are encoded ( = Base64 VLQ delta coding representing offsets into a string array), and how the "function map" in Metro is encoded, as suggested in #21782. Note that this initial version uses a very basic format, and we are not implementing our own custom encoding, but reusing the `encode` function from `sourcemap-codec`. - [x] Updating the logic in `parseHookNames` to check if the source maps have been extended with the hook map information, and if so use that information to extract the hook names without loading the original source code. In this PR we are manually generating extended source maps in our tests in order to test that this functionality works as expected, even though we are not actually generating the extended source maps in production. The second stage of this work, which will likely need to occur outside this repo, is to update bundlers such as Metro to use these new primitives to actually generate source maps that DevTools can use. ### Follow-ups - Enable named hooks by default when extended source maps are present - Support looking up hook names when column numbers are not present in source map. - Measure performance improvement of using extended source maps (manual testing suggests ~4 to 5x faster) - Update relevant bundlers to generate extended source maps. ## Test Plan - yarn flow - Tests still pass - yarn test - yarn test-build-devtools - Named hooks still work on manual test of browser extension on a few different apps (code sandbox, create-react-app, facebook). - For new functionality: - New tests for statically extracting hook names. - New tests for using extended source maps to look up hook names at runtime. --- .../react-devtools-extensions/package.json | 4 +- .../ComponentUsingHooksIndirectly.js | 45 +++ .../ComponentUsingHooksIndirectly.js.map | 1 + .../ComponentWithCustomHook.js | 41 +++ .../ComponentWithCustomHook.js.map | 1 + .../ComponentWithExternalCustomHooks.js | 26 ++ .../ComponentWithExternalCustomHooks.js.map | 1 + .../ComponentWithMultipleHooksPerLine.js | 30 ++ .../ComponentWithMultipleHooksPerLine.js.map | 1 + .../ComponentWithNestedHooks.js | 28 ++ .../ComponentWithNestedHooks.js.map | 1 + .../ContainingStringSourceMappingURL.js | 29 ++ .../ContainingStringSourceMappingURL.js.map | 1 + .../external/fb-sources-extended/Example.js | 28 ++ .../fb-sources-extended/Example.js.map | 1 + .../fb-sources-extended/InlineRequire.js | 21 ++ .../fb-sources-extended/InlineRequire.js.map | 1 + .../external/fb-sources-extended/ToDoList.js | 106 +++++++ .../fb-sources-extended/ToDoList.js.map | 1 + .../external/fb-sources-extended/index.js | 89 ++++++ .../external/fb-sources-extended/index.js.map | 1 + .../external/fb-sources-extended/useTheme.js | 27 ++ .../fb-sources-extended/useTheme.js.map | 1 + .../ComponentUsingHooksIndirectly.js | 45 +++ .../ComponentUsingHooksIndirectly.js.map | 1 + .../ComponentWithCustomHook.js | 41 +++ .../ComponentWithCustomHook.js.map | 1 + .../ComponentWithExternalCustomHooks.js | 26 ++ .../ComponentWithExternalCustomHooks.js.map | 1 + .../ComponentWithMultipleHooksPerLine.js | 30 ++ .../ComponentWithMultipleHooksPerLine.js.map | 1 + .../ComponentWithNestedHooks.js | 28 ++ .../ComponentWithNestedHooks.js.map | 1 + .../ContainingStringSourceMappingURL.js | 29 ++ .../ContainingStringSourceMappingURL.js.map | 1 + .../react-sources-extended/Example.js | 28 ++ .../react-sources-extended/Example.js.map | 1 + .../react-sources-extended/InlineRequire.js | 21 ++ .../InlineRequire.js.map | 1 + .../react-sources-extended/ToDoList.js | 106 +++++++ .../react-sources-extended/ToDoList.js.map | 1 + .../external/react-sources-extended/index.js | 89 ++++++ .../react-sources-extended/index.js.map | 1 + .../react-sources-extended/useTheme.js | 27 ++ .../react-sources-extended/useTheme.js.map | 1 + .../ComponentUsingHooksIndirectly.js | 45 +++ .../ComponentWithCustomHook.js | 41 +++ .../ComponentWithExternalCustomHooks.js | 26 ++ .../ComponentWithMultipleHooksPerLine.js | 30 ++ .../ComponentWithNestedHooks.js | 28 ++ .../ContainingStringSourceMappingURL.js | 29 ++ .../inline/fb-sources-extended/Example.js | 28 ++ .../fb-sources-extended/InlineRequire.js | 21 ++ .../inline/fb-sources-extended/ToDoList.js | 106 +++++++ .../inline/fb-sources-extended/index.js | 89 ++++++ .../inline/fb-sources-extended/useTheme.js | 27 ++ .../ComponentUsingHooksIndirectly.js | 45 +++ .../ComponentWithCustomHook.js | 41 +++ .../ComponentWithExternalCustomHooks.js | 26 ++ .../ComponentWithMultipleHooksPerLine.js | 30 ++ .../ComponentWithNestedHooks.js | 28 ++ .../ContainingStringSourceMappingURL.js | 29 ++ .../inline/react-sources-extended/Example.js | 28 ++ .../react-sources-extended/InlineRequire.js | 21 ++ .../inline/react-sources-extended/ToDoList.js | 106 +++++++ .../inline/react-sources-extended/index.js | 89 ++++++ .../inline/react-sources-extended/useTheme.js | 27 ++ .../src/__tests__/generateHookMap-test.js | 212 +++++++++++++ .../__tests__/getHookNameForLocation-test.js | 264 ++++++++++++++++ .../src/__tests__/parseHookNames-test.js | 292 ++++++++++++++++++ .../src/__tests__/updateMockSourceMaps.js | 98 +++++- .../react-devtools-extensions/src/astUtils.js | 228 +++++++++++++- .../src/generateHookMap.js | 123 ++++++++ .../src/getHookNameForLocation.js | 274 ++++++++++++++++ .../src/parseHookNames/parseHookNames.js | 90 +++++- scripts/flow/config/flowconfig | 1 + yarn.lock | 70 ++++- 77 files changed, 3525 insertions(+), 33 deletions(-) create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js.map create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentUsingHooksIndirectly.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithCustomHook.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithExternalCustomHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithMultipleHooksPerLine.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithNestedHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ContainingStringSourceMappingURL.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/Example.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/InlineRequire.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ToDoList.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/index.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/useTheme.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentUsingHooksIndirectly.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithCustomHook.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithExternalCustomHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithMultipleHooksPerLine.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithNestedHooks.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ContainingStringSourceMappingURL.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/Example.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/InlineRequire.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ToDoList.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/index.js create mode 100644 packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/useTheme.js create mode 100644 packages/react-devtools-extensions/src/__tests__/generateHookMap-test.js create mode 100644 packages/react-devtools-extensions/src/__tests__/getHookNameForLocation-test.js create mode 100644 packages/react-devtools-extensions/src/generateHookMap.js create mode 100644 packages/react-devtools-extensions/src/getHookNameForLocation.js diff --git a/packages/react-devtools-extensions/package.json b/packages/react-devtools-extensions/package.json index 1b85e113cbf403..35334517cf7d45 100644 --- a/packages/react-devtools-extensions/package.json +++ b/packages/react-devtools-extensions/package.json @@ -17,10 +17,12 @@ "test:firefox": "node ./firefox/test", "test:edge": "node ./edge/test", "improve-images": "node ./improveImages.mjs", - "update-mock-source-maps": "node ./src/__tests__/updateMockSourceMaps.js" + "update-mock-source-maps": "babel-node --presets=@babel/preset-env,@babel/preset-flow ./src/__tests__/updateMockSourceMaps.js" }, "devDependencies": { "@babel/core": "^7.11.1", + "@babel/node": "^7.14.7", + "@babel/parser": "^7.14.8", "@babel/plugin-proposal-class-properties": "^7.10.4", "@babel/plugin-transform-flow-strip-types": "^7.10.4", "@babel/plugin-transform-modules-commonjs": "^7.10.4", diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js new file mode 100644 index 00000000000000..6925712d17c7ce --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js @@ -0,0 +1,45 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const countState = (0, _react.useState)(0); + const count = countState[0]; + const setCount = countState[1]; + const darkMode = useIsDarkMode(); + const [isDarkMode] = darkMode; + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const darkModeState = (0, _react.useState)(false); + const [isDarkMode] = darkModeState; + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return [isDarkMode, () => {}]; +} +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js.map new file mode 100644 index 00000000000000..f8e72b2f12626d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentUsingHooksIndirectly.js"],"names":["Component","countState","count","setCount","darkMode","useIsDarkMode","isDarkMode","handleClick","darkModeState","useEffectCreate"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAMC,UAAU,GAAG,qBAAS,CAAT,CAAnB;AACA,QAAMC,KAAK,GAAGD,UAAU,CAAC,CAAD,CAAxB;AACA,QAAME,QAAQ,GAAGF,UAAU,CAAC,CAAD,CAA3B;AAEA,QAAMG,QAAQ,GAAGC,aAAa,EAA9B;AACA,QAAM,CAACC,UAAD,IAAeF,QAArB;AAEA,wBAAU,MAAM,CACd;AACD,GAFD,EAEG,EAFH;;AAIA,QAAMG,WAAW,GAAG,MAAMJ,QAAQ,CAACD,KAAK,GAAG,CAAT,CAAlC;;AAEA,sBACE,yEACE,yDAAiBI,UAAjB,CADF,eAEE,qDAAaJ,KAAb,CAFF,eAGE;AAAQ,IAAA,OAAO,EAAEK;AAAjB,oBAHF,CADF;AAOD;;AAED,SAASF,aAAT,GAAyB;AACvB,QAAMG,aAAa,GAAG,qBAAS,KAAT,CAAtB;AACA,QAAM,CAACF,UAAD,IAAeE,aAArB;AAEA,wBAAU,SAASC,eAAT,GAA2B,CACnC;AACD,GAFD,EAEG,EAFH;AAIA,SAAO,CAACH,UAAD,EAAa,MAAM,CAAE,CAArB,CAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useEffect, useState} from 'react';\n\nexport function Component() {\n const countState = useState(0);\n const count = countState[0];\n const setCount = countState[1];\n\n const darkMode = useIsDarkMode();\n const [isDarkMode] = darkMode;\n\n useEffect(() => {\n // ...\n }, []);\n\n const handleClick = () => setCount(count + 1);\n\n return (\n <>\n
Dark mode? {isDarkMode}
\n
Count: {count}
\n \n \n );\n}\n\nfunction useIsDarkMode() {\n const darkModeState = useState(false);\n const [isDarkMode] = darkModeState;\n\n useEffect(function useEffectCreate() {\n // Here is where we may listen to a \"theme\" event...\n }, []);\n\n return [isDarkMode, () => {}];\n}\n"],"x_fb_sources":[[null,{"names":["","count","darkMode","isDarkMode"],"mappings":"CAAD;aqBCA,AWDA;iBbEA,AeFA;oCVGA,AeHA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js new file mode 100644 index 00000000000000..e326d7a4962d5e --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js @@ -0,0 +1,41 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + const isDarkMode = useIsDarkMode(); + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const [isDarkMode] = (0, _react.useState)(false); + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return isDarkMode; +} +//# sourceMappingURL=ComponentWithCustomHook.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js.map new file mode 100644 index 00000000000000..1e55e029876c76 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithCustomHook.js"],"names":["Component","count","setCount","isDarkMode","useIsDarkMode","handleClick","useEffectCreate"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AACA,QAAMC,UAAU,GAAGC,aAAa,EAAhC;AAEA,wBAAU,MAAM,CACd;AACD,GAFD,EAEG,EAFH;;AAIA,QAAMC,WAAW,GAAG,MAAMH,QAAQ,CAACD,KAAK,GAAG,CAAT,CAAlC;;AAEA,sBACE,yEACE,yDAAiBE,UAAjB,CADF,eAEE,qDAAaF,KAAb,CAFF,eAGE;AAAQ,IAAA,OAAO,EAAEI;AAAjB,oBAHF,CADF;AAOD;;AAED,SAASD,aAAT,GAAyB;AACvB,QAAM,CAACD,UAAD,IAAe,qBAAS,KAAT,CAArB;AAEA,wBAAU,SAASG,eAAT,GAA2B,CACnC;AACD,GAFD,EAEG,EAFH;AAIA,SAAOH,UAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useEffect, useState} from 'react';\n\nexport function Component() {\n const [count, setCount] = useState(0);\n const isDarkMode = useIsDarkMode();\n\n useEffect(() => {\n // ...\n }, []);\n\n const handleClick = () => setCount(count + 1);\n\n return (\n <>\n
Dark mode? {isDarkMode}
\n
Count: {count}
\n \n \n );\n}\n\nfunction useIsDarkMode() {\n const [isDarkMode] = useState(false);\n\n useEffect(function useEffectCreate() {\n // Here is where we may listen to a \"theme\" event...\n }, []);\n\n return isDarkMode;\n}\n"],"x_fb_sources":[[null,{"names":["","count","isDarkMode"],"mappings":"CAAD;a4BCA,AWDA;clBEA,AeFA;gCbEA,AeFA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js new file mode 100644 index 00000000000000..05aedb938b715d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js @@ -0,0 +1,26 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireDefault(require("react")); + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const theme = (0, _useTheme.default)(); + return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme); +} +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js.map new file mode 100644 index 00000000000000..b09f62f6e0baaa --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithExternalCustomHooks.js"],"names":["Component","theme"],"mappings":";;;;;;;AASA;;AACA;;;;AAVA;;;;;;;;AAYO,SAASA,SAAT,GAAqB;AAC1B,QAAMC,KAAK,GAAG,wBAAd;AAEA,sBAAO,qDAAaA,KAAb,CAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React from 'react';\nimport useTheme from './useTheme';\n\nexport function Component() {\n const theme = useTheme();\n\n return
theme: {theme}
;\n}\n"],"x_fb_sources":[[null,{"names":["","theme"],"mappings":"CAAD;cgBCA,AUDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js new file mode 100644 index 00000000000000..c657f3eb54551f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js @@ -0,0 +1,30 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const A = /*#__PURE__*/(0, _react.createContext)(1); +const B = /*#__PURE__*/(0, _react.createContext)(2); + +function Component() { + const a = (0, _react.useContext)(A); + const b = (0, _react.useContext)(B); // prettier-ignore + + const c = (0, _react.useContext)(A), + d = (0, _react.useContext)(B); // eslint-disable-line one-var + + return a + b + c + d; +} +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js.map new file mode 100644 index 00000000000000..96ff387bccc683 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithMultipleHooksPerLine.js"],"names":["A","B","Component","a","b","c","d"],"mappings":";;;;;;;AASA;;AATA;;;;;;;;AAWA,MAAMA,CAAC,gBAAG,0BAAc,CAAd,CAAV;AACA,MAAMC,CAAC,gBAAG,0BAAc,CAAd,CAAV;;AAEO,SAASC,SAAT,GAAqB;AAC1B,QAAMC,CAAC,GAAG,uBAAWH,CAAX,CAAV;AACA,QAAMI,CAAC,GAAG,uBAAWH,CAAX,CAAV,CAF0B,CAI1B;;AACA,QAAMI,CAAC,GAAG,uBAAWL,CAAX,CAAV;AAAA,QAAyBM,CAAC,GAAG,uBAAWL,CAAX,CAA7B,CAL0B,CAKkB;;AAE5C,SAAOE,CAAC,GAAGC,CAAJ,GAAQC,CAAR,GAAYC,CAAnB;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport {createContext, useContext} from 'react';\n\nconst A = createContext(1);\nconst B = createContext(2);\n\nexport function Component() {\n const a = useContext(A);\n const b = useContext(B);\n\n // prettier-ignore\n const c = useContext(A), d = useContext(B); // eslint-disable-line one-var\n\n return a + b + c + d;\n}\n"],"x_fb_sources":[[null,{"names":["","a","b","c","d"],"mappings":"CAAD;gBYCA,AaDA;iBbEA,AaFA;oBbGA,AaHA,AMIA,AaJA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js new file mode 100644 index 00000000000000..3cfed69078a8ca --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js @@ -0,0 +1,28 @@ +"use strict"; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const { + useMemo, + useState +} = require('react'); + +function Component(props) { + const InnerComponent = useMemo(() => () => { + const [state] = useState(0); + return state; + }); + props.callback(InnerComponent); + return null; +} + +module.exports = { + Component +}; +//# sourceMappingURL=ComponentWithNestedHooks.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js.map new file mode 100644 index 00000000000000..d894f112fe2afc --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithNestedHooks.js"],"names":["useMemo","useState","require","Component","props","InnerComponent","state","callback","module","exports"],"mappings":";;AAAA;;;;;;;;AAQA,MAAM;AAACA,EAAAA,OAAD;AAAUC,EAAAA;AAAV,IAAsBC,OAAO,CAAC,OAAD,CAAnC;;AAEA,SAASC,SAAT,CAAmBC,KAAnB,EAA0B;AACxB,QAAMC,cAAc,GAAGL,OAAO,CAAC,MAAM,MAAM;AACzC,UAAM,CAACM,KAAD,IAAUL,QAAQ,CAAC,CAAD,CAAxB;AAEA,WAAOK,KAAP;AACD,GAJ6B,CAA9B;AAKAF,EAAAA,KAAK,CAACG,QAAN,CAAeF,cAAf;AAEA,SAAO,IAAP;AACD;;AAEDG,MAAM,CAACC,OAAP,GAAiB;AAACN,EAAAA;AAAD,CAAjB","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\nconst {useMemo, useState} = require('react');\n\nfunction Component(props) {\n const InnerComponent = useMemo(() => () => {\n const [state] = useState(0);\n\n return state;\n });\n props.callback(InnerComponent);\n\n return null;\n}\n\nmodule.exports = {Component};\n"],"x_fb_sources":[[null,{"names":["","InnerComponent","state"],"mappings":"CAAD;YyBCA;aLCA,AWDA;gB3BDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js new file mode 100644 index 00000000000000..0fc2c078ca1255 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js @@ -0,0 +1,29 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +// ?sourceMappingURL=([^\s'"]+)/gm +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js.map new file mode 100644 index 00000000000000..bed33eccdea3c2 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ContainingStringSourceMappingURL.js"],"names":["Component","count","setCount"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWA;AAEO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AAEA,sBACE,uDACE,wDAAgBD,KAAhB,WADF,eAEE;AAAQ,IAAA,OAAO,EAAE,MAAMC,QAAQ,CAACD,KAAK,GAAG,CAAT;AAA/B,gBAFF,CADF;AAMD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useState} from 'react';\n\n// ?sourceMappingURL=([^\\s'\"]+)/gm\n\nexport function Component() {\n const [count, setCount] = useState(0);\n\n return (\n
\n

You clicked {count} times

\n \n
\n );\n}\n"],"x_fb_sources":[[null,{"names":["","count"],"mappings":"CAAD;e4BCA,AWDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js new file mode 100644 index 00000000000000..19134738824bc0 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js @@ -0,0 +1,28 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=Example.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js.map new file mode 100644 index 00000000000000..799ee59c1d707b --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["Example.js"],"names":["Component","count","setCount"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AAEA,sBACE,uDACE,wDAAgBD,KAAhB,WADF,eAEE;AAAQ,IAAA,OAAO,EAAE,MAAMC,QAAQ,CAACD,KAAK,GAAG,CAAT;AAA/B,gBAFF,CADF;AAMD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useState} from 'react';\n\nexport function Component() {\n const [count, setCount] = useState(0);\n\n return (\n
\n

You clicked {count} times

\n \n
\n );\n}\n"],"x_fb_sources":[[null,{"names":["","count"],"mappings":"CAAD;a4BCA,AWDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js new file mode 100644 index 00000000000000..388aeda62b308f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js @@ -0,0 +1,21 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count] = require('react').useState(0); + + return count; +} +//# sourceMappingURL=InlineRequire.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js.map new file mode 100644 index 00000000000000..635462c6c11765 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["InlineRequire.js"],"names":["Component","count","require","useState"],"mappings":";;;;;;;AAAA;;;;;;;;AASO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,IAAUC,OAAO,CAAC,OAAD,CAAP,CAAiBC,QAAjB,CAA0B,CAA1B,CAAhB;;AAEA,SAAOF,KAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nexport function Component() {\n const [count] = require('react').useState(0);\n\n return count;\n}\n"],"x_fb_sources":[[null,{"names":[""],"mappings":"CAAD"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js new file mode 100644 index 00000000000000..a6eb863b661ff4 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js @@ -0,0 +1,106 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.ListItem = ListItem; +exports.List = List; + +var React = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function ListItem({ + item, + removeItem, + toggleItem +}) { + const handleDelete = (0, React.useCallback)(() => { + removeItem(item); + }, [item, removeItem]); + const handleToggle = (0, React.useCallback)(() => { + toggleItem(item); + }, [item, toggleItem]); + return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("button", { + onClick: handleDelete + }, "Delete"), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", { + checked: item.isComplete, + onChange: handleToggle, + type: "checkbox" + }), ' ', item.text)); +} + +function List(props) { + const [newItemText, setNewItemText] = (0, React.useState)(''); + const [items, setItems] = (0, React.useState)([{ + id: 1, + isComplete: true, + text: 'First' + }, { + id: 2, + isComplete: true, + text: 'Second' + }, { + id: 3, + isComplete: false, + text: 'Third' + }]); + const [uid, setUID] = (0, React.useState)(4); + const handleClick = (0, React.useCallback)(() => { + if (newItemText !== '') { + setItems([...items, { + id: uid, + isComplete: false, + text: newItemText + }]); + setUID(uid + 1); + setNewItemText(''); + } + }, [newItemText, items, uid]); + const handleKeyPress = (0, React.useCallback)(event => { + if (event.key === 'Enter') { + handleClick(); + } + }, [handleClick]); + const handleChange = (0, React.useCallback)(event => { + setNewItemText(event.currentTarget.value); + }, [setNewItemText]); + const removeItem = (0, React.useCallback)(itemToRemove => setItems(items.filter(item => item !== itemToRemove)), [items]); + const toggleItem = (0, React.useCallback)(itemToToggle => { + // Dont use indexOf() + // because editing props in DevTools creates a new Object. + const index = items.findIndex(item => item.id === itemToToggle.id); + setItems(items.slice(0, index).concat({ ...itemToToggle, + isComplete: !itemToToggle.isComplete + }).concat(items.slice(index + 1))); + }, [items]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "List"), /*#__PURE__*/React.createElement("input", { + type: "text", + placeholder: "New list item...", + value: newItemText, + onChange: handleChange, + onKeyPress: handleKeyPress + }), /*#__PURE__*/React.createElement("button", { + disabled: newItemText === '', + onClick: handleClick + }, /*#__PURE__*/React.createElement("span", { + role: "img", + "aria-label": "Add item" + }, "Add")), /*#__PURE__*/React.createElement("ul", null, items.map(item => /*#__PURE__*/React.createElement(ListItem, { + key: item.id, + item: item, + removeItem: removeItem, + toggleItem: toggleItem + })))); +} +//# sourceMappingURL=ToDoList.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js.map new file mode 100644 index 00000000000000..b06880d9253cc6 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ToDoList.js"],"names":["ListItem","item","removeItem","toggleItem","handleDelete","handleToggle","isComplete","text","List","props","newItemText","setNewItemText","items","setItems","id","uid","setUID","handleClick","handleKeyPress","event","key","handleChange","currentTarget","value","itemToRemove","filter","itemToToggle","index","findIndex","slice","concat","map"],"mappings":";;;;;;;;AASA;;;;;;AATA;;;;;;;;AAYO,SAASA,QAAT,CAAkB;AAACC,EAAAA,IAAD;AAAOC,EAAAA,UAAP;AAAmBC,EAAAA;AAAnB,CAAlB,EAAkD;AACvD,QAAMC,YAAY,GAAG,uBAAY,MAAM;AACrCF,IAAAA,UAAU,CAACD,IAAD,CAAV;AACD,GAFoB,EAElB,CAACA,IAAD,EAAOC,UAAP,CAFkB,CAArB;AAIA,QAAMG,YAAY,GAAG,uBAAY,MAAM;AACrCF,IAAAA,UAAU,CAACF,IAAD,CAAV;AACD,GAFoB,EAElB,CAACA,IAAD,EAAOE,UAAP,CAFkB,CAArB;AAIA,sBACE,6CACE;AAAQ,IAAA,OAAO,EAAEC;AAAjB,cADF,eAEE,gDACE;AACE,IAAA,OAAO,EAAEH,IAAI,CAACK,UADhB;AAEE,IAAA,QAAQ,EAAED,YAFZ;AAGE,IAAA,IAAI,EAAC;AAHP,IADF,EAKK,GALL,EAMGJ,IAAI,CAACM,IANR,CAFF,CADF;AAaD;;AAEM,SAASC,IAAT,CAAcC,KAAd,EAAqB;AAC1B,QAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,oBAAS,EAAT,CAAtC;AACA,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,oBAAS,CACjC;AAACC,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,IAApB;AAA0BC,IAAAA,IAAI,EAAE;AAAhC,GADiC,EAEjC;AAACO,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,IAApB;AAA0BC,IAAAA,IAAI,EAAE;AAAhC,GAFiC,EAGjC;AAACO,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,KAApB;AAA2BC,IAAAA,IAAI,EAAE;AAAjC,GAHiC,CAAT,CAA1B;AAKA,QAAM,CAACQ,GAAD,EAAMC,MAAN,IAAgB,oBAAS,CAAT,CAAtB;AAEA,QAAMC,WAAW,GAAG,uBAAY,MAAM;AACpC,QAAIP,WAAW,KAAK,EAApB,EAAwB;AACtBG,MAAAA,QAAQ,CAAC,CACP,GAAGD,KADI,EAEP;AACEE,QAAAA,EAAE,EAAEC,GADN;AAEET,QAAAA,UAAU,EAAE,KAFd;AAGEC,QAAAA,IAAI,EAAEG;AAHR,OAFO,CAAD,CAAR;AAQAM,MAAAA,MAAM,CAACD,GAAG,GAAG,CAAP,CAAN;AACAJ,MAAAA,cAAc,CAAC,EAAD,CAAd;AACD;AACF,GAbmB,EAajB,CAACD,WAAD,EAAcE,KAAd,EAAqBG,GAArB,CAbiB,CAApB;AAeA,QAAMG,cAAc,GAAG,uBACrBC,KAAK,IAAI;AACP,QAAIA,KAAK,CAACC,GAAN,KAAc,OAAlB,EAA2B;AACzBH,MAAAA,WAAW;AACZ;AACF,GALoB,EAMrB,CAACA,WAAD,CANqB,CAAvB;AASA,QAAMI,YAAY,GAAG,uBACnBF,KAAK,IAAI;AACPR,IAAAA,cAAc,CAACQ,KAAK,CAACG,aAAN,CAAoBC,KAArB,CAAd;AACD,GAHkB,EAInB,CAACZ,cAAD,CAJmB,CAArB;AAOA,QAAMT,UAAU,GAAG,uBACjBsB,YAAY,IAAIX,QAAQ,CAACD,KAAK,CAACa,MAAN,CAAaxB,IAAI,IAAIA,IAAI,KAAKuB,YAA9B,CAAD,CADP,EAEjB,CAACZ,KAAD,CAFiB,CAAnB;AAKA,QAAMT,UAAU,GAAG,uBACjBuB,YAAY,IAAI;AACd;AACA;AACA,UAAMC,KAAK,GAAGf,KAAK,CAACgB,SAAN,CAAgB3B,IAAI,IAAIA,IAAI,CAACa,EAAL,KAAYY,YAAY,CAACZ,EAAjD,CAAd;AAEAD,IAAAA,QAAQ,CACND,KAAK,CACFiB,KADH,CACS,CADT,EACYF,KADZ,EAEGG,MAFH,CAEU,EACN,GAAGJ,YADG;AAENpB,MAAAA,UAAU,EAAE,CAACoB,YAAY,CAACpB;AAFpB,KAFV,EAMGwB,MANH,CAMUlB,KAAK,CAACiB,KAAN,CAAYF,KAAK,GAAG,CAApB,CANV,CADM,CAAR;AASD,GAfgB,EAgBjB,CAACf,KAAD,CAhBiB,CAAnB;AAmBA,sBACE,oBAAC,cAAD,qBACE,uCADF,eAEE;AACE,IAAA,IAAI,EAAC,MADP;AAEE,IAAA,WAAW,EAAC,kBAFd;AAGE,IAAA,KAAK,EAAEF,WAHT;AAIE,IAAA,QAAQ,EAAEW,YAJZ;AAKE,IAAA,UAAU,EAAEH;AALd,IAFF,eASE;AAAQ,IAAA,QAAQ,EAAER,WAAW,KAAK,EAAlC;AAAsC,IAAA,OAAO,EAAEO;AAA/C,kBACE;AAAM,IAAA,IAAI,EAAC,KAAX;AAAiB,kBAAW;AAA5B,WADF,CATF,eAcE,gCACGL,KAAK,CAACmB,GAAN,CAAU9B,IAAI,iBACb,oBAAC,QAAD;AACE,IAAA,GAAG,EAAEA,IAAI,CAACa,EADZ;AAEE,IAAA,IAAI,EAAEb,IAFR;AAGE,IAAA,UAAU,EAAEC,UAHd;AAIE,IAAA,UAAU,EAAEC;AAJd,IADD,CADH,CAdF,CADF;AA2BD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport * as React from 'react';\nimport {Fragment, useCallback, useState} from 'react';\n\nexport function ListItem({item, removeItem, toggleItem}) {\n const handleDelete = useCallback(() => {\n removeItem(item);\n }, [item, removeItem]);\n\n const handleToggle = useCallback(() => {\n toggleItem(item);\n }, [item, toggleItem]);\n\n return (\n
  • \n \n \n
    • \n );\n}\n\nexport function List(props) {\n const [newItemText, setNewItemText] = useState('');\n const [items, setItems] = useState([\n {id: 1, isComplete: true, text: 'First'},\n {id: 2, isComplete: true, text: 'Second'},\n {id: 3, isComplete: false, text: 'Third'},\n ]);\n const [uid, setUID] = useState(4);\n\n const handleClick = useCallback(() => {\n if (newItemText !== '') {\n setItems([\n ...items,\n {\n id: uid,\n isComplete: false,\n text: newItemText,\n },\n ]);\n setUID(uid + 1);\n setNewItemText('');\n }\n }, [newItemText, items, uid]);\n\n const handleKeyPress = useCallback(\n event => {\n if (event.key === 'Enter') {\n handleClick();\n }\n },\n [handleClick],\n );\n\n const handleChange = useCallback(\n event => {\n setNewItemText(event.currentTarget.value);\n },\n [setNewItemText],\n );\n\n const removeItem = useCallback(\n itemToRemove => setItems(items.filter(item => item !== itemToRemove)),\n [items],\n );\n\n const toggleItem = useCallback(\n itemToToggle => {\n // Dont use indexOf()\n // because editing props in DevTools creates a new Object.\n const index = items.findIndex(item => item.id === itemToToggle.id);\n\n setItems(\n items\n .slice(0, index)\n .concat({\n ...itemToToggle,\n isComplete: !itemToToggle.isComplete,\n })\n .concat(items.slice(index + 1)),\n );\n },\n [items],\n );\n\n return (\n \n

    List

    \n \n \n
      \n {items.map(item => (\n \n ))}\n
    \n     \n );\n}\n"],"x_fb_sources":[[null,{"names":["","handleDelete","handleToggle","newItemText","items","uid","handleClick","handleKeyPress","handleChange","removeItem","toggleItem"],"mappings":"CAAD;cuBCA;gBCDA;kBDEA;oBCFA;sCgBGA,AYHA;uCxBIA;2CxBJA;4CoBKA,AWLA;8CbMA;2DSNA;6DNOA;oEtBPA;sEoBQA;2EpBRA;6EkBSA;gFlBTA;kFkBUA;mGlBVA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js new file mode 100644 index 00000000000000..a0f706b19fbaff --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js @@ -0,0 +1,89 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +Object.defineProperty(exports, "ComponentUsingHooksIndirectly", { + enumerable: true, + get: function () { + return _ComponentUsingHooksIndirectly.Component; + } +}); +Object.defineProperty(exports, "ComponentWithCustomHook", { + enumerable: true, + get: function () { + return _ComponentWithCustomHook.Component; + } +}); +Object.defineProperty(exports, "ComponentWithExternalCustomHooks", { + enumerable: true, + get: function () { + return _ComponentWithExternalCustomHooks.Component; + } +}); +Object.defineProperty(exports, "ComponentWithMultipleHooksPerLine", { + enumerable: true, + get: function () { + return _ComponentWithMultipleHooksPerLine.Component; + } +}); +Object.defineProperty(exports, "ComponentWithNestedHooks", { + enumerable: true, + get: function () { + return _ComponentWithNestedHooks.Component; + } +}); +Object.defineProperty(exports, "ContainingStringSourceMappingURL", { + enumerable: true, + get: function () { + return _ContainingStringSourceMappingURL.Component; + } +}); +Object.defineProperty(exports, "Example", { + enumerable: true, + get: function () { + return _Example.Component; + } +}); +Object.defineProperty(exports, "InlineRequire", { + enumerable: true, + get: function () { + return _InlineRequire.Component; + } +}); +Object.defineProperty(exports, "useTheme", { + enumerable: true, + get: function () { + return _useTheme.default; + } +}); +exports.ToDoList = void 0; + +var _ComponentUsingHooksIndirectly = require("./ComponentUsingHooksIndirectly"); + +var _ComponentWithCustomHook = require("./ComponentWithCustomHook"); + +var _ComponentWithExternalCustomHooks = require("./ComponentWithExternalCustomHooks"); + +var _ComponentWithMultipleHooksPerLine = require("./ComponentWithMultipleHooksPerLine"); + +var _ComponentWithNestedHooks = require("./ComponentWithNestedHooks"); + +var _ContainingStringSourceMappingURL = require("./ContainingStringSourceMappingURL"); + +var _Example = require("./Example"); + +var _InlineRequire = require("./InlineRequire"); + +var ToDoList = _interopRequireWildcard(require("./ToDoList")); + +exports.ToDoList = ToDoList; + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } +//# sourceMappingURL=index.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js.map new file mode 100644 index 00000000000000..ed73e714bec48a --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nexport {Component as ComponentUsingHooksIndirectly} from './ComponentUsingHooksIndirectly';\nexport {Component as ComponentWithCustomHook} from './ComponentWithCustomHook';\nexport {Component as ComponentWithExternalCustomHooks} from './ComponentWithExternalCustomHooks';\nexport {Component as ComponentWithMultipleHooksPerLine} from './ComponentWithMultipleHooksPerLine';\nexport {Component as ComponentWithNestedHooks} from './ComponentWithNestedHooks';\nexport {Component as ContainingStringSourceMappingURL} from './ContainingStringSourceMappingURL';\nexport {Component as Example} from './Example';\nexport {Component as InlineRequire} from './InlineRequire';\nimport * as ToDoList from './ToDoList';\nexport {ToDoList};\nexport {default as useTheme} from './useTheme';\n"],"x_fb_sources":[[null,{"names":[""],"mappings":"CAAD"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js new file mode 100644 index 00000000000000..95bb454253ec31 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js @@ -0,0 +1,27 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = useTheme; +exports.ThemeContext = void 0; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const ThemeContext = /*#__PURE__*/(0, _react.createContext)('bright'); +exports.ThemeContext = ThemeContext; + +function useTheme() { + const theme = (0, _react.useContext)(ThemeContext); + (0, _react.useDebugValue)(theme); + return theme; +} +//# sourceMappingURL=useTheme.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js.map new file mode 100644 index 00000000000000..e5129095bfcd09 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["useTheme.js"],"names":["ThemeContext","useTheme","theme"],"mappings":";;;;;;;;AASA;;AATA;;;;;;;;AAWO,MAAMA,YAAY,gBAAG,0BAAc,QAAd,CAArB;;;AAEQ,SAASC,QAAT,GAAoB;AACjC,QAAMC,KAAK,GAAG,uBAAWF,YAAX,CAAd;AACA,4BAAcE,KAAd;AACA,SAAOA,KAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport {createContext, useContext, useDebugValue} from 'react';\n\nexport const ThemeContext = createContext('bright');\n\nexport default function useTheme() {\n const theme = useContext(ThemeContext);\n useDebugValue(theme);\n return theme;\n}\n"],"x_fb_sources":[[null,{"names":["","theme"],"mappings":"CAAD;egBCA,AwBDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js new file mode 100644 index 00000000000000..6925712d17c7ce --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js @@ -0,0 +1,45 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const countState = (0, _react.useState)(0); + const count = countState[0]; + const setCount = countState[1]; + const darkMode = useIsDarkMode(); + const [isDarkMode] = darkMode; + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const darkModeState = (0, _react.useState)(false); + const [isDarkMode] = darkModeState; + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return [isDarkMode, () => {}]; +} +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js.map new file mode 100644 index 00000000000000..0740333a06d7cb --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentUsingHooksIndirectly.js"],"names":["Component","countState","count","setCount","darkMode","useIsDarkMode","isDarkMode","handleClick","darkModeState","useEffectCreate"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAMC,UAAU,GAAG,qBAAS,CAAT,CAAnB;AACA,QAAMC,KAAK,GAAGD,UAAU,CAAC,CAAD,CAAxB;AACA,QAAME,QAAQ,GAAGF,UAAU,CAAC,CAAD,CAA3B;AAEA,QAAMG,QAAQ,GAAGC,aAAa,EAA9B;AACA,QAAM,CAACC,UAAD,IAAeF,QAArB;AAEA,wBAAU,MAAM,CACd;AACD,GAFD,EAEG,EAFH;;AAIA,QAAMG,WAAW,GAAG,MAAMJ,QAAQ,CAACD,KAAK,GAAG,CAAT,CAAlC;;AAEA,sBACE,yEACE,yDAAiBI,UAAjB,CADF,eAEE,qDAAaJ,KAAb,CAFF,eAGE;AAAQ,IAAA,OAAO,EAAEK;AAAjB,oBAHF,CADF;AAOD;;AAED,SAASF,aAAT,GAAyB;AACvB,QAAMG,aAAa,GAAG,qBAAS,KAAT,CAAtB;AACA,QAAM,CAACF,UAAD,IAAeE,aAArB;AAEA,wBAAU,SAASC,eAAT,GAA2B,CACnC;AACD,GAFD,EAEG,EAFH;AAIA,SAAO,CAACH,UAAD,EAAa,MAAM,CAAE,CAArB,CAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useEffect, useState} from 'react';\n\nexport function Component() {\n const countState = useState(0);\n const count = countState[0];\n const setCount = countState[1];\n\n const darkMode = useIsDarkMode();\n const [isDarkMode] = darkMode;\n\n useEffect(() => {\n // ...\n }, []);\n\n const handleClick = () => setCount(count + 1);\n\n return (\n <>\n
    Dark mode? {isDarkMode}
    \n
    Count: {count}
    \n \n \n );\n}\n\nfunction useIsDarkMode() {\n const darkModeState = useState(false);\n const [isDarkMode] = darkModeState;\n\n useEffect(function useEffectCreate() {\n // Here is where we may listen to a \"theme\" event...\n }, []);\n\n return [isDarkMode, () => {}];\n}\n"],"x_react_sources":[[{"names":["","count","darkMode","isDarkMode"],"mappings":"CAAD;aqBCA,AWDA;iBbEA,AeFA;oCVGA,AeHA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js new file mode 100644 index 00000000000000..e326d7a4962d5e --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js @@ -0,0 +1,41 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + const isDarkMode = useIsDarkMode(); + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const [isDarkMode] = (0, _react.useState)(false); + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return isDarkMode; +} +//# sourceMappingURL=ComponentWithCustomHook.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js.map new file mode 100644 index 00000000000000..53b09d9ef25b2d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithCustomHook.js"],"names":["Component","count","setCount","isDarkMode","useIsDarkMode","handleClick","useEffectCreate"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AACA,QAAMC,UAAU,GAAGC,aAAa,EAAhC;AAEA,wBAAU,MAAM,CACd;AACD,GAFD,EAEG,EAFH;;AAIA,QAAMC,WAAW,GAAG,MAAMH,QAAQ,CAACD,KAAK,GAAG,CAAT,CAAlC;;AAEA,sBACE,yEACE,yDAAiBE,UAAjB,CADF,eAEE,qDAAaF,KAAb,CAFF,eAGE;AAAQ,IAAA,OAAO,EAAEI;AAAjB,oBAHF,CADF;AAOD;;AAED,SAASD,aAAT,GAAyB;AACvB,QAAM,CAACD,UAAD,IAAe,qBAAS,KAAT,CAArB;AAEA,wBAAU,SAASG,eAAT,GAA2B,CACnC;AACD,GAFD,EAEG,EAFH;AAIA,SAAOH,UAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useEffect, useState} from 'react';\n\nexport function Component() {\n const [count, setCount] = useState(0);\n const isDarkMode = useIsDarkMode();\n\n useEffect(() => {\n // ...\n }, []);\n\n const handleClick = () => setCount(count + 1);\n\n return (\n <>\n
    Dark mode? {isDarkMode}
    \n
    Count: {count}
    \n \n \n );\n}\n\nfunction useIsDarkMode() {\n const [isDarkMode] = useState(false);\n\n useEffect(function useEffectCreate() {\n // Here is where we may listen to a \"theme\" event...\n }, []);\n\n return isDarkMode;\n}\n"],"x_react_sources":[[{"names":["","count","isDarkMode"],"mappings":"CAAD;a4BCA,AWDA;clBEA,AeFA;gCbEA,AeFA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js new file mode 100644 index 00000000000000..05aedb938b715d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js @@ -0,0 +1,26 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireDefault(require("react")); + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const theme = (0, _useTheme.default)(); + return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme); +} +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js.map new file mode 100644 index 00000000000000..5c01a8334dbcbd --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithExternalCustomHooks.js"],"names":["Component","theme"],"mappings":";;;;;;;AASA;;AACA;;;;AAVA;;;;;;;;AAYO,SAASA,SAAT,GAAqB;AAC1B,QAAMC,KAAK,GAAG,wBAAd;AAEA,sBAAO,qDAAaA,KAAb,CAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React from 'react';\nimport useTheme from './useTheme';\n\nexport function Component() {\n const theme = useTheme();\n\n return
    theme: {theme}
    ;\n}\n"],"x_react_sources":[[{"names":["","theme"],"mappings":"CAAD;cgBCA,AUDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js new file mode 100644 index 00000000000000..c657f3eb54551f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js @@ -0,0 +1,30 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const A = /*#__PURE__*/(0, _react.createContext)(1); +const B = /*#__PURE__*/(0, _react.createContext)(2); + +function Component() { + const a = (0, _react.useContext)(A); + const b = (0, _react.useContext)(B); // prettier-ignore + + const c = (0, _react.useContext)(A), + d = (0, _react.useContext)(B); // eslint-disable-line one-var + + return a + b + c + d; +} +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js.map new file mode 100644 index 00000000000000..f6a743e1cebf98 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithMultipleHooksPerLine.js"],"names":["A","B","Component","a","b","c","d"],"mappings":";;;;;;;AASA;;AATA;;;;;;;;AAWA,MAAMA,CAAC,gBAAG,0BAAc,CAAd,CAAV;AACA,MAAMC,CAAC,gBAAG,0BAAc,CAAd,CAAV;;AAEO,SAASC,SAAT,GAAqB;AAC1B,QAAMC,CAAC,GAAG,uBAAWH,CAAX,CAAV;AACA,QAAMI,CAAC,GAAG,uBAAWH,CAAX,CAAV,CAF0B,CAI1B;;AACA,QAAMI,CAAC,GAAG,uBAAWL,CAAX,CAAV;AAAA,QAAyBM,CAAC,GAAG,uBAAWL,CAAX,CAA7B,CAL0B,CAKkB;;AAE5C,SAAOE,CAAC,GAAGC,CAAJ,GAAQC,CAAR,GAAYC,CAAnB;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport {createContext, useContext} from 'react';\n\nconst A = createContext(1);\nconst B = createContext(2);\n\nexport function Component() {\n const a = useContext(A);\n const b = useContext(B);\n\n // prettier-ignore\n const c = useContext(A), d = useContext(B); // eslint-disable-line one-var\n\n return a + b + c + d;\n}\n"],"x_react_sources":[[{"names":["","a","b","c","d"],"mappings":"CAAD;gBYCA,AaDA;iBbEA,AaFA;oBbGA,AaHA,AMIA,AaJA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js new file mode 100644 index 00000000000000..3cfed69078a8ca --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js @@ -0,0 +1,28 @@ +"use strict"; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const { + useMemo, + useState +} = require('react'); + +function Component(props) { + const InnerComponent = useMemo(() => () => { + const [state] = useState(0); + return state; + }); + props.callback(InnerComponent); + return null; +} + +module.exports = { + Component +}; +//# sourceMappingURL=ComponentWithNestedHooks.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js.map new file mode 100644 index 00000000000000..b633971efcc7ad --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ComponentWithNestedHooks.js"],"names":["useMemo","useState","require","Component","props","InnerComponent","state","callback","module","exports"],"mappings":";;AAAA;;;;;;;;AAQA,MAAM;AAACA,EAAAA,OAAD;AAAUC,EAAAA;AAAV,IAAsBC,OAAO,CAAC,OAAD,CAAnC;;AAEA,SAASC,SAAT,CAAmBC,KAAnB,EAA0B;AACxB,QAAMC,cAAc,GAAGL,OAAO,CAAC,MAAM,MAAM;AACzC,UAAM,CAACM,KAAD,IAAUL,QAAQ,CAAC,CAAD,CAAxB;AAEA,WAAOK,KAAP;AACD,GAJ6B,CAA9B;AAKAF,EAAAA,KAAK,CAACG,QAAN,CAAeF,cAAf;AAEA,SAAO,IAAP;AACD;;AAEDG,MAAM,CAACC,OAAP,GAAiB;AAACN,EAAAA;AAAD,CAAjB","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\nconst {useMemo, useState} = require('react');\n\nfunction Component(props) {\n const InnerComponent = useMemo(() => () => {\n const [state] = useState(0);\n\n return state;\n });\n props.callback(InnerComponent);\n\n return null;\n}\n\nmodule.exports = {Component};\n"],"x_react_sources":[[{"names":["","InnerComponent","state"],"mappings":"CAAD;YyBCA;aLCA,AWDA;gB3BDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js new file mode 100644 index 00000000000000..0fc2c078ca1255 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js @@ -0,0 +1,29 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +// ?sourceMappingURL=([^\s'"]+)/gm +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js.map new file mode 100644 index 00000000000000..fdca45ffcf1287 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ContainingStringSourceMappingURL.js"],"names":["Component","count","setCount"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWA;AAEO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AAEA,sBACE,uDACE,wDAAgBD,KAAhB,WADF,eAEE;AAAQ,IAAA,OAAO,EAAE,MAAMC,QAAQ,CAACD,KAAK,GAAG,CAAT;AAA/B,gBAFF,CADF;AAMD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useState} from 'react';\n\n// ?sourceMappingURL=([^\\s'\"]+)/gm\n\nexport function Component() {\n const [count, setCount] = useState(0);\n\n return (\n
    \n

    You clicked {count} times

    \n \n
    \n );\n}\n"],"x_react_sources":[[{"names":["","count"],"mappings":"CAAD;e4BCA,AWDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js new file mode 100644 index 00000000000000..19134738824bc0 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js @@ -0,0 +1,28 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=Example.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js.map new file mode 100644 index 00000000000000..614e8ec7bc7e7f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["Example.js"],"names":["Component","count","setCount"],"mappings":";;;;;;;AASA;;;;;;AATA;;;;;;;;AAWO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,qBAAS,CAAT,CAA1B;AAEA,sBACE,uDACE,wDAAgBD,KAAhB,WADF,eAEE;AAAQ,IAAA,OAAO,EAAE,MAAMC,QAAQ,CAACD,KAAK,GAAG,CAAT;AAA/B,gBAFF,CADF;AAMD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport React, {useState} from 'react';\n\nexport function Component() {\n const [count, setCount] = useState(0);\n\n return (\n
    \n

    You clicked {count} times

    \n \n
    \n );\n}\n"],"x_react_sources":[[{"names":["","count"],"mappings":"CAAD;a4BCA,AWDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js new file mode 100644 index 00000000000000..388aeda62b308f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js @@ -0,0 +1,21 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count] = require('react').useState(0); + + return count; +} +//# sourceMappingURL=InlineRequire.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js.map new file mode 100644 index 00000000000000..f4b2ac45fff329 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["InlineRequire.js"],"names":["Component","count","require","useState"],"mappings":";;;;;;;AAAA;;;;;;;;AASO,SAASA,SAAT,GAAqB;AAC1B,QAAM,CAACC,KAAD,IAAUC,OAAO,CAAC,OAAD,CAAP,CAAiBC,QAAjB,CAA0B,CAA1B,CAAhB;;AAEA,SAAOF,KAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nexport function Component() {\n const [count] = require('react').useState(0);\n\n return count;\n}\n"],"x_react_sources":[[{"names":[""],"mappings":"CAAD"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js new file mode 100644 index 00000000000000..a6eb863b661ff4 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js @@ -0,0 +1,106 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.ListItem = ListItem; +exports.List = List; + +var React = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function ListItem({ + item, + removeItem, + toggleItem +}) { + const handleDelete = (0, React.useCallback)(() => { + removeItem(item); + }, [item, removeItem]); + const handleToggle = (0, React.useCallback)(() => { + toggleItem(item); + }, [item, toggleItem]); + return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("button", { + onClick: handleDelete + }, "Delete"), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", { + checked: item.isComplete, + onChange: handleToggle, + type: "checkbox" + }), ' ', item.text)); +} + +function List(props) { + const [newItemText, setNewItemText] = (0, React.useState)(''); + const [items, setItems] = (0, React.useState)([{ + id: 1, + isComplete: true, + text: 'First' + }, { + id: 2, + isComplete: true, + text: 'Second' + }, { + id: 3, + isComplete: false, + text: 'Third' + }]); + const [uid, setUID] = (0, React.useState)(4); + const handleClick = (0, React.useCallback)(() => { + if (newItemText !== '') { + setItems([...items, { + id: uid, + isComplete: false, + text: newItemText + }]); + setUID(uid + 1); + setNewItemText(''); + } + }, [newItemText, items, uid]); + const handleKeyPress = (0, React.useCallback)(event => { + if (event.key === 'Enter') { + handleClick(); + } + }, [handleClick]); + const handleChange = (0, React.useCallback)(event => { + setNewItemText(event.currentTarget.value); + }, [setNewItemText]); + const removeItem = (0, React.useCallback)(itemToRemove => setItems(items.filter(item => item !== itemToRemove)), [items]); + const toggleItem = (0, React.useCallback)(itemToToggle => { + // Dont use indexOf() + // because editing props in DevTools creates a new Object. + const index = items.findIndex(item => item.id === itemToToggle.id); + setItems(items.slice(0, index).concat({ ...itemToToggle, + isComplete: !itemToToggle.isComplete + }).concat(items.slice(index + 1))); + }, [items]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "List"), /*#__PURE__*/React.createElement("input", { + type: "text", + placeholder: "New list item...", + value: newItemText, + onChange: handleChange, + onKeyPress: handleKeyPress + }), /*#__PURE__*/React.createElement("button", { + disabled: newItemText === '', + onClick: handleClick + }, /*#__PURE__*/React.createElement("span", { + role: "img", + "aria-label": "Add item" + }, "Add")), /*#__PURE__*/React.createElement("ul", null, items.map(item => /*#__PURE__*/React.createElement(ListItem, { + key: item.id, + item: item, + removeItem: removeItem, + toggleItem: toggleItem + })))); +} +//# sourceMappingURL=ToDoList.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js.map new file mode 100644 index 00000000000000..5499d109beec8c --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["ToDoList.js"],"names":["ListItem","item","removeItem","toggleItem","handleDelete","handleToggle","isComplete","text","List","props","newItemText","setNewItemText","items","setItems","id","uid","setUID","handleClick","handleKeyPress","event","key","handleChange","currentTarget","value","itemToRemove","filter","itemToToggle","index","findIndex","slice","concat","map"],"mappings":";;;;;;;;AASA;;;;;;AATA;;;;;;;;AAYO,SAASA,QAAT,CAAkB;AAACC,EAAAA,IAAD;AAAOC,EAAAA,UAAP;AAAmBC,EAAAA;AAAnB,CAAlB,EAAkD;AACvD,QAAMC,YAAY,GAAG,uBAAY,MAAM;AACrCF,IAAAA,UAAU,CAACD,IAAD,CAAV;AACD,GAFoB,EAElB,CAACA,IAAD,EAAOC,UAAP,CAFkB,CAArB;AAIA,QAAMG,YAAY,GAAG,uBAAY,MAAM;AACrCF,IAAAA,UAAU,CAACF,IAAD,CAAV;AACD,GAFoB,EAElB,CAACA,IAAD,EAAOE,UAAP,CAFkB,CAArB;AAIA,sBACE,6CACE;AAAQ,IAAA,OAAO,EAAEC;AAAjB,cADF,eAEE,gDACE;AACE,IAAA,OAAO,EAAEH,IAAI,CAACK,UADhB;AAEE,IAAA,QAAQ,EAAED,YAFZ;AAGE,IAAA,IAAI,EAAC;AAHP,IADF,EAKK,GALL,EAMGJ,IAAI,CAACM,IANR,CAFF,CADF;AAaD;;AAEM,SAASC,IAAT,CAAcC,KAAd,EAAqB;AAC1B,QAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,oBAAS,EAAT,CAAtC;AACA,QAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,oBAAS,CACjC;AAACC,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,IAApB;AAA0BC,IAAAA,IAAI,EAAE;AAAhC,GADiC,EAEjC;AAACO,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,IAApB;AAA0BC,IAAAA,IAAI,EAAE;AAAhC,GAFiC,EAGjC;AAACO,IAAAA,EAAE,EAAE,CAAL;AAAQR,IAAAA,UAAU,EAAE,KAApB;AAA2BC,IAAAA,IAAI,EAAE;AAAjC,GAHiC,CAAT,CAA1B;AAKA,QAAM,CAACQ,GAAD,EAAMC,MAAN,IAAgB,oBAAS,CAAT,CAAtB;AAEA,QAAMC,WAAW,GAAG,uBAAY,MAAM;AACpC,QAAIP,WAAW,KAAK,EAApB,EAAwB;AACtBG,MAAAA,QAAQ,CAAC,CACP,GAAGD,KADI,EAEP;AACEE,QAAAA,EAAE,EAAEC,GADN;AAEET,QAAAA,UAAU,EAAE,KAFd;AAGEC,QAAAA,IAAI,EAAEG;AAHR,OAFO,CAAD,CAAR;AAQAM,MAAAA,MAAM,CAACD,GAAG,GAAG,CAAP,CAAN;AACAJ,MAAAA,cAAc,CAAC,EAAD,CAAd;AACD;AACF,GAbmB,EAajB,CAACD,WAAD,EAAcE,KAAd,EAAqBG,GAArB,CAbiB,CAApB;AAeA,QAAMG,cAAc,GAAG,uBACrBC,KAAK,IAAI;AACP,QAAIA,KAAK,CAACC,GAAN,KAAc,OAAlB,EAA2B;AACzBH,MAAAA,WAAW;AACZ;AACF,GALoB,EAMrB,CAACA,WAAD,CANqB,CAAvB;AASA,QAAMI,YAAY,GAAG,uBACnBF,KAAK,IAAI;AACPR,IAAAA,cAAc,CAACQ,KAAK,CAACG,aAAN,CAAoBC,KAArB,CAAd;AACD,GAHkB,EAInB,CAACZ,cAAD,CAJmB,CAArB;AAOA,QAAMT,UAAU,GAAG,uBACjBsB,YAAY,IAAIX,QAAQ,CAACD,KAAK,CAACa,MAAN,CAAaxB,IAAI,IAAIA,IAAI,KAAKuB,YAA9B,CAAD,CADP,EAEjB,CAACZ,KAAD,CAFiB,CAAnB;AAKA,QAAMT,UAAU,GAAG,uBACjBuB,YAAY,IAAI;AACd;AACA;AACA,UAAMC,KAAK,GAAGf,KAAK,CAACgB,SAAN,CAAgB3B,IAAI,IAAIA,IAAI,CAACa,EAAL,KAAYY,YAAY,CAACZ,EAAjD,CAAd;AAEAD,IAAAA,QAAQ,CACND,KAAK,CACFiB,KADH,CACS,CADT,EACYF,KADZ,EAEGG,MAFH,CAEU,EACN,GAAGJ,YADG;AAENpB,MAAAA,UAAU,EAAE,CAACoB,YAAY,CAACpB;AAFpB,KAFV,EAMGwB,MANH,CAMUlB,KAAK,CAACiB,KAAN,CAAYF,KAAK,GAAG,CAApB,CANV,CADM,CAAR;AASD,GAfgB,EAgBjB,CAACf,KAAD,CAhBiB,CAAnB;AAmBA,sBACE,oBAAC,cAAD,qBACE,uCADF,eAEE;AACE,IAAA,IAAI,EAAC,MADP;AAEE,IAAA,WAAW,EAAC,kBAFd;AAGE,IAAA,KAAK,EAAEF,WAHT;AAIE,IAAA,QAAQ,EAAEW,YAJZ;AAKE,IAAA,UAAU,EAAEH;AALd,IAFF,eASE;AAAQ,IAAA,QAAQ,EAAER,WAAW,KAAK,EAAlC;AAAsC,IAAA,OAAO,EAAEO;AAA/C,kBACE;AAAM,IAAA,IAAI,EAAC,KAAX;AAAiB,kBAAW;AAA5B,WADF,CATF,eAcE,gCACGL,KAAK,CAACmB,GAAN,CAAU9B,IAAI,iBACb,oBAAC,QAAD;AACE,IAAA,GAAG,EAAEA,IAAI,CAACa,EADZ;AAEE,IAAA,IAAI,EAAEb,IAFR;AAGE,IAAA,UAAU,EAAEC,UAHd;AAIE,IAAA,UAAU,EAAEC;AAJd,IADD,CADH,CAdF,CADF;AA2BD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport * as React from 'react';\nimport {Fragment, useCallback, useState} from 'react';\n\nexport function ListItem({item, removeItem, toggleItem}) {\n const handleDelete = useCallback(() => {\n removeItem(item);\n }, [item, removeItem]);\n\n const handleToggle = useCallback(() => {\n toggleItem(item);\n }, [item, toggleItem]);\n\n return (\n
  • \n \n \n
    • \n );\n}\n\nexport function List(props) {\n const [newItemText, setNewItemText] = useState('');\n const [items, setItems] = useState([\n {id: 1, isComplete: true, text: 'First'},\n {id: 2, isComplete: true, text: 'Second'},\n {id: 3, isComplete: false, text: 'Third'},\n ]);\n const [uid, setUID] = useState(4);\n\n const handleClick = useCallback(() => {\n if (newItemText !== '') {\n setItems([\n ...items,\n {\n id: uid,\n isComplete: false,\n text: newItemText,\n },\n ]);\n setUID(uid + 1);\n setNewItemText('');\n }\n }, [newItemText, items, uid]);\n\n const handleKeyPress = useCallback(\n event => {\n if (event.key === 'Enter') {\n handleClick();\n }\n },\n [handleClick],\n );\n\n const handleChange = useCallback(\n event => {\n setNewItemText(event.currentTarget.value);\n },\n [setNewItemText],\n );\n\n const removeItem = useCallback(\n itemToRemove => setItems(items.filter(item => item !== itemToRemove)),\n [items],\n );\n\n const toggleItem = useCallback(\n itemToToggle => {\n // Dont use indexOf()\n // because editing props in DevTools creates a new Object.\n const index = items.findIndex(item => item.id === itemToToggle.id);\n\n setItems(\n items\n .slice(0, index)\n .concat({\n ...itemToToggle,\n isComplete: !itemToToggle.isComplete,\n })\n .concat(items.slice(index + 1)),\n );\n },\n [items],\n );\n\n return (\n \n

    List

    \n \n \n
      \n {items.map(item => (\n \n ))}\n
    \n     \n );\n}\n"],"x_react_sources":[[{"names":["","handleDelete","handleToggle","newItemText","items","uid","handleClick","handleKeyPress","handleChange","removeItem","toggleItem"],"mappings":"CAAD;cuBCA;gBCDA;kBDEA;oBCFA;sCgBGA,AYHA;uCxBIA;2CxBJA;4CoBKA,AWLA;8CbMA;2DSNA;6DNOA;oEtBPA;sEoBQA;2EpBRA;6EkBSA;gFlBTA;kFkBUA;mGlBVA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js new file mode 100644 index 00000000000000..a0f706b19fbaff --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js @@ -0,0 +1,89 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +Object.defineProperty(exports, "ComponentUsingHooksIndirectly", { + enumerable: true, + get: function () { + return _ComponentUsingHooksIndirectly.Component; + } +}); +Object.defineProperty(exports, "ComponentWithCustomHook", { + enumerable: true, + get: function () { + return _ComponentWithCustomHook.Component; + } +}); +Object.defineProperty(exports, "ComponentWithExternalCustomHooks", { + enumerable: true, + get: function () { + return _ComponentWithExternalCustomHooks.Component; + } +}); +Object.defineProperty(exports, "ComponentWithMultipleHooksPerLine", { + enumerable: true, + get: function () { + return _ComponentWithMultipleHooksPerLine.Component; + } +}); +Object.defineProperty(exports, "ComponentWithNestedHooks", { + enumerable: true, + get: function () { + return _ComponentWithNestedHooks.Component; + } +}); +Object.defineProperty(exports, "ContainingStringSourceMappingURL", { + enumerable: true, + get: function () { + return _ContainingStringSourceMappingURL.Component; + } +}); +Object.defineProperty(exports, "Example", { + enumerable: true, + get: function () { + return _Example.Component; + } +}); +Object.defineProperty(exports, "InlineRequire", { + enumerable: true, + get: function () { + return _InlineRequire.Component; + } +}); +Object.defineProperty(exports, "useTheme", { + enumerable: true, + get: function () { + return _useTheme.default; + } +}); +exports.ToDoList = void 0; + +var _ComponentUsingHooksIndirectly = require("./ComponentUsingHooksIndirectly"); + +var _ComponentWithCustomHook = require("./ComponentWithCustomHook"); + +var _ComponentWithExternalCustomHooks = require("./ComponentWithExternalCustomHooks"); + +var _ComponentWithMultipleHooksPerLine = require("./ComponentWithMultipleHooksPerLine"); + +var _ComponentWithNestedHooks = require("./ComponentWithNestedHooks"); + +var _ContainingStringSourceMappingURL = require("./ContainingStringSourceMappingURL"); + +var _Example = require("./Example"); + +var _InlineRequire = require("./InlineRequire"); + +var ToDoList = _interopRequireWildcard(require("./ToDoList")); + +exports.ToDoList = ToDoList; + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } +//# sourceMappingURL=index.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js.map new file mode 100644 index 00000000000000..fe3a9c29b75278 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nexport {Component as ComponentUsingHooksIndirectly} from './ComponentUsingHooksIndirectly';\nexport {Component as ComponentWithCustomHook} from './ComponentWithCustomHook';\nexport {Component as ComponentWithExternalCustomHooks} from './ComponentWithExternalCustomHooks';\nexport {Component as ComponentWithMultipleHooksPerLine} from './ComponentWithMultipleHooksPerLine';\nexport {Component as ComponentWithNestedHooks} from './ComponentWithNestedHooks';\nexport {Component as ContainingStringSourceMappingURL} from './ContainingStringSourceMappingURL';\nexport {Component as Example} from './Example';\nexport {Component as InlineRequire} from './InlineRequire';\nimport * as ToDoList from './ToDoList';\nexport {ToDoList};\nexport {default as useTheme} from './useTheme';\n"],"x_react_sources":[[{"names":[""],"mappings":"CAAD"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js new file mode 100644 index 00000000000000..95bb454253ec31 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js @@ -0,0 +1,27 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = useTheme; +exports.ThemeContext = void 0; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const ThemeContext = /*#__PURE__*/(0, _react.createContext)('bright'); +exports.ThemeContext = ThemeContext; + +function useTheme() { + const theme = (0, _react.useContext)(ThemeContext); + (0, _react.useDebugValue)(theme); + return theme; +} +//# sourceMappingURL=useTheme.js.map \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js.map b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js.map new file mode 100644 index 00000000000000..bc7ae9fddd8aae --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["useTheme.js"],"names":["ThemeContext","useTheme","theme"],"mappings":";;;;;;;;AASA;;AATA;;;;;;;;AAWO,MAAMA,YAAY,gBAAG,0BAAc,QAAd,CAArB;;;AAEQ,SAASC,QAAT,GAAoB;AACjC,QAAMC,KAAK,GAAG,uBAAWF,YAAX,CAAd;AACA,4BAAcE,KAAd;AACA,SAAOA,KAAP;AACD","sourcesContent":["/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * @flow\n */\n\nimport {createContext, useContext, useDebugValue} from 'react';\n\nexport const ThemeContext = createContext('bright');\n\nexport default function useTheme() {\n const theme = useContext(ThemeContext);\n useDebugValue(theme);\n return theme;\n}\n"],"x_react_sources":[[{"names":["","theme"],"mappings":"CAAD;egBCA,AwBDA"}]]} \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentUsingHooksIndirectly.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentUsingHooksIndirectly.js new file mode 100644 index 00000000000000..ee19fdf9ba3d8b --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentUsingHooksIndirectly.js @@ -0,0 +1,45 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const countState = (0, _react.useState)(0); + const count = countState[0]; + const setCount = countState[1]; + const darkMode = useIsDarkMode(); + const [isDarkMode] = darkMode; + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const darkModeState = (0, _react.useState)(false); + const [isDarkMode] = darkModeState; + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return [isDarkMode, () => {}]; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5LmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50U3RhdGUiLCJjb3VudCIsInNldENvdW50IiwiZGFya01vZGUiLCJ1c2VJc0RhcmtNb2RlIiwiaXNEYXJrTW9kZSIsImhhbmRsZUNsaWNrIiwiZGFya01vZGVTdGF0ZSIsInVzZUVmZmVjdENyZWF0ZSJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQVNBOzs7Ozs7QUFUQTs7Ozs7Ozs7QUFXTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU1DLFVBQVUsR0FBRyxxQkFBUyxDQUFULENBQW5CO0FBQ0EsUUFBTUMsS0FBSyxHQUFHRCxVQUFVLENBQUMsQ0FBRCxDQUF4QjtBQUNBLFFBQU1FLFFBQVEsR0FBR0YsVUFBVSxDQUFDLENBQUQsQ0FBM0I7QUFFQSxRQUFNRyxRQUFRLEdBQUdDLGFBQWEsRUFBOUI7QUFDQSxRQUFNLENBQUNDLFVBQUQsSUFBZUYsUUFBckI7QUFFQSx3QkFBVSxNQUFNLENBQ2Q7QUFDRCxHQUZELEVBRUcsRUFGSDs7QUFJQSxRQUFNRyxXQUFXLEdBQUcsTUFBTUosUUFBUSxDQUFDRCxLQUFLLEdBQUcsQ0FBVCxDQUFsQzs7QUFFQSxzQkFDRSx5RUFDRSx5REFBaUJJLFVBQWpCLENBREYsZUFFRSxxREFBYUosS0FBYixDQUZGLGVBR0U7QUFBUSxJQUFBLE9BQU8sRUFBRUs7QUFBakIsb0JBSEYsQ0FERjtBQU9EOztBQUVELFNBQVNGLGFBQVQsR0FBeUI7QUFDdkIsUUFBTUcsYUFBYSxHQUFHLHFCQUFTLEtBQVQsQ0FBdEI7QUFDQSxRQUFNLENBQUNGLFVBQUQsSUFBZUUsYUFBckI7QUFFQSx3QkFBVSxTQUFTQyxlQUFULEdBQTJCLENBQ25DO0FBQ0QsR0FGRCxFQUVHLEVBRkg7QUFJQSxTQUFPLENBQUNILFVBQUQsRUFBYSxNQUFNLENBQUUsQ0FBckIsQ0FBUDtBQUNEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZUVmZmVjdCwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgY291bnRTdGF0ZSA9IHVzZVN0YXRlKDApO1xuICBjb25zdCBjb3VudCA9IGNvdW50U3RhdGVbMF07XG4gIGNvbnN0IHNldENvdW50ID0gY291bnRTdGF0ZVsxXTtcblxuICBjb25zdCBkYXJrTW9kZSA9IHVzZUlzRGFya01vZGUoKTtcbiAgY29uc3QgW2lzRGFya01vZGVdID0gZGFya01vZGU7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyAuLi5cbiAgfSwgW10pO1xuXG4gIGNvbnN0IGhhbmRsZUNsaWNrID0gKCkgPT4gc2V0Q291bnQoY291bnQgKyAxKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2PkRhcmsgbW9kZT8ge2lzRGFya01vZGV9PC9kaXY+XG4gICAgICA8ZGl2PkNvdW50OiB7Y291bnR9PC9kaXY+XG4gICAgICA8YnV0dG9uIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfT5VcGRhdGUgY291bnQ8L2J1dHRvbj5cbiAgICA8Lz5cbiAgKTtcbn1cblxuZnVuY3Rpb24gdXNlSXNEYXJrTW9kZSgpIHtcbiAgY29uc3QgZGFya01vZGVTdGF0ZSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW2lzRGFya01vZGVdID0gZGFya01vZGVTdGF0ZTtcblxuICB1c2VFZmZlY3QoZnVuY3Rpb24gdXNlRWZmZWN0Q3JlYXRlKCkge1xuICAgIC8vIEhlcmUgaXMgd2hlcmUgd2UgbWF5IGxpc3RlbiB0byBhIFwidGhlbWVcIiBldmVudC4uLlxuICB9LCBbXSk7XG5cbiAgcmV0dXJuIFtpc0RhcmtNb2RlLCAoKSA9PiB7fV07XG59XG4iXSwieF9mYl9zb3VyY2VzIjpbW251bGwseyJuYW1lcyI6WyI8bm8taG9vaz4iLCJjb3VudCIsImRhcmtNb2RlIiwiaXNEYXJrTW9kZSJdLCJtYXBwaW5ncyI6IkNBQUQ7YXFCQ0EsQVdEQTtpQmJFQSxBZUZBO29DVkdBLEFlSEEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithCustomHook.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithCustomHook.js new file mode 100644 index 00000000000000..ac7f10f99e8b0b --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithCustomHook.js @@ -0,0 +1,41 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + const isDarkMode = useIsDarkMode(); + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const [isDarkMode] = (0, _react.useState)(false); + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return isDarkMode; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhDdXN0b21Ib29rLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50Iiwic2V0Q291bnQiLCJpc0RhcmtNb2RlIiwidXNlSXNEYXJrTW9kZSIsImhhbmRsZUNsaWNrIiwidXNlRWZmZWN0Q3JlYXRlIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBU0E7Ozs7OztBQVRBOzs7Ozs7OztBQVdPLFNBQVNBLFNBQVQsR0FBcUI7QUFDMUIsUUFBTSxDQUFDQyxLQUFELEVBQVFDLFFBQVIsSUFBb0IscUJBQVMsQ0FBVCxDQUExQjtBQUNBLFFBQU1DLFVBQVUsR0FBR0MsYUFBYSxFQUFoQztBQUVBLHdCQUFVLE1BQU0sQ0FDZDtBQUNELEdBRkQsRUFFRyxFQUZIOztBQUlBLFFBQU1DLFdBQVcsR0FBRyxNQUFNSCxRQUFRLENBQUNELEtBQUssR0FBRyxDQUFULENBQWxDOztBQUVBLHNCQUNFLHlFQUNFLHlEQUFpQkUsVUFBakIsQ0FERixlQUVFLHFEQUFhRixLQUFiLENBRkYsZUFHRTtBQUFRLElBQUEsT0FBTyxFQUFFSTtBQUFqQixvQkFIRixDQURGO0FBT0Q7O0FBRUQsU0FBU0QsYUFBVCxHQUF5QjtBQUN2QixRQUFNLENBQUNELFVBQUQsSUFBZSxxQkFBUyxLQUFULENBQXJCO0FBRUEsd0JBQVUsU0FBU0csZUFBVCxHQUEyQixDQUNuQztBQUNELEdBRkQsRUFFRyxFQUZIO0FBSUEsU0FBT0gsVUFBUDtBQUNEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZUVmZmVjdCwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgW2NvdW50LCBzZXRDb3VudF0gPSB1c2VTdGF0ZSgwKTtcbiAgY29uc3QgaXNEYXJrTW9kZSA9IHVzZUlzRGFya01vZGUoKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIC8vIC4uLlxuICB9LCBbXSk7XG5cbiAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoKSA9PiBzZXRDb3VudChjb3VudCArIDEpO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxkaXY+RGFyayBtb2RlPyB7aXNEYXJrTW9kZX08L2Rpdj5cbiAgICAgIDxkaXY+Q291bnQ6IHtjb3VudH08L2Rpdj5cbiAgICAgIDxidXR0b24gb25DbGljaz17aGFuZGxlQ2xpY2t9PlVwZGF0ZSBjb3VudDwvYnV0dG9uPlxuICAgIDwvPlxuICApO1xufVxuXG5mdW5jdGlvbiB1c2VJc0RhcmtNb2RlKCkge1xuICBjb25zdCBbaXNEYXJrTW9kZV0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgdXNlRWZmZWN0KGZ1bmN0aW9uIHVzZUVmZmVjdENyZWF0ZSgpIHtcbiAgICAvLyBIZXJlIGlzIHdoZXJlIHdlIG1heSBsaXN0ZW4gdG8gYSBcInRoZW1lXCIgZXZlbnQuLi5cbiAgfSwgW10pO1xuXG4gIHJldHVybiBpc0RhcmtNb2RlO1xufVxuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+IiwiY291bnQiLCJpc0RhcmtNb2RlIl0sIm1hcHBpbmdzIjoiQ0FBRDthNEJDQSxBV0RBO2NsQkVBLEFlRkE7Z0NiRUEsQWVGQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithExternalCustomHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithExternalCustomHooks.js new file mode 100644 index 00000000000000..a88a83c4078fce --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithExternalCustomHooks.js @@ -0,0 +1,26 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireDefault(require("react")); + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const theme = (0, _useTheme.default)(); + return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsInRoZW1lIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBU0E7O0FBQ0E7Ozs7QUFWQTs7Ozs7Ozs7QUFZTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU1DLEtBQUssR0FBRyx3QkFBZDtBQUVBLHNCQUFPLHFEQUFhQSxLQUFiLENBQVA7QUFDRCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSBGYWNlYm9vaywgSW5jLiBhbmQgaXRzIGFmZmlsaWF0ZXMuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgTUlUIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICogQGZsb3dcbiAqL1xuXG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHVzZVRoZW1lIGZyb20gJy4vdXNlVGhlbWUnO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29tcG9uZW50KCkge1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG5cbiAgcmV0dXJuIDxkaXY+dGhlbWU6IHt0aGVtZX08L2Rpdj47XG59XG4iXSwieF9mYl9zb3VyY2VzIjpbW251bGwseyJuYW1lcyI6WyI8bm8taG9vaz4iLCJ0aGVtZSJdLCJtYXBwaW5ncyI6IkNBQUQ7Y2dCQ0EsQVVEQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithMultipleHooksPerLine.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithMultipleHooksPerLine.js new file mode 100644 index 00000000000000..747e2ccd42b73f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithMultipleHooksPerLine.js @@ -0,0 +1,30 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const A = /*#__PURE__*/(0, _react.createContext)(1); +const B = /*#__PURE__*/(0, _react.createContext)(2); + +function Component() { + const a = (0, _react.useContext)(A); + const b = (0, _react.useContext)(B); // prettier-ignore + + const c = (0, _react.useContext)(A), + d = (0, _react.useContext)(B); // eslint-disable-line one-var + + return a + b + c + d; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhNdWx0aXBsZUhvb2tzUGVyTGluZS5qcyJdLCJuYW1lcyI6WyJBIiwiQiIsIkNvbXBvbmVudCIsImEiLCJiIiwiYyIsImQiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFTQTs7QUFUQTs7Ozs7Ozs7QUFXQSxNQUFNQSxDQUFDLGdCQUFHLDBCQUFjLENBQWQsQ0FBVjtBQUNBLE1BQU1DLENBQUMsZ0JBQUcsMEJBQWMsQ0FBZCxDQUFWOztBQUVPLFNBQVNDLFNBQVQsR0FBcUI7QUFDMUIsUUFBTUMsQ0FBQyxHQUFHLHVCQUFXSCxDQUFYLENBQVY7QUFDQSxRQUFNSSxDQUFDLEdBQUcsdUJBQVdILENBQVgsQ0FBVixDQUYwQixDQUkxQjs7QUFDQSxRQUFNSSxDQUFDLEdBQUcsdUJBQVdMLENBQVgsQ0FBVjtBQUFBLFFBQXlCTSxDQUFDLEdBQUcsdUJBQVdMLENBQVgsQ0FBN0IsQ0FMMEIsQ0FLa0I7O0FBRTVDLFNBQU9FLENBQUMsR0FBR0MsQ0FBSixHQUFRQyxDQUFSLEdBQVlDLENBQW5CO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuaW1wb3J0IHtjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0fSBmcm9tICdyZWFjdCc7XG5cbmNvbnN0IEEgPSBjcmVhdGVDb250ZXh0KDEpO1xuY29uc3QgQiA9IGNyZWF0ZUNvbnRleHQoMik7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb21wb25lbnQoKSB7XG4gIGNvbnN0IGEgPSB1c2VDb250ZXh0KEEpO1xuICBjb25zdCBiID0gdXNlQ29udGV4dChCKTtcblxuICAvLyBwcmV0dGllci1pZ25vcmVcbiAgY29uc3QgYyA9IHVzZUNvbnRleHQoQSksIGQgPSB1c2VDb250ZXh0KEIpOyAvLyBlc2xpbnQtZGlzYWJsZS1saW5lIG9uZS12YXJcblxuICByZXR1cm4gYSArIGIgKyBjICsgZDtcbn1cbiJdLCJ4X2ZiX3NvdXJjZXMiOltbbnVsbCx7Im5hbWVzIjpbIjxuby1ob29rPiIsImEiLCJiIiwiYyIsImQiXSwibWFwcGluZ3MiOiJDQUFEO2dCWUNBLEFhREE7aUJiRUEsQWFGQTtvQmJHQSxBYUhBLEFNSUEsQWFKQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithNestedHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithNestedHooks.js new file mode 100644 index 00000000000000..c7736181d435bb --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ComponentWithNestedHooks.js @@ -0,0 +1,28 @@ +"use strict"; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const { + useMemo, + useState +} = require('react'); + +function Component(props) { + const InnerComponent = useMemo(() => () => { + const [state] = useState(0); + return state; + }); + props.callback(InnerComponent); + return null; +} + +module.exports = { + Component +}; +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhOZXN0ZWRIb29rcy5qcyJdLCJuYW1lcyI6WyJ1c2VNZW1vIiwidXNlU3RhdGUiLCJyZXF1aXJlIiwiQ29tcG9uZW50IiwicHJvcHMiLCJJbm5lckNvbXBvbmVudCIsInN0YXRlIiwiY2FsbGJhY2siLCJtb2R1bGUiLCJleHBvcnRzIl0sIm1hcHBpbmdzIjoiOztBQUFBOzs7Ozs7OztBQVFBLE1BQU07QUFBQ0EsRUFBQUEsT0FBRDtBQUFVQyxFQUFBQTtBQUFWLElBQXNCQyxPQUFPLENBQUMsT0FBRCxDQUFuQzs7QUFFQSxTQUFTQyxTQUFULENBQW1CQyxLQUFuQixFQUEwQjtBQUN4QixRQUFNQyxjQUFjLEdBQUdMLE9BQU8sQ0FBQyxNQUFNLE1BQU07QUFDekMsVUFBTSxDQUFDTSxLQUFELElBQVVMLFFBQVEsQ0FBQyxDQUFELENBQXhCO0FBRUEsV0FBT0ssS0FBUDtBQUNELEdBSjZCLENBQTlCO0FBS0FGLEVBQUFBLEtBQUssQ0FBQ0csUUFBTixDQUFlRixjQUFmO0FBRUEsU0FBTyxJQUFQO0FBQ0Q7O0FBRURHLE1BQU0sQ0FBQ0MsT0FBUCxHQUFpQjtBQUFDTixFQUFBQTtBQUFELENBQWpCIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5jb25zdCB7dXNlTWVtbywgdXNlU3RhdGV9ID0gcmVxdWlyZSgncmVhY3QnKTtcblxuZnVuY3Rpb24gQ29tcG9uZW50KHByb3BzKSB7XG4gIGNvbnN0IElubmVyQ29tcG9uZW50ID0gdXNlTWVtbygoKSA9PiAoKSA9PiB7XG4gICAgY29uc3QgW3N0YXRlXSA9IHVzZVN0YXRlKDApO1xuXG4gICAgcmV0dXJuIHN0YXRlO1xuICB9KTtcbiAgcHJvcHMuY2FsbGJhY2soSW5uZXJDb21wb25lbnQpO1xuXG4gIHJldHVybiBudWxsO1xufVxuXG5tb2R1bGUuZXhwb3J0cyA9IHtDb21wb25lbnR9O1xuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+IiwiSW5uZXJDb21wb25lbnQiLCJzdGF0ZSJdLCJtYXBwaW5ncyI6IkNBQUQ7WXlCQ0E7YUxDQSxBV0RBO2dCM0JEQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ContainingStringSourceMappingURL.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ContainingStringSourceMappingURL.js new file mode 100644 index 00000000000000..d5520ecc3230d9 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ContainingStringSourceMappingURL.js @@ -0,0 +1,29 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +// ?sourceMappingURL=([^\s'"]+)/gm +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbnRhaW5pbmdTdHJpbmdTb3VyY2VNYXBwaW5nVVJMLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50Iiwic2V0Q291bnQiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFTQTs7Ozs7O0FBVEE7Ozs7Ozs7O0FBV0E7QUFFTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLHFCQUFTLENBQVQsQ0FBMUI7QUFFQSxzQkFDRSx1REFDRSx3REFBZ0JELEtBQWhCLFdBREYsZUFFRTtBQUFRLElBQUEsT0FBTyxFQUFFLE1BQU1DLFFBQVEsQ0FBQ0QsS0FBSyxHQUFHLENBQVQ7QUFBL0IsZ0JBRkYsQ0FERjtBQU1EIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5cbi8vID9zb3VyY2VNYXBwaW5nVVJMPShbXlxccydcIl0rKS9nbVxuXG5leHBvcnQgZnVuY3Rpb24gQ29tcG9uZW50KCkge1xuICBjb25zdCBbY291bnQsIHNldENvdW50XSA9IHVzZVN0YXRlKDApO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdj5cbiAgICAgIDxwPllvdSBjbGlja2VkIHtjb3VudH0gdGltZXM8L3A+XG4gICAgICA8YnV0dG9uIG9uQ2xpY2s9eygpID0+IHNldENvdW50KGNvdW50ICsgMSl9PkNsaWNrIG1lPC9idXR0b24+XG4gICAgPC9kaXY+XG4gICk7XG59XG4iXSwieF9mYl9zb3VyY2VzIjpbW251bGwseyJuYW1lcyI6WyI8bm8taG9vaz4iLCJjb3VudCJdLCJtYXBwaW5ncyI6IkNBQUQ7ZTRCQ0EsQVdEQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/Example.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/Example.js new file mode 100644 index 00000000000000..583fd413e41fda --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/Example.js @@ -0,0 +1,28 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkV4YW1wbGUuanMiXSwibmFtZXMiOlsiQ29tcG9uZW50IiwiY291bnQiLCJzZXRDb3VudCJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQVNBOzs7Ozs7QUFUQTs7Ozs7Ozs7QUFXTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLHFCQUFTLENBQVQsQ0FBMUI7QUFFQSxzQkFDRSx1REFDRSx3REFBZ0JELEtBQWhCLFdBREYsZUFFRTtBQUFRLElBQUEsT0FBTyxFQUFFLE1BQU1DLFFBQVEsQ0FBQ0QsS0FBSyxHQUFHLENBQVQ7QUFBL0IsZ0JBRkYsQ0FERjtBQU1EIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb21wb25lbnQoKSB7XG4gIGNvbnN0IFtjb3VudCwgc2V0Q291bnRdID0gdXNlU3RhdGUoMCk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2PlxuICAgICAgPHA+WW91IGNsaWNrZWQge2NvdW50fSB0aW1lczwvcD5cbiAgICAgIDxidXR0b24gb25DbGljaz17KCkgPT4gc2V0Q291bnQoY291bnQgKyAxKX0+Q2xpY2sgbWU8L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdLCJ4X2ZiX3NvdXJjZXMiOltbbnVsbCx7Im5hbWVzIjpbIjxuby1ob29rPiIsImNvdW50Il0sIm1hcHBpbmdzIjoiQ0FBRDthNEJDQSxBV0RBIn1dXX0= \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/InlineRequire.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/InlineRequire.js new file mode 100644 index 00000000000000..e95e996016dd4c --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/InlineRequire.js @@ -0,0 +1,21 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count] = require('react').useState(0); + + return count; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIklubGluZVJlcXVpcmUuanMiXSwibmFtZXMiOlsiQ29tcG9uZW50IiwiY291bnQiLCJyZXF1aXJlIiwidXNlU3RhdGUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFBQTs7Ozs7Ozs7QUFTTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxJQUFVQyxPQUFPLENBQUMsT0FBRCxDQUFQLENBQWlCQyxRQUFqQixDQUEwQixDQUExQixDQUFoQjs7QUFFQSxTQUFPRixLQUFQO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgW2NvdW50XSA9IHJlcXVpcmUoJ3JlYWN0JykudXNlU3RhdGUoMCk7XG5cbiAgcmV0dXJuIGNvdW50O1xufVxuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+Il0sIm1hcHBpbmdzIjoiQ0FBRCJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ToDoList.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ToDoList.js new file mode 100644 index 00000000000000..35f3c827f402d5 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/ToDoList.js @@ -0,0 +1,106 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.ListItem = ListItem; +exports.List = List; + +var React = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function ListItem({ + item, + removeItem, + toggleItem +}) { + const handleDelete = (0, React.useCallback)(() => { + removeItem(item); + }, [item, removeItem]); + const handleToggle = (0, React.useCallback)(() => { + toggleItem(item); + }, [item, toggleItem]); + return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("button", { + onClick: handleDelete + }, "Delete"), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", { + checked: item.isComplete, + onChange: handleToggle, + type: "checkbox" + }), ' ', item.text)); +} + +function List(props) { + const [newItemText, setNewItemText] = (0, React.useState)(''); + const [items, setItems] = (0, React.useState)([{ + id: 1, + isComplete: true, + text: 'First' + }, { + id: 2, + isComplete: true, + text: 'Second' + }, { + id: 3, + isComplete: false, + text: 'Third' + }]); + const [uid, setUID] = (0, React.useState)(4); + const handleClick = (0, React.useCallback)(() => { + if (newItemText !== '') { + setItems([...items, { + id: uid, + isComplete: false, + text: newItemText + }]); + setUID(uid + 1); + setNewItemText(''); + } + }, [newItemText, items, uid]); + const handleKeyPress = (0, React.useCallback)(event => { + if (event.key === 'Enter') { + handleClick(); + } + }, [handleClick]); + const handleChange = (0, React.useCallback)(event => { + setNewItemText(event.currentTarget.value); + }, [setNewItemText]); + const removeItem = (0, React.useCallback)(itemToRemove => setItems(items.filter(item => item !== itemToRemove)), [items]); + const toggleItem = (0, React.useCallback)(itemToToggle => { + // Dont use indexOf() + // because editing props in DevTools creates a new Object. + const index = items.findIndex(item => item.id === itemToToggle.id); + setItems(items.slice(0, index).concat({ ...itemToToggle, + isComplete: !itemToToggle.isComplete + }).concat(items.slice(index + 1))); + }, [items]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "List"), /*#__PURE__*/React.createElement("input", { + type: "text", + placeholder: "New list item...", + value: newItemText, + onChange: handleChange, + onKeyPress: handleKeyPress + }), /*#__PURE__*/React.createElement("button", { + disabled: newItemText === '', + onClick: handleClick + }, /*#__PURE__*/React.createElement("span", { + role: "img", + "aria-label": "Add item" + }, "Add")), /*#__PURE__*/React.createElement("ul", null, items.map(item => /*#__PURE__*/React.createElement(ListItem, { + key: item.id, + item: item, + removeItem: removeItem, + toggleItem: toggleItem + })))); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvRG9MaXN0LmpzIl0sIm5hbWVzIjpbIkxpc3RJdGVtIiwiaXRlbSIsInJlbW92ZUl0ZW0iLCJ0b2dnbGVJdGVtIiwiaGFuZGxlRGVsZXRlIiwiaGFuZGxlVG9nZ2xlIiwiaXNDb21wbGV0ZSIsInRleHQiLCJMaXN0IiwicHJvcHMiLCJuZXdJdGVtVGV4dCIsInNldE5ld0l0ZW1UZXh0IiwiaXRlbXMiLCJzZXRJdGVtcyIsImlkIiwidWlkIiwic2V0VUlEIiwiaGFuZGxlQ2xpY2siLCJoYW5kbGVLZXlQcmVzcyIsImV2ZW50Iiwia2V5IiwiaGFuZGxlQ2hhbmdlIiwiY3VycmVudFRhcmdldCIsInZhbHVlIiwiaXRlbVRvUmVtb3ZlIiwiZmlsdGVyIiwiaXRlbVRvVG9nZ2xlIiwiaW5kZXgiLCJmaW5kSW5kZXgiLCJzbGljZSIsImNvbmNhdCIsIm1hcCJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7QUFTQTs7Ozs7O0FBVEE7Ozs7Ozs7O0FBWU8sU0FBU0EsUUFBVCxDQUFrQjtBQUFDQyxFQUFBQSxJQUFEO0FBQU9DLEVBQUFBLFVBQVA7QUFBbUJDLEVBQUFBO0FBQW5CLENBQWxCLEVBQWtEO0FBQ3ZELFFBQU1DLFlBQVksR0FBRyx1QkFBWSxNQUFNO0FBQ3JDRixJQUFBQSxVQUFVLENBQUNELElBQUQsQ0FBVjtBQUNELEdBRm9CLEVBRWxCLENBQUNBLElBQUQsRUFBT0MsVUFBUCxDQUZrQixDQUFyQjtBQUlBLFFBQU1HLFlBQVksR0FBRyx1QkFBWSxNQUFNO0FBQ3JDRixJQUFBQSxVQUFVLENBQUNGLElBQUQsQ0FBVjtBQUNELEdBRm9CLEVBRWxCLENBQUNBLElBQUQsRUFBT0UsVUFBUCxDQUZrQixDQUFyQjtBQUlBLHNCQUNFLDZDQUNFO0FBQVEsSUFBQSxPQUFPLEVBQUVDO0FBQWpCLGNBREYsZUFFRSxnREFDRTtBQUNFLElBQUEsT0FBTyxFQUFFSCxJQUFJLENBQUNLLFVBRGhCO0FBRUUsSUFBQSxRQUFRLEVBQUVELFlBRlo7QUFHRSxJQUFBLElBQUksRUFBQztBQUhQLElBREYsRUFLSyxHQUxMLEVBTUdKLElBQUksQ0FBQ00sSUFOUixDQUZGLENBREY7QUFhRDs7QUFFTSxTQUFTQyxJQUFULENBQWNDLEtBQWQsRUFBcUI7QUFDMUIsUUFBTSxDQUFDQyxXQUFELEVBQWNDLGNBQWQsSUFBZ0Msb0JBQVMsRUFBVCxDQUF0QztBQUNBLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLG9CQUFTLENBQ2pDO0FBQUNDLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxJQUFwQjtBQUEwQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWhDLEdBRGlDLEVBRWpDO0FBQUNPLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxJQUFwQjtBQUEwQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWhDLEdBRmlDLEVBR2pDO0FBQUNPLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxLQUFwQjtBQUEyQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWpDLEdBSGlDLENBQVQsQ0FBMUI7QUFLQSxRQUFNLENBQUNRLEdBQUQsRUFBTUMsTUFBTixJQUFnQixvQkFBUyxDQUFULENBQXRCO0FBRUEsUUFBTUMsV0FBVyxHQUFHLHVCQUFZLE1BQU07QUFDcEMsUUFBSVAsV0FBVyxLQUFLLEVBQXBCLEVBQXdCO0FBQ3RCRyxNQUFBQSxRQUFRLENBQUMsQ0FDUCxHQUFHRCxLQURJLEVBRVA7QUFDRUUsUUFBQUEsRUFBRSxFQUFFQyxHQUROO0FBRUVULFFBQUFBLFVBQVUsRUFBRSxLQUZkO0FBR0VDLFFBQUFBLElBQUksRUFBRUc7QUFIUixPQUZPLENBQUQsQ0FBUjtBQVFBTSxNQUFBQSxNQUFNLENBQUNELEdBQUcsR0FBRyxDQUFQLENBQU47QUFDQUosTUFBQUEsY0FBYyxDQUFDLEVBQUQsQ0FBZDtBQUNEO0FBQ0YsR0FibUIsRUFhakIsQ0FBQ0QsV0FBRCxFQUFjRSxLQUFkLEVBQXFCRyxHQUFyQixDQWJpQixDQUFwQjtBQWVBLFFBQU1HLGNBQWMsR0FBRyx1QkFDckJDLEtBQUssSUFBSTtBQUNQLFFBQUlBLEtBQUssQ0FBQ0MsR0FBTixLQUFjLE9BQWxCLEVBQTJCO0FBQ3pCSCxNQUFBQSxXQUFXO0FBQ1o7QUFDRixHQUxvQixFQU1yQixDQUFDQSxXQUFELENBTnFCLENBQXZCO0FBU0EsUUFBTUksWUFBWSxHQUFHLHVCQUNuQkYsS0FBSyxJQUFJO0FBQ1BSLElBQUFBLGNBQWMsQ0FBQ1EsS0FBSyxDQUFDRyxhQUFOLENBQW9CQyxLQUFyQixDQUFkO0FBQ0QsR0FIa0IsRUFJbkIsQ0FBQ1osY0FBRCxDQUptQixDQUFyQjtBQU9BLFFBQU1ULFVBQVUsR0FBRyx1QkFDakJzQixZQUFZLElBQUlYLFFBQVEsQ0FBQ0QsS0FBSyxDQUFDYSxNQUFOLENBQWF4QixJQUFJLElBQUlBLElBQUksS0FBS3VCLFlBQTlCLENBQUQsQ0FEUCxFQUVqQixDQUFDWixLQUFELENBRmlCLENBQW5CO0FBS0EsUUFBTVQsVUFBVSxHQUFHLHVCQUNqQnVCLFlBQVksSUFBSTtBQUNkO0FBQ0E7QUFDQSxVQUFNQyxLQUFLLEdBQUdmLEtBQUssQ0FBQ2dCLFNBQU4sQ0FBZ0IzQixJQUFJLElBQUlBLElBQUksQ0FBQ2EsRUFBTCxLQUFZWSxZQUFZLENBQUNaLEVBQWpELENBQWQ7QUFFQUQsSUFBQUEsUUFBUSxDQUNORCxLQUFLLENBQ0ZpQixLQURILENBQ1MsQ0FEVCxFQUNZRixLQURaLEVBRUdHLE1BRkgsQ0FFVSxFQUNOLEdBQUdKLFlBREc7QUFFTnBCLE1BQUFBLFVBQVUsRUFBRSxDQUFDb0IsWUFBWSxDQUFDcEI7QUFGcEIsS0FGVixFQU1Hd0IsTUFOSCxDQU1VbEIsS0FBSyxDQUFDaUIsS0FBTixDQUFZRixLQUFLLEdBQUcsQ0FBcEIsQ0FOVixDQURNLENBQVI7QUFTRCxHQWZnQixFQWdCakIsQ0FBQ2YsS0FBRCxDQWhCaUIsQ0FBbkI7QUFtQkEsc0JBQ0Usb0JBQUMsY0FBRCxxQkFDRSx1Q0FERixlQUVFO0FBQ0UsSUFBQSxJQUFJLEVBQUMsTUFEUDtBQUVFLElBQUEsV0FBVyxFQUFDLGtCQUZkO0FBR0UsSUFBQSxLQUFLLEVBQUVGLFdBSFQ7QUFJRSxJQUFBLFFBQVEsRUFBRVcsWUFKWjtBQUtFLElBQUEsVUFBVSxFQUFFSDtBQUxkLElBRkYsZUFTRTtBQUFRLElBQUEsUUFBUSxFQUFFUixXQUFXLEtBQUssRUFBbEM7QUFBc0MsSUFBQSxPQUFPLEVBQUVPO0FBQS9DLGtCQUNFO0FBQU0sSUFBQSxJQUFJLEVBQUMsS0FBWDtBQUFpQixrQkFBVztBQUE1QixXQURGLENBVEYsZUFjRSxnQ0FDR0wsS0FBSyxDQUFDbUIsR0FBTixDQUFVOUIsSUFBSSxpQkFDYixvQkFBQyxRQUFEO0FBQ0UsSUFBQSxHQUFHLEVBQUVBLElBQUksQ0FBQ2EsRUFEWjtBQUVFLElBQUEsSUFBSSxFQUFFYixJQUZSO0FBR0UsSUFBQSxVQUFVLEVBQUVDLFVBSGQ7QUFJRSxJQUFBLFVBQVUsRUFBRUM7QUFKZCxJQURELENBREgsQ0FkRixDQURGO0FBMkJEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7RnJhZ21lbnQsIHVzZUNhbGxiYWNrLCB1c2VTdGF0ZX0gZnJvbSAncmVhY3QnO1xuXG5leHBvcnQgZnVuY3Rpb24gTGlzdEl0ZW0oe2l0ZW0sIHJlbW92ZUl0ZW0sIHRvZ2dsZUl0ZW19KSB7XG4gIGNvbnN0IGhhbmRsZURlbGV0ZSA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICByZW1vdmVJdGVtKGl0ZW0pO1xuICB9LCBbaXRlbSwgcmVtb3ZlSXRlbV0pO1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZSA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICB0b2dnbGVJdGVtKGl0ZW0pO1xuICB9LCBbaXRlbSwgdG9nZ2xlSXRlbV0pO1xuXG4gIHJldHVybiAoXG4gICAgPGxpPlxuICAgICAgPGJ1dHRvbiBvbkNsaWNrPXtoYW5kbGVEZWxldGV9PkRlbGV0ZTwvYnV0dG9uPlxuICAgICAgPGxhYmVsPlxuICAgICAgICA8aW5wdXRcbiAgICAgICAgICBjaGVja2VkPXtpdGVtLmlzQ29tcGxldGV9XG4gICAgICAgICAgb25DaGFuZ2U9e2hhbmRsZVRvZ2dsZX1cbiAgICAgICAgICB0eXBlPVwiY2hlY2tib3hcIlxuICAgICAgICAvPnsnICd9XG4gICAgICAgIHtpdGVtLnRleHR9XG4gICAgICA8L2xhYmVsPlxuICAgIDwvbGk+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBMaXN0KHByb3BzKSB7XG4gIGNvbnN0IFtuZXdJdGVtVGV4dCwgc2V0TmV3SXRlbVRleHRdID0gdXNlU3RhdGUoJycpO1xuICBjb25zdCBbaXRlbXMsIHNldEl0ZW1zXSA9IHVzZVN0YXRlKFtcbiAgICB7aWQ6IDEsIGlzQ29tcGxldGU6IHRydWUsIHRleHQ6ICdGaXJzdCd9LFxuICAgIHtpZDogMiwgaXNDb21wbGV0ZTogdHJ1ZSwgdGV4dDogJ1NlY29uZCd9LFxuICAgIHtpZDogMywgaXNDb21wbGV0ZTogZmFsc2UsIHRleHQ6ICdUaGlyZCd9LFxuICBdKTtcbiAgY29uc3QgW3VpZCwgc2V0VUlEXSA9IHVzZVN0YXRlKDQpO1xuXG4gIGNvbnN0IGhhbmRsZUNsaWNrID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIGlmIChuZXdJdGVtVGV4dCAhPT0gJycpIHtcbiAgICAgIHNldEl0ZW1zKFtcbiAgICAgICAgLi4uaXRlbXMsXG4gICAgICAgIHtcbiAgICAgICAgICBpZDogdWlkLFxuICAgICAgICAgIGlzQ29tcGxldGU6IGZhbHNlLFxuICAgICAgICAgIHRleHQ6IG5ld0l0ZW1UZXh0LFxuICAgICAgICB9LFxuICAgICAgXSk7XG4gICAgICBzZXRVSUQodWlkICsgMSk7XG4gICAgICBzZXROZXdJdGVtVGV4dCgnJyk7XG4gICAgfVxuICB9LCBbbmV3SXRlbVRleHQsIGl0ZW1zLCB1aWRdKTtcblxuICBjb25zdCBoYW5kbGVLZXlQcmVzcyA9IHVzZUNhbGxiYWNrKFxuICAgIGV2ZW50ID0+IHtcbiAgICAgIGlmIChldmVudC5rZXkgPT09ICdFbnRlcicpIHtcbiAgICAgICAgaGFuZGxlQ2xpY2soKTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtoYW5kbGVDbGlja10sXG4gICk7XG5cbiAgY29uc3QgaGFuZGxlQ2hhbmdlID0gdXNlQ2FsbGJhY2soXG4gICAgZXZlbnQgPT4ge1xuICAgICAgc2V0TmV3SXRlbVRleHQoZXZlbnQuY3VycmVudFRhcmdldC52YWx1ZSk7XG4gICAgfSxcbiAgICBbc2V0TmV3SXRlbVRleHRdLFxuICApO1xuXG4gIGNvbnN0IHJlbW92ZUl0ZW0gPSB1c2VDYWxsYmFjayhcbiAgICBpdGVtVG9SZW1vdmUgPT4gc2V0SXRlbXMoaXRlbXMuZmlsdGVyKGl0ZW0gPT4gaXRlbSAhPT0gaXRlbVRvUmVtb3ZlKSksXG4gICAgW2l0ZW1zXSxcbiAgKTtcblxuICBjb25zdCB0b2dnbGVJdGVtID0gdXNlQ2FsbGJhY2soXG4gICAgaXRlbVRvVG9nZ2xlID0+IHtcbiAgICAgIC8vIERvbnQgdXNlIGluZGV4T2YoKVxuICAgICAgLy8gYmVjYXVzZSBlZGl0aW5nIHByb3BzIGluIERldlRvb2xzIGNyZWF0ZXMgYSBuZXcgT2JqZWN0LlxuICAgICAgY29uc3QgaW5kZXggPSBpdGVtcy5maW5kSW5kZXgoaXRlbSA9PiBpdGVtLmlkID09PSBpdGVtVG9Ub2dnbGUuaWQpO1xuXG4gICAgICBzZXRJdGVtcyhcbiAgICAgICAgaXRlbXNcbiAgICAgICAgICAuc2xpY2UoMCwgaW5kZXgpXG4gICAgICAgICAgLmNvbmNhdCh7XG4gICAgICAgICAgICAuLi5pdGVtVG9Ub2dnbGUsXG4gICAgICAgICAgICBpc0NvbXBsZXRlOiAhaXRlbVRvVG9nZ2xlLmlzQ29tcGxldGUsXG4gICAgICAgICAgfSlcbiAgICAgICAgICAuY29uY2F0KGl0ZW1zLnNsaWNlKGluZGV4ICsgMSkpLFxuICAgICAgKTtcbiAgICB9LFxuICAgIFtpdGVtc10sXG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8RnJhZ21lbnQ+XG4gICAgICA8aDE+TGlzdDwvaDE+XG4gICAgICA8aW5wdXRcbiAgICAgICAgdHlwZT1cInRleHRcIlxuICAgICAgICBwbGFjZWhvbGRlcj1cIk5ldyBsaXN0IGl0ZW0uLi5cIlxuICAgICAgICB2YWx1ZT17bmV3SXRlbVRleHR9XG4gICAgICAgIG9uQ2hhbmdlPXtoYW5kbGVDaGFuZ2V9XG4gICAgICAgIG9uS2V5UHJlc3M9e2hhbmRsZUtleVByZXNzfVxuICAgICAgLz5cbiAgICAgIDxidXR0b24gZGlzYWJsZWQ9e25ld0l0ZW1UZXh0ID09PSAnJ30gb25DbGljaz17aGFuZGxlQ2xpY2t9PlxuICAgICAgICA8c3BhbiByb2xlPVwiaW1nXCIgYXJpYS1sYWJlbD1cIkFkZCBpdGVtXCI+XG4gICAgICAgICAgQWRkXG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvYnV0dG9uPlxuICAgICAgPHVsPlxuICAgICAgICB7aXRlbXMubWFwKGl0ZW0gPT4gKFxuICAgICAgICAgIDxMaXN0SXRlbVxuICAgICAgICAgICAga2V5PXtpdGVtLmlkfVxuICAgICAgICAgICAgaXRlbT17aXRlbX1cbiAgICAgICAgICAgIHJlbW92ZUl0ZW09e3JlbW92ZUl0ZW19XG4gICAgICAgICAgICB0b2dnbGVJdGVtPXt0b2dnbGVJdGVtfVxuICAgICAgICAgIC8+XG4gICAgICAgICkpfVxuICAgICAgPC91bD5cbiAgICA8L0ZyYWdtZW50PlxuICApO1xufVxuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+IiwiaGFuZGxlRGVsZXRlIiwiaGFuZGxlVG9nZ2xlIiwibmV3SXRlbVRleHQiLCJpdGVtcyIsInVpZCIsImhhbmRsZUNsaWNrIiwiaGFuZGxlS2V5UHJlc3MiLCJoYW5kbGVDaGFuZ2UiLCJyZW1vdmVJdGVtIiwidG9nZ2xlSXRlbSJdLCJtYXBwaW5ncyI6IkNBQUQ7Y3VCQ0E7Z0JDREE7a0JERUE7b0JDRkE7c0NnQkdBLEFZSEE7dUN4QklBOzJDeEJKQTs0Q29CS0EsQVdMQTs4Q2JNQTsyRFNOQTs2RE5PQTtvRXRCUEE7c0VvQlFBOzJFcEJSQTs2RWtCU0E7Z0ZsQlRBO2tGa0JVQTttR2xCVkEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/index.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/index.js new file mode 100644 index 00000000000000..671a6e4bfdf813 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/index.js @@ -0,0 +1,89 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +Object.defineProperty(exports, "ComponentUsingHooksIndirectly", { + enumerable: true, + get: function () { + return _ComponentUsingHooksIndirectly.Component; + } +}); +Object.defineProperty(exports, "ComponentWithCustomHook", { + enumerable: true, + get: function () { + return _ComponentWithCustomHook.Component; + } +}); +Object.defineProperty(exports, "ComponentWithExternalCustomHooks", { + enumerable: true, + get: function () { + return _ComponentWithExternalCustomHooks.Component; + } +}); +Object.defineProperty(exports, "ComponentWithMultipleHooksPerLine", { + enumerable: true, + get: function () { + return _ComponentWithMultipleHooksPerLine.Component; + } +}); +Object.defineProperty(exports, "ComponentWithNestedHooks", { + enumerable: true, + get: function () { + return _ComponentWithNestedHooks.Component; + } +}); +Object.defineProperty(exports, "ContainingStringSourceMappingURL", { + enumerable: true, + get: function () { + return _ContainingStringSourceMappingURL.Component; + } +}); +Object.defineProperty(exports, "Example", { + enumerable: true, + get: function () { + return _Example.Component; + } +}); +Object.defineProperty(exports, "InlineRequire", { + enumerable: true, + get: function () { + return _InlineRequire.Component; + } +}); +Object.defineProperty(exports, "useTheme", { + enumerable: true, + get: function () { + return _useTheme.default; + } +}); +exports.ToDoList = void 0; + +var _ComponentUsingHooksIndirectly = require("./ComponentUsingHooksIndirectly"); + +var _ComponentWithCustomHook = require("./ComponentWithCustomHook"); + +var _ComponentWithExternalCustomHooks = require("./ComponentWithExternalCustomHooks"); + +var _ComponentWithMultipleHooksPerLine = require("./ComponentWithMultipleHooksPerLine"); + +var _ComponentWithNestedHooks = require("./ComponentWithNestedHooks"); + +var _ContainingStringSourceMappingURL = require("./ContainingStringSourceMappingURL"); + +var _Example = require("./Example"); + +var _InlineRequire = require("./InlineRequire"); + +var ToDoList = _interopRequireWildcard(require("./ToDoList")); + +exports.ToDoList = ToDoList; + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFTQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7OztBQUVBIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5fSBmcm9tICcuL0NvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5JztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhDdXN0b21Ib29rfSBmcm9tICcuL0NvbXBvbmVudFdpdGhDdXN0b21Ib29rJztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzfSBmcm9tICcuL0NvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzJztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhNdWx0aXBsZUhvb2tzUGVyTGluZX0gZnJvbSAnLi9Db21wb25lbnRXaXRoTXVsdGlwbGVIb29rc1BlckxpbmUnO1xuZXhwb3J0IHtDb21wb25lbnQgYXMgQ29tcG9uZW50V2l0aE5lc3RlZEhvb2tzfSBmcm9tICcuL0NvbXBvbmVudFdpdGhOZXN0ZWRIb29rcyc7XG5leHBvcnQge0NvbXBvbmVudCBhcyBDb250YWluaW5nU3RyaW5nU291cmNlTWFwcGluZ1VSTH0gZnJvbSAnLi9Db250YWluaW5nU3RyaW5nU291cmNlTWFwcGluZ1VSTCc7XG5leHBvcnQge0NvbXBvbmVudCBhcyBFeGFtcGxlfSBmcm9tICcuL0V4YW1wbGUnO1xuZXhwb3J0IHtDb21wb25lbnQgYXMgSW5saW5lUmVxdWlyZX0gZnJvbSAnLi9JbmxpbmVSZXF1aXJlJztcbmltcG9ydCAqIGFzIFRvRG9MaXN0IGZyb20gJy4vVG9Eb0xpc3QnO1xuZXhwb3J0IHtUb0RvTGlzdH07XG5leHBvcnQge2RlZmF1bHQgYXMgdXNlVGhlbWV9IGZyb20gJy4vdXNlVGhlbWUnO1xuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+Il0sIm1hcHBpbmdzIjoiQ0FBRCJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/useTheme.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/useTheme.js new file mode 100644 index 00000000000000..16d4789500b8a8 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/fb-sources-extended/useTheme.js @@ -0,0 +1,27 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = useTheme; +exports.ThemeContext = void 0; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const ThemeContext = /*#__PURE__*/(0, _react.createContext)('bright'); +exports.ThemeContext = ThemeContext; + +function useTheme() { + const theme = (0, _react.useContext)(ThemeContext); + (0, _react.useDebugValue)(theme); + return theme; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInVzZVRoZW1lLmpzIl0sIm5hbWVzIjpbIlRoZW1lQ29udGV4dCIsInVzZVRoZW1lIiwidGhlbWUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBU0E7O0FBVEE7Ozs7Ozs7O0FBV08sTUFBTUEsWUFBWSxnQkFBRywwQkFBYyxRQUFkLENBQXJCOzs7QUFFUSxTQUFTQyxRQUFULEdBQW9CO0FBQ2pDLFFBQU1DLEtBQUssR0FBRyx1QkFBV0YsWUFBWCxDQUFkO0FBQ0EsNEJBQWNFLEtBQWQ7QUFDQSxTQUFPQSxLQUFQO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuaW1wb3J0IHtjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0LCB1c2VEZWJ1Z1ZhbHVlfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBjb25zdCBUaGVtZUNvbnRleHQgPSBjcmVhdGVDb250ZXh0KCdicmlnaHQnKTtcblxuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gdXNlVGhlbWUoKSB7XG4gIGNvbnN0IHRoZW1lID0gdXNlQ29udGV4dChUaGVtZUNvbnRleHQpO1xuICB1c2VEZWJ1Z1ZhbHVlKHRoZW1lKTtcbiAgcmV0dXJuIHRoZW1lO1xufVxuIl0sInhfZmJfc291cmNlcyI6W1tudWxsLHsibmFtZXMiOlsiPG5vLWhvb2s+IiwidGhlbWUiXSwibWFwcGluZ3MiOiJDQUFEO2VnQkNBLEF3QkRBIn1dXX0= \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentUsingHooksIndirectly.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentUsingHooksIndirectly.js new file mode 100644 index 00000000000000..f4d3572ad6944d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentUsingHooksIndirectly.js @@ -0,0 +1,45 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const countState = (0, _react.useState)(0); + const count = countState[0]; + const setCount = countState[1]; + const darkMode = useIsDarkMode(); + const [isDarkMode] = darkMode; + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const darkModeState = (0, _react.useState)(false); + const [isDarkMode] = darkModeState; + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return [isDarkMode, () => {}]; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5LmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50U3RhdGUiLCJjb3VudCIsInNldENvdW50IiwiZGFya01vZGUiLCJ1c2VJc0RhcmtNb2RlIiwiaXNEYXJrTW9kZSIsImhhbmRsZUNsaWNrIiwiZGFya01vZGVTdGF0ZSIsInVzZUVmZmVjdENyZWF0ZSJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQVNBOzs7Ozs7QUFUQTs7Ozs7Ozs7QUFXTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU1DLFVBQVUsR0FBRyxxQkFBUyxDQUFULENBQW5CO0FBQ0EsUUFBTUMsS0FBSyxHQUFHRCxVQUFVLENBQUMsQ0FBRCxDQUF4QjtBQUNBLFFBQU1FLFFBQVEsR0FBR0YsVUFBVSxDQUFDLENBQUQsQ0FBM0I7QUFFQSxRQUFNRyxRQUFRLEdBQUdDLGFBQWEsRUFBOUI7QUFDQSxRQUFNLENBQUNDLFVBQUQsSUFBZUYsUUFBckI7QUFFQSx3QkFBVSxNQUFNLENBQ2Q7QUFDRCxHQUZELEVBRUcsRUFGSDs7QUFJQSxRQUFNRyxXQUFXLEdBQUcsTUFBTUosUUFBUSxDQUFDRCxLQUFLLEdBQUcsQ0FBVCxDQUFsQzs7QUFFQSxzQkFDRSx5RUFDRSx5REFBaUJJLFVBQWpCLENBREYsZUFFRSxxREFBYUosS0FBYixDQUZGLGVBR0U7QUFBUSxJQUFBLE9BQU8sRUFBRUs7QUFBakIsb0JBSEYsQ0FERjtBQU9EOztBQUVELFNBQVNGLGFBQVQsR0FBeUI7QUFDdkIsUUFBTUcsYUFBYSxHQUFHLHFCQUFTLEtBQVQsQ0FBdEI7QUFDQSxRQUFNLENBQUNGLFVBQUQsSUFBZUUsYUFBckI7QUFFQSx3QkFBVSxTQUFTQyxlQUFULEdBQTJCLENBQ25DO0FBQ0QsR0FGRCxFQUVHLEVBRkg7QUFJQSxTQUFPLENBQUNILFVBQUQsRUFBYSxNQUFNLENBQUUsQ0FBckIsQ0FBUDtBQUNEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZUVmZmVjdCwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgY291bnRTdGF0ZSA9IHVzZVN0YXRlKDApO1xuICBjb25zdCBjb3VudCA9IGNvdW50U3RhdGVbMF07XG4gIGNvbnN0IHNldENvdW50ID0gY291bnRTdGF0ZVsxXTtcblxuICBjb25zdCBkYXJrTW9kZSA9IHVzZUlzRGFya01vZGUoKTtcbiAgY29uc3QgW2lzRGFya01vZGVdID0gZGFya01vZGU7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyAuLi5cbiAgfSwgW10pO1xuXG4gIGNvbnN0IGhhbmRsZUNsaWNrID0gKCkgPT4gc2V0Q291bnQoY291bnQgKyAxKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2PkRhcmsgbW9kZT8ge2lzRGFya01vZGV9PC9kaXY+XG4gICAgICA8ZGl2PkNvdW50OiB7Y291bnR9PC9kaXY+XG4gICAgICA8YnV0dG9uIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfT5VcGRhdGUgY291bnQ8L2J1dHRvbj5cbiAgICA8Lz5cbiAgKTtcbn1cblxuZnVuY3Rpb24gdXNlSXNEYXJrTW9kZSgpIHtcbiAgY29uc3QgZGFya01vZGVTdGF0ZSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW2lzRGFya01vZGVdID0gZGFya01vZGVTdGF0ZTtcblxuICB1c2VFZmZlY3QoZnVuY3Rpb24gdXNlRWZmZWN0Q3JlYXRlKCkge1xuICAgIC8vIEhlcmUgaXMgd2hlcmUgd2UgbWF5IGxpc3RlbiB0byBhIFwidGhlbWVcIiBldmVudC4uLlxuICB9LCBbXSk7XG5cbiAgcmV0dXJuIFtpc0RhcmtNb2RlLCAoKSA9PiB7fV07XG59XG4iXSwieF9yZWFjdF9zb3VyY2VzIjpbW3sibmFtZXMiOlsiPG5vLWhvb2s+IiwiY291bnQiLCJkYXJrTW9kZSIsImlzRGFya01vZGUiXSwibWFwcGluZ3MiOiJDQUFEO2FxQkNBLEFXREE7aUJiRUEsQWVGQTtvQ1ZHQSxBZUhBIn1dXX0= \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithCustomHook.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithCustomHook.js new file mode 100644 index 00000000000000..d9aea69a221df6 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithCustomHook.js @@ -0,0 +1,41 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + const isDarkMode = useIsDarkMode(); + (0, _react.useEffect)(() => {// ... + }, []); + + const handleClick = () => setCount(count + 1); + + return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Dark mode? ", isDarkMode), /*#__PURE__*/_react.default.createElement("div", null, "Count: ", count), /*#__PURE__*/_react.default.createElement("button", { + onClick: handleClick + }, "Update count")); +} + +function useIsDarkMode() { + const [isDarkMode] = (0, _react.useState)(false); + (0, _react.useEffect)(function useEffectCreate() {// Here is where we may listen to a "theme" event... + }, []); + return isDarkMode; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhDdXN0b21Ib29rLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50Iiwic2V0Q291bnQiLCJpc0RhcmtNb2RlIiwidXNlSXNEYXJrTW9kZSIsImhhbmRsZUNsaWNrIiwidXNlRWZmZWN0Q3JlYXRlIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBU0E7Ozs7OztBQVRBOzs7Ozs7OztBQVdPLFNBQVNBLFNBQVQsR0FBcUI7QUFDMUIsUUFBTSxDQUFDQyxLQUFELEVBQVFDLFFBQVIsSUFBb0IscUJBQVMsQ0FBVCxDQUExQjtBQUNBLFFBQU1DLFVBQVUsR0FBR0MsYUFBYSxFQUFoQztBQUVBLHdCQUFVLE1BQU0sQ0FDZDtBQUNELEdBRkQsRUFFRyxFQUZIOztBQUlBLFFBQU1DLFdBQVcsR0FBRyxNQUFNSCxRQUFRLENBQUNELEtBQUssR0FBRyxDQUFULENBQWxDOztBQUVBLHNCQUNFLHlFQUNFLHlEQUFpQkUsVUFBakIsQ0FERixlQUVFLHFEQUFhRixLQUFiLENBRkYsZUFHRTtBQUFRLElBQUEsT0FBTyxFQUFFSTtBQUFqQixvQkFIRixDQURGO0FBT0Q7O0FBRUQsU0FBU0QsYUFBVCxHQUF5QjtBQUN2QixRQUFNLENBQUNELFVBQUQsSUFBZSxxQkFBUyxLQUFULENBQXJCO0FBRUEsd0JBQVUsU0FBU0csZUFBVCxHQUEyQixDQUNuQztBQUNELEdBRkQsRUFFRyxFQUZIO0FBSUEsU0FBT0gsVUFBUDtBQUNEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZUVmZmVjdCwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgW2NvdW50LCBzZXRDb3VudF0gPSB1c2VTdGF0ZSgwKTtcbiAgY29uc3QgaXNEYXJrTW9kZSA9IHVzZUlzRGFya01vZGUoKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIC8vIC4uLlxuICB9LCBbXSk7XG5cbiAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoKSA9PiBzZXRDb3VudChjb3VudCArIDEpO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxkaXY+RGFyayBtb2RlPyB7aXNEYXJrTW9kZX08L2Rpdj5cbiAgICAgIDxkaXY+Q291bnQ6IHtjb3VudH08L2Rpdj5cbiAgICAgIDxidXR0b24gb25DbGljaz17aGFuZGxlQ2xpY2t9PlVwZGF0ZSBjb3VudDwvYnV0dG9uPlxuICAgIDwvPlxuICApO1xufVxuXG5mdW5jdGlvbiB1c2VJc0RhcmtNb2RlKCkge1xuICBjb25zdCBbaXNEYXJrTW9kZV0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgdXNlRWZmZWN0KGZ1bmN0aW9uIHVzZUVmZmVjdENyZWF0ZSgpIHtcbiAgICAvLyBIZXJlIGlzIHdoZXJlIHdlIG1heSBsaXN0ZW4gdG8gYSBcInRoZW1lXCIgZXZlbnQuLi5cbiAgfSwgW10pO1xuXG4gIHJldHVybiBpc0RhcmtNb2RlO1xufVxuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiIsImNvdW50IiwiaXNEYXJrTW9kZSJdLCJtYXBwaW5ncyI6IkNBQUQ7YTRCQ0EsQVdEQTtjbEJFQSxBZUZBO2dDYkVBLEFlRkEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithExternalCustomHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithExternalCustomHooks.js new file mode 100644 index 00000000000000..7e525c715238a8 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithExternalCustomHooks.js @@ -0,0 +1,26 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireDefault(require("react")); + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const theme = (0, _useTheme.default)(); + return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsInRoZW1lIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBU0E7O0FBQ0E7Ozs7QUFWQTs7Ozs7Ozs7QUFZTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU1DLEtBQUssR0FBRyx3QkFBZDtBQUVBLHNCQUFPLHFEQUFhQSxLQUFiLENBQVA7QUFDRCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSBGYWNlYm9vaywgSW5jLiBhbmQgaXRzIGFmZmlsaWF0ZXMuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgTUlUIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICogQGZsb3dcbiAqL1xuXG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHVzZVRoZW1lIGZyb20gJy4vdXNlVGhlbWUnO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29tcG9uZW50KCkge1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG5cbiAgcmV0dXJuIDxkaXY+dGhlbWU6IHt0aGVtZX08L2Rpdj47XG59XG4iXSwieF9yZWFjdF9zb3VyY2VzIjpbW3sibmFtZXMiOlsiPG5vLWhvb2s+IiwidGhlbWUiXSwibWFwcGluZ3MiOiJDQUFEO2NnQkNBLEFVREEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithMultipleHooksPerLine.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithMultipleHooksPerLine.js new file mode 100644 index 00000000000000..c79712b1370481 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithMultipleHooksPerLine.js @@ -0,0 +1,30 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const A = /*#__PURE__*/(0, _react.createContext)(1); +const B = /*#__PURE__*/(0, _react.createContext)(2); + +function Component() { + const a = (0, _react.useContext)(A); + const b = (0, _react.useContext)(B); // prettier-ignore + + const c = (0, _react.useContext)(A), + d = (0, _react.useContext)(B); // eslint-disable-line one-var + + return a + b + c + d; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhNdWx0aXBsZUhvb2tzUGVyTGluZS5qcyJdLCJuYW1lcyI6WyJBIiwiQiIsIkNvbXBvbmVudCIsImEiLCJiIiwiYyIsImQiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFTQTs7QUFUQTs7Ozs7Ozs7QUFXQSxNQUFNQSxDQUFDLGdCQUFHLDBCQUFjLENBQWQsQ0FBVjtBQUNBLE1BQU1DLENBQUMsZ0JBQUcsMEJBQWMsQ0FBZCxDQUFWOztBQUVPLFNBQVNDLFNBQVQsR0FBcUI7QUFDMUIsUUFBTUMsQ0FBQyxHQUFHLHVCQUFXSCxDQUFYLENBQVY7QUFDQSxRQUFNSSxDQUFDLEdBQUcsdUJBQVdILENBQVgsQ0FBVixDQUYwQixDQUkxQjs7QUFDQSxRQUFNSSxDQUFDLEdBQUcsdUJBQVdMLENBQVgsQ0FBVjtBQUFBLFFBQXlCTSxDQUFDLEdBQUcsdUJBQVdMLENBQVgsQ0FBN0IsQ0FMMEIsQ0FLa0I7O0FBRTVDLFNBQU9FLENBQUMsR0FBR0MsQ0FBSixHQUFRQyxDQUFSLEdBQVlDLENBQW5CO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuaW1wb3J0IHtjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0fSBmcm9tICdyZWFjdCc7XG5cbmNvbnN0IEEgPSBjcmVhdGVDb250ZXh0KDEpO1xuY29uc3QgQiA9IGNyZWF0ZUNvbnRleHQoMik7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb21wb25lbnQoKSB7XG4gIGNvbnN0IGEgPSB1c2VDb250ZXh0KEEpO1xuICBjb25zdCBiID0gdXNlQ29udGV4dChCKTtcblxuICAvLyBwcmV0dGllci1pZ25vcmVcbiAgY29uc3QgYyA9IHVzZUNvbnRleHQoQSksIGQgPSB1c2VDb250ZXh0KEIpOyAvLyBlc2xpbnQtZGlzYWJsZS1saW5lIG9uZS12YXJcblxuICByZXR1cm4gYSArIGIgKyBjICsgZDtcbn1cbiJdLCJ4X3JlYWN0X3NvdXJjZXMiOltbeyJuYW1lcyI6WyI8bm8taG9vaz4iLCJhIiwiYiIsImMiLCJkIl0sIm1hcHBpbmdzIjoiQ0FBRDtnQllDQSxBYURBO2lCYkVBLEFhRkE7b0JiR0EsQWFIQSxBTUlBLEFhSkEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithNestedHooks.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithNestedHooks.js new file mode 100644 index 00000000000000..d9394fd366ea07 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ComponentWithNestedHooks.js @@ -0,0 +1,28 @@ +"use strict"; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const { + useMemo, + useState +} = require('react'); + +function Component(props) { + const InnerComponent = useMemo(() => () => { + const [state] = useState(0); + return state; + }); + props.callback(InnerComponent); + return null; +} + +module.exports = { + Component +}; +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbXBvbmVudFdpdGhOZXN0ZWRIb29rcy5qcyJdLCJuYW1lcyI6WyJ1c2VNZW1vIiwidXNlU3RhdGUiLCJyZXF1aXJlIiwiQ29tcG9uZW50IiwicHJvcHMiLCJJbm5lckNvbXBvbmVudCIsInN0YXRlIiwiY2FsbGJhY2siLCJtb2R1bGUiLCJleHBvcnRzIl0sIm1hcHBpbmdzIjoiOztBQUFBOzs7Ozs7OztBQVFBLE1BQU07QUFBQ0EsRUFBQUEsT0FBRDtBQUFVQyxFQUFBQTtBQUFWLElBQXNCQyxPQUFPLENBQUMsT0FBRCxDQUFuQzs7QUFFQSxTQUFTQyxTQUFULENBQW1CQyxLQUFuQixFQUEwQjtBQUN4QixRQUFNQyxjQUFjLEdBQUdMLE9BQU8sQ0FBQyxNQUFNLE1BQU07QUFDekMsVUFBTSxDQUFDTSxLQUFELElBQVVMLFFBQVEsQ0FBQyxDQUFELENBQXhCO0FBRUEsV0FBT0ssS0FBUDtBQUNELEdBSjZCLENBQTlCO0FBS0FGLEVBQUFBLEtBQUssQ0FBQ0csUUFBTixDQUFlRixjQUFmO0FBRUEsU0FBTyxJQUFQO0FBQ0Q7O0FBRURHLE1BQU0sQ0FBQ0MsT0FBUCxHQUFpQjtBQUFDTixFQUFBQTtBQUFELENBQWpCIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5jb25zdCB7dXNlTWVtbywgdXNlU3RhdGV9ID0gcmVxdWlyZSgncmVhY3QnKTtcblxuZnVuY3Rpb24gQ29tcG9uZW50KHByb3BzKSB7XG4gIGNvbnN0IElubmVyQ29tcG9uZW50ID0gdXNlTWVtbygoKSA9PiAoKSA9PiB7XG4gICAgY29uc3QgW3N0YXRlXSA9IHVzZVN0YXRlKDApO1xuXG4gICAgcmV0dXJuIHN0YXRlO1xuICB9KTtcbiAgcHJvcHMuY2FsbGJhY2soSW5uZXJDb21wb25lbnQpO1xuXG4gIHJldHVybiBudWxsO1xufVxuXG5tb2R1bGUuZXhwb3J0cyA9IHtDb21wb25lbnR9O1xuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiIsIklubmVyQ29tcG9uZW50Iiwic3RhdGUiXSwibWFwcGluZ3MiOiJDQUFEO1l5QkNBO2FMQ0EsQVdEQTtnQjNCREEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ContainingStringSourceMappingURL.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ContainingStringSourceMappingURL.js new file mode 100644 index 00000000000000..6e446dd87e9442 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ContainingStringSourceMappingURL.js @@ -0,0 +1,29 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +// ?sourceMappingURL=([^\s'"]+)/gm +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbnRhaW5pbmdTdHJpbmdTb3VyY2VNYXBwaW5nVVJMLmpzIl0sIm5hbWVzIjpbIkNvbXBvbmVudCIsImNvdW50Iiwic2V0Q291bnQiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFTQTs7Ozs7O0FBVEE7Ozs7Ozs7O0FBV0E7QUFFTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLHFCQUFTLENBQVQsQ0FBMUI7QUFFQSxzQkFDRSx1REFDRSx3REFBZ0JELEtBQWhCLFdBREYsZUFFRTtBQUFRLElBQUEsT0FBTyxFQUFFLE1BQU1DLFFBQVEsQ0FBQ0QsS0FBSyxHQUFHLENBQVQ7QUFBL0IsZ0JBRkYsQ0FERjtBQU1EIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5cbi8vID9zb3VyY2VNYXBwaW5nVVJMPShbXlxccydcIl0rKS9nbVxuXG5leHBvcnQgZnVuY3Rpb24gQ29tcG9uZW50KCkge1xuICBjb25zdCBbY291bnQsIHNldENvdW50XSA9IHVzZVN0YXRlKDApO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdj5cbiAgICAgIDxwPllvdSBjbGlja2VkIHtjb3VudH0gdGltZXM8L3A+XG4gICAgICA8YnV0dG9uIG9uQ2xpY2s9eygpID0+IHNldENvdW50KGNvdW50ICsgMSl9PkNsaWNrIG1lPC9idXR0b24+XG4gICAgPC9kaXY+XG4gICk7XG59XG4iXSwieF9yZWFjdF9zb3VyY2VzIjpbW3sibmFtZXMiOlsiPG5vLWhvb2s+IiwiY291bnQiXSwibWFwcGluZ3MiOiJDQUFEO2U0QkNBLEFXREEifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/Example.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/Example.js new file mode 100644 index 00000000000000..40e7fbf0b4287a --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/Example.js @@ -0,0 +1,28 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +var _react = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count, setCount] = (0, _react.useState)(0); + return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "You clicked ", count, " times"), /*#__PURE__*/_react.default.createElement("button", { + onClick: () => setCount(count + 1) + }, "Click me")); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkV4YW1wbGUuanMiXSwibmFtZXMiOlsiQ29tcG9uZW50IiwiY291bnQiLCJzZXRDb3VudCJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQVNBOzs7Ozs7QUFUQTs7Ozs7Ozs7QUFXTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLHFCQUFTLENBQVQsQ0FBMUI7QUFFQSxzQkFDRSx1REFDRSx3REFBZ0JELEtBQWhCLFdBREYsZUFFRTtBQUFRLElBQUEsT0FBTyxFQUFFLE1BQU1DLFFBQVEsQ0FBQ0QsS0FBSyxHQUFHLENBQVQ7QUFBL0IsZ0JBRkYsQ0FERjtBQU1EIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCBSZWFjdCwge3VzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb21wb25lbnQoKSB7XG4gIGNvbnN0IFtjb3VudCwgc2V0Q291bnRdID0gdXNlU3RhdGUoMCk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2PlxuICAgICAgPHA+WW91IGNsaWNrZWQge2NvdW50fSB0aW1lczwvcD5cbiAgICAgIDxidXR0b24gb25DbGljaz17KCkgPT4gc2V0Q291bnQoY291bnQgKyAxKX0+Q2xpY2sgbWU8L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdLCJ4X3JlYWN0X3NvdXJjZXMiOltbeyJuYW1lcyI6WyI8bm8taG9vaz4iLCJjb3VudCJdLCJtYXBwaW5ncyI6IkNBQUQ7YTRCQ0EsQVdEQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/InlineRequire.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/InlineRequire.js new file mode 100644 index 00000000000000..a215395840d73a --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/InlineRequire.js @@ -0,0 +1,21 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.Component = Component; + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function Component() { + const [count] = require('react').useState(0); + + return count; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIklubGluZVJlcXVpcmUuanMiXSwibmFtZXMiOlsiQ29tcG9uZW50IiwiY291bnQiLCJyZXF1aXJlIiwidXNlU3RhdGUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFBQTs7Ozs7Ozs7QUFTTyxTQUFTQSxTQUFULEdBQXFCO0FBQzFCLFFBQU0sQ0FBQ0MsS0FBRCxJQUFVQyxPQUFPLENBQUMsT0FBRCxDQUFQLENBQWlCQyxRQUFqQixDQUEwQixDQUExQixDQUFoQjs7QUFFQSxTQUFPRixLQUFQO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuZXhwb3J0IGZ1bmN0aW9uIENvbXBvbmVudCgpIHtcbiAgY29uc3QgW2NvdW50XSA9IHJlcXVpcmUoJ3JlYWN0JykudXNlU3RhdGUoMCk7XG5cbiAgcmV0dXJuIGNvdW50O1xufVxuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiJdLCJtYXBwaW5ncyI6IkNBQUQifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ToDoList.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ToDoList.js new file mode 100644 index 00000000000000..0c7a15e919ec8f --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/ToDoList.js @@ -0,0 +1,106 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.ListItem = ListItem; +exports.List = List; + +var React = _interopRequireWildcard(require("react")); + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +function ListItem({ + item, + removeItem, + toggleItem +}) { + const handleDelete = (0, React.useCallback)(() => { + removeItem(item); + }, [item, removeItem]); + const handleToggle = (0, React.useCallback)(() => { + toggleItem(item); + }, [item, toggleItem]); + return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("button", { + onClick: handleDelete + }, "Delete"), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", { + checked: item.isComplete, + onChange: handleToggle, + type: "checkbox" + }), ' ', item.text)); +} + +function List(props) { + const [newItemText, setNewItemText] = (0, React.useState)(''); + const [items, setItems] = (0, React.useState)([{ + id: 1, + isComplete: true, + text: 'First' + }, { + id: 2, + isComplete: true, + text: 'Second' + }, { + id: 3, + isComplete: false, + text: 'Third' + }]); + const [uid, setUID] = (0, React.useState)(4); + const handleClick = (0, React.useCallback)(() => { + if (newItemText !== '') { + setItems([...items, { + id: uid, + isComplete: false, + text: newItemText + }]); + setUID(uid + 1); + setNewItemText(''); + } + }, [newItemText, items, uid]); + const handleKeyPress = (0, React.useCallback)(event => { + if (event.key === 'Enter') { + handleClick(); + } + }, [handleClick]); + const handleChange = (0, React.useCallback)(event => { + setNewItemText(event.currentTarget.value); + }, [setNewItemText]); + const removeItem = (0, React.useCallback)(itemToRemove => setItems(items.filter(item => item !== itemToRemove)), [items]); + const toggleItem = (0, React.useCallback)(itemToToggle => { + // Dont use indexOf() + // because editing props in DevTools creates a new Object. + const index = items.findIndex(item => item.id === itemToToggle.id); + setItems(items.slice(0, index).concat({ ...itemToToggle, + isComplete: !itemToToggle.isComplete + }).concat(items.slice(index + 1))); + }, [items]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "List"), /*#__PURE__*/React.createElement("input", { + type: "text", + placeholder: "New list item...", + value: newItemText, + onChange: handleChange, + onKeyPress: handleKeyPress + }), /*#__PURE__*/React.createElement("button", { + disabled: newItemText === '', + onClick: handleClick + }, /*#__PURE__*/React.createElement("span", { + role: "img", + "aria-label": "Add item" + }, "Add")), /*#__PURE__*/React.createElement("ul", null, items.map(item => /*#__PURE__*/React.createElement(ListItem, { + key: item.id, + item: item, + removeItem: removeItem, + toggleItem: toggleItem + })))); +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvRG9MaXN0LmpzIl0sIm5hbWVzIjpbIkxpc3RJdGVtIiwiaXRlbSIsInJlbW92ZUl0ZW0iLCJ0b2dnbGVJdGVtIiwiaGFuZGxlRGVsZXRlIiwiaGFuZGxlVG9nZ2xlIiwiaXNDb21wbGV0ZSIsInRleHQiLCJMaXN0IiwicHJvcHMiLCJuZXdJdGVtVGV4dCIsInNldE5ld0l0ZW1UZXh0IiwiaXRlbXMiLCJzZXRJdGVtcyIsImlkIiwidWlkIiwic2V0VUlEIiwiaGFuZGxlQ2xpY2siLCJoYW5kbGVLZXlQcmVzcyIsImV2ZW50Iiwia2V5IiwiaGFuZGxlQ2hhbmdlIiwiY3VycmVudFRhcmdldCIsInZhbHVlIiwiaXRlbVRvUmVtb3ZlIiwiZmlsdGVyIiwiaXRlbVRvVG9nZ2xlIiwiaW5kZXgiLCJmaW5kSW5kZXgiLCJzbGljZSIsImNvbmNhdCIsIm1hcCJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7QUFTQTs7Ozs7O0FBVEE7Ozs7Ozs7O0FBWU8sU0FBU0EsUUFBVCxDQUFrQjtBQUFDQyxFQUFBQSxJQUFEO0FBQU9DLEVBQUFBLFVBQVA7QUFBbUJDLEVBQUFBO0FBQW5CLENBQWxCLEVBQWtEO0FBQ3ZELFFBQU1DLFlBQVksR0FBRyx1QkFBWSxNQUFNO0FBQ3JDRixJQUFBQSxVQUFVLENBQUNELElBQUQsQ0FBVjtBQUNELEdBRm9CLEVBRWxCLENBQUNBLElBQUQsRUFBT0MsVUFBUCxDQUZrQixDQUFyQjtBQUlBLFFBQU1HLFlBQVksR0FBRyx1QkFBWSxNQUFNO0FBQ3JDRixJQUFBQSxVQUFVLENBQUNGLElBQUQsQ0FBVjtBQUNELEdBRm9CLEVBRWxCLENBQUNBLElBQUQsRUFBT0UsVUFBUCxDQUZrQixDQUFyQjtBQUlBLHNCQUNFLDZDQUNFO0FBQVEsSUFBQSxPQUFPLEVBQUVDO0FBQWpCLGNBREYsZUFFRSxnREFDRTtBQUNFLElBQUEsT0FBTyxFQUFFSCxJQUFJLENBQUNLLFVBRGhCO0FBRUUsSUFBQSxRQUFRLEVBQUVELFlBRlo7QUFHRSxJQUFBLElBQUksRUFBQztBQUhQLElBREYsRUFLSyxHQUxMLEVBTUdKLElBQUksQ0FBQ00sSUFOUixDQUZGLENBREY7QUFhRDs7QUFFTSxTQUFTQyxJQUFULENBQWNDLEtBQWQsRUFBcUI7QUFDMUIsUUFBTSxDQUFDQyxXQUFELEVBQWNDLGNBQWQsSUFBZ0Msb0JBQVMsRUFBVCxDQUF0QztBQUNBLFFBQU0sQ0FBQ0MsS0FBRCxFQUFRQyxRQUFSLElBQW9CLG9CQUFTLENBQ2pDO0FBQUNDLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxJQUFwQjtBQUEwQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWhDLEdBRGlDLEVBRWpDO0FBQUNPLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxJQUFwQjtBQUEwQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWhDLEdBRmlDLEVBR2pDO0FBQUNPLElBQUFBLEVBQUUsRUFBRSxDQUFMO0FBQVFSLElBQUFBLFVBQVUsRUFBRSxLQUFwQjtBQUEyQkMsSUFBQUEsSUFBSSxFQUFFO0FBQWpDLEdBSGlDLENBQVQsQ0FBMUI7QUFLQSxRQUFNLENBQUNRLEdBQUQsRUFBTUMsTUFBTixJQUFnQixvQkFBUyxDQUFULENBQXRCO0FBRUEsUUFBTUMsV0FBVyxHQUFHLHVCQUFZLE1BQU07QUFDcEMsUUFBSVAsV0FBVyxLQUFLLEVBQXBCLEVBQXdCO0FBQ3RCRyxNQUFBQSxRQUFRLENBQUMsQ0FDUCxHQUFHRCxLQURJLEVBRVA7QUFDRUUsUUFBQUEsRUFBRSxFQUFFQyxHQUROO0FBRUVULFFBQUFBLFVBQVUsRUFBRSxLQUZkO0FBR0VDLFFBQUFBLElBQUksRUFBRUc7QUFIUixPQUZPLENBQUQsQ0FBUjtBQVFBTSxNQUFBQSxNQUFNLENBQUNELEdBQUcsR0FBRyxDQUFQLENBQU47QUFDQUosTUFBQUEsY0FBYyxDQUFDLEVBQUQsQ0FBZDtBQUNEO0FBQ0YsR0FibUIsRUFhakIsQ0FBQ0QsV0FBRCxFQUFjRSxLQUFkLEVBQXFCRyxHQUFyQixDQWJpQixDQUFwQjtBQWVBLFFBQU1HLGNBQWMsR0FBRyx1QkFDckJDLEtBQUssSUFBSTtBQUNQLFFBQUlBLEtBQUssQ0FBQ0MsR0FBTixLQUFjLE9BQWxCLEVBQTJCO0FBQ3pCSCxNQUFBQSxXQUFXO0FBQ1o7QUFDRixHQUxvQixFQU1yQixDQUFDQSxXQUFELENBTnFCLENBQXZCO0FBU0EsUUFBTUksWUFBWSxHQUFHLHVCQUNuQkYsS0FBSyxJQUFJO0FBQ1BSLElBQUFBLGNBQWMsQ0FBQ1EsS0FBSyxDQUFDRyxhQUFOLENBQW9CQyxLQUFyQixDQUFkO0FBQ0QsR0FIa0IsRUFJbkIsQ0FBQ1osY0FBRCxDQUptQixDQUFyQjtBQU9BLFFBQU1ULFVBQVUsR0FBRyx1QkFDakJzQixZQUFZLElBQUlYLFFBQVEsQ0FBQ0QsS0FBSyxDQUFDYSxNQUFOLENBQWF4QixJQUFJLElBQUlBLElBQUksS0FBS3VCLFlBQTlCLENBQUQsQ0FEUCxFQUVqQixDQUFDWixLQUFELENBRmlCLENBQW5CO0FBS0EsUUFBTVQsVUFBVSxHQUFHLHVCQUNqQnVCLFlBQVksSUFBSTtBQUNkO0FBQ0E7QUFDQSxVQUFNQyxLQUFLLEdBQUdmLEtBQUssQ0FBQ2dCLFNBQU4sQ0FBZ0IzQixJQUFJLElBQUlBLElBQUksQ0FBQ2EsRUFBTCxLQUFZWSxZQUFZLENBQUNaLEVBQWpELENBQWQ7QUFFQUQsSUFBQUEsUUFBUSxDQUNORCxLQUFLLENBQ0ZpQixLQURILENBQ1MsQ0FEVCxFQUNZRixLQURaLEVBRUdHLE1BRkgsQ0FFVSxFQUNOLEdBQUdKLFlBREc7QUFFTnBCLE1BQUFBLFVBQVUsRUFBRSxDQUFDb0IsWUFBWSxDQUFDcEI7QUFGcEIsS0FGVixFQU1Hd0IsTUFOSCxDQU1VbEIsS0FBSyxDQUFDaUIsS0FBTixDQUFZRixLQUFLLEdBQUcsQ0FBcEIsQ0FOVixDQURNLENBQVI7QUFTRCxHQWZnQixFQWdCakIsQ0FBQ2YsS0FBRCxDQWhCaUIsQ0FBbkI7QUFtQkEsc0JBQ0Usb0JBQUMsY0FBRCxxQkFDRSx1Q0FERixlQUVFO0FBQ0UsSUFBQSxJQUFJLEVBQUMsTUFEUDtBQUVFLElBQUEsV0FBVyxFQUFDLGtCQUZkO0FBR0UsSUFBQSxLQUFLLEVBQUVGLFdBSFQ7QUFJRSxJQUFBLFFBQVEsRUFBRVcsWUFKWjtBQUtFLElBQUEsVUFBVSxFQUFFSDtBQUxkLElBRkYsZUFTRTtBQUFRLElBQUEsUUFBUSxFQUFFUixXQUFXLEtBQUssRUFBbEM7QUFBc0MsSUFBQSxPQUFPLEVBQUVPO0FBQS9DLGtCQUNFO0FBQU0sSUFBQSxJQUFJLEVBQUMsS0FBWDtBQUFpQixrQkFBVztBQUE1QixXQURGLENBVEYsZUFjRSxnQ0FDR0wsS0FBSyxDQUFDbUIsR0FBTixDQUFVOUIsSUFBSSxpQkFDYixvQkFBQyxRQUFEO0FBQ0UsSUFBQSxHQUFHLEVBQUVBLElBQUksQ0FBQ2EsRUFEWjtBQUVFLElBQUEsSUFBSSxFQUFFYixJQUZSO0FBR0UsSUFBQSxVQUFVLEVBQUVDLFVBSGQ7QUFJRSxJQUFBLFVBQVUsRUFBRUM7QUFKZCxJQURELENBREgsQ0FkRixDQURGO0FBMkJEIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7RnJhZ21lbnQsIHVzZUNhbGxiYWNrLCB1c2VTdGF0ZX0gZnJvbSAncmVhY3QnO1xuXG5leHBvcnQgZnVuY3Rpb24gTGlzdEl0ZW0oe2l0ZW0sIHJlbW92ZUl0ZW0sIHRvZ2dsZUl0ZW19KSB7XG4gIGNvbnN0IGhhbmRsZURlbGV0ZSA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICByZW1vdmVJdGVtKGl0ZW0pO1xuICB9LCBbaXRlbSwgcmVtb3ZlSXRlbV0pO1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZSA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICB0b2dnbGVJdGVtKGl0ZW0pO1xuICB9LCBbaXRlbSwgdG9nZ2xlSXRlbV0pO1xuXG4gIHJldHVybiAoXG4gICAgPGxpPlxuICAgICAgPGJ1dHRvbiBvbkNsaWNrPXtoYW5kbGVEZWxldGV9PkRlbGV0ZTwvYnV0dG9uPlxuICAgICAgPGxhYmVsPlxuICAgICAgICA8aW5wdXRcbiAgICAgICAgICBjaGVja2VkPXtpdGVtLmlzQ29tcGxldGV9XG4gICAgICAgICAgb25DaGFuZ2U9e2hhbmRsZVRvZ2dsZX1cbiAgICAgICAgICB0eXBlPVwiY2hlY2tib3hcIlxuICAgICAgICAvPnsnICd9XG4gICAgICAgIHtpdGVtLnRleHR9XG4gICAgICA8L2xhYmVsPlxuICAgIDwvbGk+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBMaXN0KHByb3BzKSB7XG4gIGNvbnN0IFtuZXdJdGVtVGV4dCwgc2V0TmV3SXRlbVRleHRdID0gdXNlU3RhdGUoJycpO1xuICBjb25zdCBbaXRlbXMsIHNldEl0ZW1zXSA9IHVzZVN0YXRlKFtcbiAgICB7aWQ6IDEsIGlzQ29tcGxldGU6IHRydWUsIHRleHQ6ICdGaXJzdCd9LFxuICAgIHtpZDogMiwgaXNDb21wbGV0ZTogdHJ1ZSwgdGV4dDogJ1NlY29uZCd9LFxuICAgIHtpZDogMywgaXNDb21wbGV0ZTogZmFsc2UsIHRleHQ6ICdUaGlyZCd9LFxuICBdKTtcbiAgY29uc3QgW3VpZCwgc2V0VUlEXSA9IHVzZVN0YXRlKDQpO1xuXG4gIGNvbnN0IGhhbmRsZUNsaWNrID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIGlmIChuZXdJdGVtVGV4dCAhPT0gJycpIHtcbiAgICAgIHNldEl0ZW1zKFtcbiAgICAgICAgLi4uaXRlbXMsXG4gICAgICAgIHtcbiAgICAgICAgICBpZDogdWlkLFxuICAgICAgICAgIGlzQ29tcGxldGU6IGZhbHNlLFxuICAgICAgICAgIHRleHQ6IG5ld0l0ZW1UZXh0LFxuICAgICAgICB9LFxuICAgICAgXSk7XG4gICAgICBzZXRVSUQodWlkICsgMSk7XG4gICAgICBzZXROZXdJdGVtVGV4dCgnJyk7XG4gICAgfVxuICB9LCBbbmV3SXRlbVRleHQsIGl0ZW1zLCB1aWRdKTtcblxuICBjb25zdCBoYW5kbGVLZXlQcmVzcyA9IHVzZUNhbGxiYWNrKFxuICAgIGV2ZW50ID0+IHtcbiAgICAgIGlmIChldmVudC5rZXkgPT09ICdFbnRlcicpIHtcbiAgICAgICAgaGFuZGxlQ2xpY2soKTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtoYW5kbGVDbGlja10sXG4gICk7XG5cbiAgY29uc3QgaGFuZGxlQ2hhbmdlID0gdXNlQ2FsbGJhY2soXG4gICAgZXZlbnQgPT4ge1xuICAgICAgc2V0TmV3SXRlbVRleHQoZXZlbnQuY3VycmVudFRhcmdldC52YWx1ZSk7XG4gICAgfSxcbiAgICBbc2V0TmV3SXRlbVRleHRdLFxuICApO1xuXG4gIGNvbnN0IHJlbW92ZUl0ZW0gPSB1c2VDYWxsYmFjayhcbiAgICBpdGVtVG9SZW1vdmUgPT4gc2V0SXRlbXMoaXRlbXMuZmlsdGVyKGl0ZW0gPT4gaXRlbSAhPT0gaXRlbVRvUmVtb3ZlKSksXG4gICAgW2l0ZW1zXSxcbiAgKTtcblxuICBjb25zdCB0b2dnbGVJdGVtID0gdXNlQ2FsbGJhY2soXG4gICAgaXRlbVRvVG9nZ2xlID0+IHtcbiAgICAgIC8vIERvbnQgdXNlIGluZGV4T2YoKVxuICAgICAgLy8gYmVjYXVzZSBlZGl0aW5nIHByb3BzIGluIERldlRvb2xzIGNyZWF0ZXMgYSBuZXcgT2JqZWN0LlxuICAgICAgY29uc3QgaW5kZXggPSBpdGVtcy5maW5kSW5kZXgoaXRlbSA9PiBpdGVtLmlkID09PSBpdGVtVG9Ub2dnbGUuaWQpO1xuXG4gICAgICBzZXRJdGVtcyhcbiAgICAgICAgaXRlbXNcbiAgICAgICAgICAuc2xpY2UoMCwgaW5kZXgpXG4gICAgICAgICAgLmNvbmNhdCh7XG4gICAgICAgICAgICAuLi5pdGVtVG9Ub2dnbGUsXG4gICAgICAgICAgICBpc0NvbXBsZXRlOiAhaXRlbVRvVG9nZ2xlLmlzQ29tcGxldGUsXG4gICAgICAgICAgfSlcbiAgICAgICAgICAuY29uY2F0KGl0ZW1zLnNsaWNlKGluZGV4ICsgMSkpLFxuICAgICAgKTtcbiAgICB9LFxuICAgIFtpdGVtc10sXG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8RnJhZ21lbnQ+XG4gICAgICA8aDE+TGlzdDwvaDE+XG4gICAgICA8aW5wdXRcbiAgICAgICAgdHlwZT1cInRleHRcIlxuICAgICAgICBwbGFjZWhvbGRlcj1cIk5ldyBsaXN0IGl0ZW0uLi5cIlxuICAgICAgICB2YWx1ZT17bmV3SXRlbVRleHR9XG4gICAgICAgIG9uQ2hhbmdlPXtoYW5kbGVDaGFuZ2V9XG4gICAgICAgIG9uS2V5UHJlc3M9e2hhbmRsZUtleVByZXNzfVxuICAgICAgLz5cbiAgICAgIDxidXR0b24gZGlzYWJsZWQ9e25ld0l0ZW1UZXh0ID09PSAnJ30gb25DbGljaz17aGFuZGxlQ2xpY2t9PlxuICAgICAgICA8c3BhbiByb2xlPVwiaW1nXCIgYXJpYS1sYWJlbD1cIkFkZCBpdGVtXCI+XG4gICAgICAgICAgQWRkXG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvYnV0dG9uPlxuICAgICAgPHVsPlxuICAgICAgICB7aXRlbXMubWFwKGl0ZW0gPT4gKFxuICAgICAgICAgIDxMaXN0SXRlbVxuICAgICAgICAgICAga2V5PXtpdGVtLmlkfVxuICAgICAgICAgICAgaXRlbT17aXRlbX1cbiAgICAgICAgICAgIHJlbW92ZUl0ZW09e3JlbW92ZUl0ZW19XG4gICAgICAgICAgICB0b2dnbGVJdGVtPXt0b2dnbGVJdGVtfVxuICAgICAgICAgIC8+XG4gICAgICAgICkpfVxuICAgICAgPC91bD5cbiAgICA8L0ZyYWdtZW50PlxuICApO1xufVxuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiIsImhhbmRsZURlbGV0ZSIsImhhbmRsZVRvZ2dsZSIsIm5ld0l0ZW1UZXh0IiwiaXRlbXMiLCJ1aWQiLCJoYW5kbGVDbGljayIsImhhbmRsZUtleVByZXNzIiwiaGFuZGxlQ2hhbmdlIiwicmVtb3ZlSXRlbSIsInRvZ2dsZUl0ZW0iXSwibWFwcGluZ3MiOiJDQUFEO2N1QkNBO2dCQ0RBO2tCREVBO29CQ0ZBO3NDZ0JHQSxBWUhBO3VDeEJJQTsyQ3hCSkE7NENvQktBLEFXTEE7OENiTUE7MkRTTkE7NkROT0E7b0V0QlBBO3NFb0JRQTsyRXBCUkE7NkVrQlNBO2dGbEJUQTtrRmtCVUE7bUdsQlZBIn1dXX0= \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/index.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/index.js new file mode 100644 index 00000000000000..d0e793c8f72b30 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/index.js @@ -0,0 +1,89 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +Object.defineProperty(exports, "ComponentUsingHooksIndirectly", { + enumerable: true, + get: function () { + return _ComponentUsingHooksIndirectly.Component; + } +}); +Object.defineProperty(exports, "ComponentWithCustomHook", { + enumerable: true, + get: function () { + return _ComponentWithCustomHook.Component; + } +}); +Object.defineProperty(exports, "ComponentWithExternalCustomHooks", { + enumerable: true, + get: function () { + return _ComponentWithExternalCustomHooks.Component; + } +}); +Object.defineProperty(exports, "ComponentWithMultipleHooksPerLine", { + enumerable: true, + get: function () { + return _ComponentWithMultipleHooksPerLine.Component; + } +}); +Object.defineProperty(exports, "ComponentWithNestedHooks", { + enumerable: true, + get: function () { + return _ComponentWithNestedHooks.Component; + } +}); +Object.defineProperty(exports, "ContainingStringSourceMappingURL", { + enumerable: true, + get: function () { + return _ContainingStringSourceMappingURL.Component; + } +}); +Object.defineProperty(exports, "Example", { + enumerable: true, + get: function () { + return _Example.Component; + } +}); +Object.defineProperty(exports, "InlineRequire", { + enumerable: true, + get: function () { + return _InlineRequire.Component; + } +}); +Object.defineProperty(exports, "useTheme", { + enumerable: true, + get: function () { + return _useTheme.default; + } +}); +exports.ToDoList = void 0; + +var _ComponentUsingHooksIndirectly = require("./ComponentUsingHooksIndirectly"); + +var _ComponentWithCustomHook = require("./ComponentWithCustomHook"); + +var _ComponentWithExternalCustomHooks = require("./ComponentWithExternalCustomHooks"); + +var _ComponentWithMultipleHooksPerLine = require("./ComponentWithMultipleHooksPerLine"); + +var _ComponentWithNestedHooks = require("./ComponentWithNestedHooks"); + +var _ContainingStringSourceMappingURL = require("./ContainingStringSourceMappingURL"); + +var _Example = require("./Example"); + +var _InlineRequire = require("./InlineRequire"); + +var ToDoList = _interopRequireWildcard(require("./ToDoList")); + +exports.ToDoList = ToDoList; + +var _useTheme = _interopRequireDefault(require("./useTheme")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFTQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7OztBQUVBIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIEZhY2Vib29rLCBJbmMuIGFuZCBpdHMgYWZmaWxpYXRlcy5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKiBAZmxvd1xuICovXG5cbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5fSBmcm9tICcuL0NvbXBvbmVudFVzaW5nSG9va3NJbmRpcmVjdGx5JztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhDdXN0b21Ib29rfSBmcm9tICcuL0NvbXBvbmVudFdpdGhDdXN0b21Ib29rJztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzfSBmcm9tICcuL0NvbXBvbmVudFdpdGhFeHRlcm5hbEN1c3RvbUhvb2tzJztcbmV4cG9ydCB7Q29tcG9uZW50IGFzIENvbXBvbmVudFdpdGhNdWx0aXBsZUhvb2tzUGVyTGluZX0gZnJvbSAnLi9Db21wb25lbnRXaXRoTXVsdGlwbGVIb29rc1BlckxpbmUnO1xuZXhwb3J0IHtDb21wb25lbnQgYXMgQ29tcG9uZW50V2l0aE5lc3RlZEhvb2tzfSBmcm9tICcuL0NvbXBvbmVudFdpdGhOZXN0ZWRIb29rcyc7XG5leHBvcnQge0NvbXBvbmVudCBhcyBDb250YWluaW5nU3RyaW5nU291cmNlTWFwcGluZ1VSTH0gZnJvbSAnLi9Db250YWluaW5nU3RyaW5nU291cmNlTWFwcGluZ1VSTCc7XG5leHBvcnQge0NvbXBvbmVudCBhcyBFeGFtcGxlfSBmcm9tICcuL0V4YW1wbGUnO1xuZXhwb3J0IHtDb21wb25lbnQgYXMgSW5saW5lUmVxdWlyZX0gZnJvbSAnLi9JbmxpbmVSZXF1aXJlJztcbmltcG9ydCAqIGFzIFRvRG9MaXN0IGZyb20gJy4vVG9Eb0xpc3QnO1xuZXhwb3J0IHtUb0RvTGlzdH07XG5leHBvcnQge2RlZmF1bHQgYXMgdXNlVGhlbWV9IGZyb20gJy4vdXNlVGhlbWUnO1xuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiJdLCJtYXBwaW5ncyI6IkNBQUQifV1dfQ== \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/useTheme.js b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/useTheme.js new file mode 100644 index 00000000000000..44d321d6a6b143 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/inline/react-sources-extended/useTheme.js @@ -0,0 +1,27 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = useTheme; +exports.ThemeContext = void 0; + +var _react = require("react"); + +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ +const ThemeContext = /*#__PURE__*/(0, _react.createContext)('bright'); +exports.ThemeContext = ThemeContext; + +function useTheme() { + const theme = (0, _react.useContext)(ThemeContext); + (0, _react.useDebugValue)(theme); + return theme; +} +//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInVzZVRoZW1lLmpzIl0sIm5hbWVzIjpbIlRoZW1lQ29udGV4dCIsInVzZVRoZW1lIiwidGhlbWUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBU0E7O0FBVEE7Ozs7Ozs7O0FBV08sTUFBTUEsWUFBWSxnQkFBRywwQkFBYyxRQUFkLENBQXJCOzs7QUFFUSxTQUFTQyxRQUFULEdBQW9CO0FBQ2pDLFFBQU1DLEtBQUssR0FBRyx1QkFBV0YsWUFBWCxDQUFkO0FBQ0EsNEJBQWNFLEtBQWQ7QUFDQSxTQUFPQSxLQUFQO0FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgRmFjZWJvb2ssIEluYy4gYW5kIGl0cyBhZmZpbGlhdGVzLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqIEBmbG93XG4gKi9cblxuaW1wb3J0IHtjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0LCB1c2VEZWJ1Z1ZhbHVlfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBjb25zdCBUaGVtZUNvbnRleHQgPSBjcmVhdGVDb250ZXh0KCdicmlnaHQnKTtcblxuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gdXNlVGhlbWUoKSB7XG4gIGNvbnN0IHRoZW1lID0gdXNlQ29udGV4dChUaGVtZUNvbnRleHQpO1xuICB1c2VEZWJ1Z1ZhbHVlKHRoZW1lKTtcbiAgcmV0dXJuIHRoZW1lO1xufVxuIl0sInhfcmVhY3Rfc291cmNlcyI6W1t7Im5hbWVzIjpbIjxuby1ob29rPiIsInRoZW1lIl0sIm1hcHBpbmdzIjoiQ0FBRDtlZ0JDQSxBd0JEQSJ9XV19 \ No newline at end of file diff --git a/packages/react-devtools-extensions/src/__tests__/generateHookMap-test.js b/packages/react-devtools-extensions/src/__tests__/generateHookMap-test.js new file mode 100644 index 00000000000000..88393b0f1db24d --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/generateHookMap-test.js @@ -0,0 +1,212 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +import {parse} from '@babel/parser'; +import {generateEncodedHookMap, generateHookMap} from '../generateHookMap'; + +function expectHookMapToEqual(actual, expected) { + expect(actual.names).toEqual(expected.names); + + const formattedMappings = []; + actual.mappings.forEach(lines => { + lines.forEach(segment => { + const name = actual.names[segment[2]]; + if (name == null) { + throw new Error(`Expected to find name at position ${segment[2]}`); + } + formattedMappings.push(`${name} from ${segment[0]}:${segment[1]}`); + }); + }); + expect(formattedMappings).toEqual(expected.mappings); +} + +describe('generateHookMap', () => { + it('should parse names for built-in hooks', () => { + const code = ` +import {useState, useContext, useMemo, useReducer} from 'react'; + +export function Component() { + const a = useMemo(() => A); + const [b, setB] = useState(0); + + // prettier-ignore + const c = useContext(A), d = useContext(B); // eslint-disable-line one-var + + const [e, dispatch] = useReducer(reducer, initialState); + const f = useRef(null) + + return a + b + c + d + e + f.current; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'a', 'b', 'c', 'd', 'e', 'f'], + mappings: [ + ' from 1:0', + 'a from 5:12', + ' from 5:28', + 'b from 6:20', + ' from 6:31', + 'c from 9:12', + ' from 9:25', + 'd from 9:31', + ' from 9:44', + 'e from 11:24', + ' from 11:57', + 'f from 12:12', + ' from 12:24', + ], + }); + + const encodedHookMap = generateEncodedHookMap(parsed); + expect(encodedHookMap).toMatchInlineSnapshot(` + Object { + "mappings": "CAAD;KYCA,AgBDA;MREA,AWFA;SnBGA,AaHA,AMIA,AaJA;WpBKA,AiCLA;Y7CMA,AYNA", + "names": Array [ + "", + "a", + "b", + "c", + "d", + "e", + "f", + ], + } + `); + }); + + it('should parse names for custom hooks', () => { + const code = ` +import useTheme from 'useTheme'; +import useValue from 'useValue'; + +export function Component() { + const theme = useTheme(); + const [val, setVal] = useValue(); + + return theme; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'theme', 'val'], + mappings: [ + ' from 1:0', + 'theme from 6:16', + ' from 6:26', + 'val from 7:24', + ' from 7:34', + ], + }); + + const encodedHookMap = generateEncodedHookMap(parsed); + expect(encodedHookMap).toMatchInlineSnapshot(` + Object { + "mappings": "CAAD;MgBCA,AUDA;OFEA,AUFA", + "names": Array [ + "", + "theme", + "val", + ], + } + `); + }); + + it('should parse names for nested hook calls', () => { + const code = ` +import {useMemo, useState} from 'react'; + +export function Component() { + const InnerComponent = useMemo(() => () => { + const [state, setState] = useState(0); + + return state; + }); + + return null; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'InnerComponent', 'state'], + mappings: [ + ' from 1:0', + 'InnerComponent from 5:25', + 'state from 6:30', + 'InnerComponent from 6:41', + ' from 9:4', + ], + }); + + const encodedHookMap = generateEncodedHookMap(parsed); + expect(encodedHookMap).toMatchInlineSnapshot(` + Object { + "mappings": "CAAD;KyBCA;MKCA,AWDA;SrCDA", + "names": Array [ + "", + "InnerComponent", + "state", + ], + } + `); + }); + + it('should skip names for non-nameable hooks', () => { + const code = ` +import useTheme from 'useTheme'; +import useValue from 'useValue'; + +export function Component() { + const [val, setVal] = useState(0); + + useEffect(() => { + // ... + }); + + useLayoutEffect(() => { + // ... + }); + + return val; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'val'], + mappings: [' from 1:0', 'val from 6:24', ' from 6:35'], + }); + + const encodedHookMap = generateEncodedHookMap(parsed); + expect(encodedHookMap).toMatchInlineSnapshot(` + Object { + "mappings": "CAAD;MwBCA,AWDA", + "names": Array [ + "", + "val", + ], + } + `); + }); +}); diff --git a/packages/react-devtools-extensions/src/__tests__/getHookNameForLocation-test.js b/packages/react-devtools-extensions/src/__tests__/getHookNameForLocation-test.js new file mode 100644 index 00000000000000..7b215fc6de7870 --- /dev/null +++ b/packages/react-devtools-extensions/src/__tests__/getHookNameForLocation-test.js @@ -0,0 +1,264 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +import {parse} from '@babel/parser'; +import {generateHookMap} from '../generateHookMap'; +import {getHookNameForLocation} from '../getHookNameForLocation'; + +function expectHookMapToEqual(actual, expected) { + expect(actual.names).toEqual(expected.names); + + const formattedMappings = []; + actual.mappings.forEach(lines => { + lines.forEach(segment => { + const name = actual.names[segment[2]]; + if (name == null) { + throw new Error(`Expected to find name at position ${segment[2]}`); + } + formattedMappings.push(`${name} from ${segment[0]}:${segment[1]}`); + }); + }); + expect(formattedMappings).toEqual(expected.mappings); +} + +describe('generateHookMap', () => { + it('should parse names for built-in hooks', () => { + const code = ` +import {useState, useContext, useMemo, useReducer} from 'react'; + +export function Component() { + const a = useMemo(() => A); + const [b, setB] = useState(0); + + // prettier-ignore + const c = useContext(A), d = useContext(B); // eslint-disable-line one-var + + const [e, dispatch] = useReducer(reducer, initialState); + const f = useRef(null) + + return a + b + c + d + e + f.current; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'a', 'b', 'c', 'd', 'e', 'f'], + mappings: [ + ' from 1:0', + 'a from 5:12', + ' from 5:28', + 'b from 6:20', + ' from 6:31', + 'c from 9:12', + ' from 9:25', + 'd from 9:31', + ' from 9:44', + 'e from 11:24', + ' from 11:57', + 'f from 12:12', + ' from 12:24', + ], + }); + + expect(getHookNameForLocation({line: 1, column: 0}, hookMap)).toEqual(null); + expect(getHookNameForLocation({line: 2, column: 25}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 5, column: 12}, hookMap)).toEqual('a'); + expect(getHookNameForLocation({line: 5, column: 13}, hookMap)).toEqual('a'); + expect(getHookNameForLocation({line: 5, column: 28}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 5, column: 29}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 6, column: 20}, hookMap)).toEqual('b'); + expect(getHookNameForLocation({line: 6, column: 30}, hookMap)).toEqual('b'); + expect(getHookNameForLocation({line: 6, column: 31}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 7, column: 31}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 8, column: 20}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 9, column: 12}, hookMap)).toEqual('c'); + expect(getHookNameForLocation({line: 9, column: 13}, hookMap)).toEqual('c'); + expect(getHookNameForLocation({line: 9, column: 25}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 9, column: 26}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 9, column: 31}, hookMap)).toEqual('d'); + expect(getHookNameForLocation({line: 9, column: 32}, hookMap)).toEqual('d'); + expect(getHookNameForLocation({line: 9, column: 44}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 9, column: 45}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 11, column: 24}, hookMap)).toEqual( + 'e', + ); + expect(getHookNameForLocation({line: 11, column: 56}, hookMap)).toEqual( + 'e', + ); + expect(getHookNameForLocation({line: 11, column: 57}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 11, column: 58}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 12, column: 12}, hookMap)).toEqual( + 'f', + ); + expect(getHookNameForLocation({line: 12, column: 23}, hookMap)).toEqual( + 'f', + ); + expect(getHookNameForLocation({line: 12, column: 24}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 100, column: 50}, hookMap)).toEqual( + null, + ); + }); + + it('should parse names for custom hooks', () => { + const code = ` +import useTheme from 'useTheme'; +import useValue from 'useValue'; + +export function Component() { + const theme = useTheme(); + const [val, setVal] = useValue(); + + return theme; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'theme', 'val'], + mappings: [ + ' from 1:0', + 'theme from 6:16', + ' from 6:26', + 'val from 7:24', + ' from 7:34', + ], + }); + + expect(getHookNameForLocation({line: 1, column: 0}, hookMap)).toEqual(null); + expect(getHookNameForLocation({line: 6, column: 16}, hookMap)).toEqual( + 'theme', + ); + expect(getHookNameForLocation({line: 6, column: 26}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 7, column: 24}, hookMap)).toEqual( + 'val', + ); + expect(getHookNameForLocation({line: 7, column: 34}, hookMap)).toEqual( + null, + ); + }); + + it('should parse names for nested hook calls', () => { + const code = ` +import {useMemo, useState} from 'react'; + +export function Component() { + const InnerComponent = useMemo(() => () => { + const [state, setState] = useState(0); + + return state; + }); + + return null; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'InnerComponent', 'state'], + mappings: [ + ' from 1:0', + 'InnerComponent from 5:25', + 'state from 6:30', + 'InnerComponent from 6:41', + ' from 9:4', + ], + }); + + expect(getHookNameForLocation({line: 1, column: 0}, hookMap)).toEqual(null); + expect(getHookNameForLocation({line: 5, column: 25}, hookMap)).toEqual( + 'InnerComponent', + ); + expect(getHookNameForLocation({line: 6, column: 30}, hookMap)).toEqual( + 'state', + ); + expect(getHookNameForLocation({line: 6, column: 40}, hookMap)).toEqual( + 'state', + ); + expect(getHookNameForLocation({line: 6, column: 41}, hookMap)).toEqual( + 'InnerComponent', + ); + expect(getHookNameForLocation({line: 9, column: 4}, hookMap)).toEqual(null); + }); + + it('should skip names for non-nameable hooks', () => { + const code = ` +import useTheme from 'useTheme'; +import useValue from 'useValue'; + +export function Component() { + const [val, setVal] = useState(0); + + useEffect(() => { + // ... + }); + + useLayoutEffect(() => { + // ... + }); + + return val; +}`; + + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const hookMap = generateHookMap(parsed); + expectHookMapToEqual(hookMap, { + names: ['', 'val'], + mappings: [' from 1:0', 'val from 6:24', ' from 6:35'], + }); + + expect(getHookNameForLocation({line: 1, column: 0}, hookMap)).toEqual(null); + expect(getHookNameForLocation({line: 6, column: 24}, hookMap)).toEqual( + 'val', + ); + expect(getHookNameForLocation({line: 6, column: 35}, hookMap)).toEqual( + null, + ); + expect(getHookNameForLocation({line: 8, column: 2}, hookMap)).toEqual(null); + }); +}); diff --git a/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js b/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js index 110eee269205fe..52032b37231035 100644 --- a/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js +++ b/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js @@ -421,6 +421,298 @@ describe('parseHookNames', () => { ); // simulated Webpack 'cheap-module-source-map' }); }); + + describe('extended source maps', () => { + let parseMock; + + beforeEach(() => { + parseMock = jest.fn(); + jest.mock('@babel/parser', () => { + const actual = jest.requireActual('@babel/parser'); + const parse = (...args) => { + parseMock(); + return actual.parse(...args); + }; + return { + parse, + ...actual, + }; + }); + }); + + it('should work for simple components', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'count', // useState + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test('./__source__/Example'); // original source (uncompiled) + await test( + './__source__/__compiled__/inline/fb-sources-extended/Example', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/Example', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/Example', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/Example', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work with more complex files and components', async () => { + async function test(path, name = undefined) { + const components = name != null ? require(path)[name] : require(path); + + let hookNames = await getHookNamesForComponent(components.List); + expectHookNamesToEqual(hookNames, [ + 'newItemText', // useState + 'items', // useState + 'uid', // useState + 'handleClick', // useCallback + 'handleKeyPress', // useCallback + 'handleChange', // useCallback + 'removeItem', // useCallback + 'toggleItem', // useCallback + ]); + + hookNames = await getHookNamesForComponent(components.ListItem, { + item: {}, + }); + expectHookNamesToEqual(hookNames, [ + 'handleDelete', // useCallback + 'handleToggle', // useCallback + ]); + + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test('./__source__/ToDoList'); // original source (uncompiled) + await test( + './__source__/__compiled__/inline/fb-sources-extended/ToDoList', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ToDoList', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ToDoList', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ToDoList', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work for custom hook', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'count', // useState() + 'isDarkMode', // useIsDarkMode() + 'isDarkMode', // useIsDarkMode -> useState() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test('./__source__/ComponentWithCustomHook'); // original source (uncompiled) + await test( + './__source__/__compiled__/inline/fb-sources-extended/ComponentWithCustomHook', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ComponentWithCustomHook', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work when code is using hooks indirectly', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'count', // useState() + 'darkMode', // useDarkMode() + 'isDarkMode', // useState() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test( + './__source__/__compiled__/inline/fb-sources-extended/ComponentUsingHooksIndirectly', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ComponentUsingHooksIndirectly', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work when code is using nested hooks', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + let InnerComponent; + const hookNames = await getHookNamesForComponent(Component, { + callback: innerComponent => { + InnerComponent = innerComponent; + }, + }); + const innerHookNames = await getHookNamesForComponent(InnerComponent); + expectHookNamesToEqual(hookNames, [ + 'InnerComponent', // useMemo() + ]); + expectHookNamesToEqual(innerHookNames, [ + 'state', // useState() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test( + './__source__/__compiled__/inline/fb-sources-extended/ComponentWithNestedHooks', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ComponentWithNestedHooks', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work for external hooks', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'theme', // useTheme() + 'theme', // useContext() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + // We can't test the uncompiled source here, because it either needs to get transformed, + // which would break the source mapping, or the import statements will fail. + + await test( + './__source__/__compiled__/inline/fb-sources-extended/ComponentWithExternalCustomHooks', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ComponentWithExternalCustomHooks', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should work when multiple hooks are on a line', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'a', // useContext() + 'b', // useContext() + 'c', // useContext() + 'd', // useContext() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test( + './__source__/__compiled__/inline/fb-sources-extended/ComponentWithMultipleHooksPerLine', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ComponentWithMultipleHooksPerLine', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + // TODO Inline require (e.g. require("react").useState()) isn't supported yet. + // Maybe this isn't an important use case to support, + // since inline requires are most likely to exist in compiled source (if at all). + xit('should work for inline requires', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'count', // useState() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + await test('./__source__/InlineRequire'); // original source (uncompiled) + await test( + './__source__/__compiled__/inline/fb-sources-extended/InlineRequire', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/InlineRequire', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/InlineRequire', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/InlineRequire', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + + it('should support sources that contain the string "sourceMappingURL="', async () => { + async function test(path, name = 'Component') { + const Component = require(path)[name]; + const hookNames = await getHookNamesForComponent(Component); + expectHookNamesToEqual(hookNames, [ + 'count', // useState() + ]); + expect(parseMock).toHaveBeenCalledTimes(0); + } + + // We expect the inline sourceMappingURL to be invalid in this case; mute the warning. + console.warn = () => {}; + + await test('./__source__/ContainingStringSourceMappingURL'); // original source (uncompiled) + await test( + './__source__/__compiled__/inline/fb-sources-extended/ContainingStringSourceMappingURL', + ); // x_fb_sources extended inline source map + await test( + './__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL', + ); // x_fb_sources extended external source map + await test( + './__source__/__compiled__/inline/react-sources-extended/ContainingStringSourceMappingURL', + ); // x_react_sources extended inline source map + await test( + './__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL', + ); // x_react_sources extended external source map + // TODO test no-columns and bundle cases with extended source maps + }); + }); }); describe('parseHookNames worker', () => { diff --git a/packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js b/packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js index 6906abf52c927e..6e8b8bdff596ec 100644 --- a/packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js +++ b/packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js @@ -15,6 +15,8 @@ const commonjs = require('rollup-plugin-commonjs'); const jsx = require('acorn-jsx'); const rollupResolve = require('rollup-plugin-node-resolve'); const {encode, decode} = require('sourcemap-codec'); +const {generateEncodedHookMap} = require('../generateHookMap'); +const {parse} = require('@babel/parser'); const sourceDir = resolve(__dirname, '__source__'); const buildRoot = resolve(sourceDir, '__compiled__'); @@ -22,6 +24,19 @@ const externalDir = resolve(buildRoot, 'external'); const inlineDir = resolve(buildRoot, 'inline'); const bundleDir = resolve(buildRoot, 'bundle'); const noColumnsDir = resolve(buildRoot, 'no-columns'); +const inlineFbSourcesExtendedDir = resolve(inlineDir, 'fb-sources-extended'); +const externalFbSourcesExtendedDir = resolve( + externalDir, + 'fb-sources-extended', +); +const inlineReactSourcesExtendedDir = resolve( + inlineDir, + 'react-sources-extended', +); +const externalReactSourcesExtendedDir = resolve( + externalDir, + 'react-sources-extended', +); // Remove previous builds emptyDirSync(buildRoot); @@ -29,6 +44,10 @@ mkdirSync(externalDir); mkdirSync(inlineDir); mkdirSync(bundleDir); mkdirSync(noColumnsDir); +mkdirSync(inlineFbSourcesExtendedDir); +mkdirSync(externalFbSourcesExtendedDir); +mkdirSync(inlineReactSourcesExtendedDir); +mkdirSync(externalReactSourcesExtendedDir); function compile(fileName) { const code = readFileSync(resolve(sourceDir, fileName), 'utf8'); @@ -63,6 +82,15 @@ function compile(fileName) { 'utf8', ); + // Generate compiled output with inline base64 source maps + writeFileSync( + resolve(inlineDir, fileName), + transformed.code + + '\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,' + + btoa(JSON.stringify(sourceMap)), + 'utf8', + ); + // Strip column numbers from source map to mimic Webpack 'cheap-module-source-map' // The mappings field represents a list of integer arrays. // Each array defines a pair of corresponding file locations, one in the generated code and one in the original. @@ -82,16 +110,7 @@ function compile(fileName) { ); const encodedMappings = encode(decodedMappings); - // Generate compiled output with external inline base64 source maps - writeFileSync( - resolve(inlineDir, fileName), - transformed.code + - '\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,' + - btoa(JSON.stringify(sourceMap)), - 'utf8', - ); - - // Generate compiled output with external inline base64 source maps without column numbers + // Generate compiled output with inline base64 source maps without column numbers writeFileSync( resolve(noColumnsDir, fileName), transformed.code + @@ -104,6 +123,65 @@ function compile(fileName) { ), 'utf8', ); + + // Generate compiled output with an extended sourcemap that + // includes a map of hook names. + const parsed = parse(code, { + sourceType: 'module', + plugins: ['jsx', 'flow'], + }); + const encodedHookMap = generateEncodedHookMap(parsed); + const fbSourcesExtendedSourceMap = { + ...sourceMap, + // When using the x_fb_sources extension field, the first item + // for a given source is reserved for the Function Map, and the + // Hook Map is added as the second item. + x_fb_sources: [[null, encodedHookMap]], + }; + const reactSourcesExtendedSourceMap = { + ...sourceMap, + // When using the x_react_sources extension field, the first item + // for a given source is reserved for the Hook Map. + x_react_sources: [[encodedHookMap]], + }; + + // Using the x_fb_sources field + writeFileSync( + resolve(inlineFbSourcesExtendedDir, fileName), + transformed.code + + '\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,' + + btoa(JSON.stringify(fbSourcesExtendedSourceMap)), + 'utf8', + ); + writeFileSync( + resolve(externalFbSourcesExtendedDir, fileName), + transformed.code + `\n//# sourceMappingURL=${fileName}.map`, + 'utf8', + ); + writeFileSync( + resolve(externalFbSourcesExtendedDir, `${fileName}.map`), + JSON.stringify(fbSourcesExtendedSourceMap), + 'utf8', + ); + + // Using the x_react_sources field + writeFileSync( + resolve(inlineReactSourcesExtendedDir, fileName), + transformed.code + + '\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,' + + btoa(JSON.stringify(reactSourcesExtendedSourceMap)), + 'utf8', + ); + writeFileSync( + resolve(externalReactSourcesExtendedDir, fileName), + transformed.code + `\n//# sourceMappingURL=${fileName}.map`, + 'utf8', + ); + writeFileSync( + resolve(externalReactSourcesExtendedDir, `${fileName}.map`), + JSON.stringify(reactSourcesExtendedSourceMap), + 'utf8', + ); } async function bundle() { diff --git a/packages/react-devtools-extensions/src/astUtils.js b/packages/react-devtools-extensions/src/astUtils.js index 64aaf1fb0371d8..818ec578a87c5d 100644 --- a/packages/react-devtools-extensions/src/astUtils.js +++ b/packages/react-devtools-extensions/src/astUtils.js @@ -12,6 +12,11 @@ import {File} from '@babel/types'; import type {HooksNode} from 'react-debug-tools/src/ReactDebugHooks'; +export type Position = {| + line: number, + column: number, +|}; + export type SourceConsumer = any; export type SourceFileASTWithHookDetails = { @@ -20,12 +25,16 @@ export type SourceFileASTWithHookDetails = { source: string, }; +export const NO_HOOK_NAME = ''; + const AST_NODE_TYPES = Object.freeze({ + PROGRAM: 'Program', CALL_EXPRESSION: 'CallExpression', MEMBER_EXPRESSION: 'MemberExpression', ARRAY_PATTERN: 'ArrayPattern', IDENTIFIER: 'Identifier', NUMERIC_LITERAL: 'NumericLiteral', + VARIABLE_DECLARATOR: 'VariableDeclarator', }); // Check if line number obtained from source map and the line number in hook node match @@ -51,7 +60,6 @@ function checkNodeLocation( // // For more info see https://github.com/facebook/react/pull/21833#discussion_r666831276 column -= 1; - if ( (line === start.line && column < start.column) || (line === end.line && column > end.column) @@ -284,13 +292,209 @@ function getPotentialHookDeclarationsFromAST(sourceAST: File): NodePath[] { return potentialHooksFound; } +/** + * This function traverses the sourceAST and returns a mapping + * that maps locations in the source code to their corresponding + * Hook name, if there is a relevant Hook name for that location. + * + * A location in the source code is represented by line and column + * numbers as a Position object: { line, column }. + * - line is 1-indexed. + * - column is 0-indexed. + * + * A Hook name will be assigned to a Hook CallExpression if the + * CallExpression is for a variable declaration (i.e. it returns + * a value that is assigned to a variable), and if we can reliably + * infer the correct name to use (see comments in the function body + * for more details). + * + * The returned mapping is an array of locations and their assigned + * names, sorted by location. Specifically, each entry in the array + * contains a `name` and a `start` Position. The `name` of a given + * entry is the "assigned" name in the source code until the `start` + * of the **next** entry. This means that given the mapping, in order + * to determine the Hook name assigned for a given source location, we + * need to find the adjacent entries that most closely contain the given + * location. + * + * E.g. for the following code: + * + * 1| function Component() { + * 2| const [state, setState] = useState(0); + * 3| ^---------^ -> Cols 28 - 38: Hook CallExpression + * 4| + * 5| useEffect(() => {...}); -> call ignored since not declaring a variable + * 6| + * 7| return (...); + * 8| } + * + * The returned "mapping" would be something like: + * [ + * {name: '', start: {line: 1, column: 0}}, + * {name: 'state', start: {line: 2, column: 28}}, + * {name: '', start: {line: 2, column: 38}}, + * ] + * + * Where the Hook name `state` (corresponding to the `state` variable) + * is assigned to the location in the code for the CallExpression + * representing the call to `useState(0)` (line 2, col 28-38). + */ +export function getHookNamesMappingFromAST( + sourceAST: File, +): $ReadOnlyArray<{|name: string, start: Position|}> { + const hookStack = []; + const hookNames = []; + const pushFrame = (name: string, node: Node) => { + const nameInfo = {name, start: {...node.loc.start}}; + hookStack.unshift(nameInfo); + hookNames.push(nameInfo); + }; + const popFrame = (node: Node) => { + hookStack.shift(); + const top = hookStack[0]; + if (top != null) { + hookNames.push({name: top.name, start: {...node.loc.end}}); + } + }; + + traverse(sourceAST, { + [AST_NODE_TYPES.PROGRAM]: { + enter(path) { + pushFrame(NO_HOOK_NAME, path.node); + }, + exit(path) { + popFrame(path.node); + }, + }, + [AST_NODE_TYPES.VARIABLE_DECLARATOR]: { + enter(path) { + // Check if this variable declaration corresponds to a variable + // declared by calling a Hook. + if (isConfirmedHookDeclaration(path)) { + const hookDeclaredVariableName = getHookVariableName(path); + if (!hookDeclaredVariableName) { + return; + } + const callExpressionNode = assertCallExpression(path.node.init); + + // Check if this variable declaration corresponds to a call to a + // built-in Hook that returns a tuple (useState, useReducer, + // useTransition). + // If it doesn't, we immediately use the declared variable name + // as the Hook name. We do this because for any other Hooks that + // aren't the built-in Hooks that return a tuple, we can't reliably + // extract a Hook name from other variable declartions derived from + // this one, since we don't know which of the declared variables + // are the relevant ones to track and show in dev tools. + if (!isBuiltInHookThatReturnsTuple(path)) { + pushFrame(hookDeclaredVariableName, callExpressionNode); + return; + } + + // Check if the variable declared by the Hook call is referenced + // anywhere else in the code. If not, we immediately use the + // declared variable name as the Hook name. + const referencePaths = + hookDeclaredVariableName != null + ? path.scope.bindings[hookDeclaredVariableName]?.referencePaths + : null; + if (referencePaths == null) { + pushFrame(hookDeclaredVariableName, callExpressionNode); + return; + } + + // Check each reference to the variable declared by the Hook call, + // and for each, we do the following: + let declaredVariableName = null; + for (let i = 0; i <= referencePaths.length; i++) { + const referencePath = referencePaths[i]; + if (declaredVariableName != null) { + break; + } + + // 1. Check if the reference is contained within a VariableDeclarator + // Node. This will allow us to determine if the variable declared by + // the Hook call is being used to declare other variables. + let variableDeclaratorPath = referencePath; + while ( + variableDeclaratorPath != null && + variableDeclaratorPath.node.type !== + AST_NODE_TYPES.VARIABLE_DECLARATOR + ) { + variableDeclaratorPath = variableDeclaratorPath.parentPath; + } + + // 2. If we find a VariableDeclarator containing the + // referenced variable, we extract the Hook name from the new + // variable declaration. + // E.g., a case like the following: + // const countState = useState(0); + // const count = countState[0]; + // const setCount = countState[1] + // Where the reference to `countState` is later referenced + // within a VariableDeclarator, so we can extract `count` as + // the Hook name. + const varDeclInit = variableDeclaratorPath?.node.init; + if (varDeclInit != null) { + switch (varDeclInit.type) { + case AST_NODE_TYPES.MEMBER_EXPRESSION: { + // When encountering a MemberExpression inside the new + // variable declaration, we only want to extract the variable + // name if we're assinging the value of the first member, + // which is handled by `filterMemberWithHookVariableName`. + // E.g. + // const countState = useState(0); + // const count = countState[0]; -> extract the name from this reference + // const setCount = countState[1]; -> ignore this reference + if ( + filterMemberWithHookVariableName(variableDeclaratorPath) + ) { + declaredVariableName = getHookVariableName( + variableDeclaratorPath, + ); + } + break; + } + case AST_NODE_TYPES.IDENTIFIER: { + declaredVariableName = getHookVariableName( + variableDeclaratorPath, + ); + break; + } + default: + break; + } + } + } + + // If we were able to extract a name from the new variable + // declaration, use it as the Hook name. Otherwise, use the + // original declared variable as the variable name. + if (declaredVariableName != null) { + pushFrame(declaredVariableName, callExpressionNode); + } else { + pushFrame(hookDeclaredVariableName, callExpressionNode); + } + } + }, + exit(path) { + if (isConfirmedHookDeclaration(path)) { + const callExpressionNode = assertCallExpression(path.node.init); + popFrame(callExpressionNode); + } + }, + }, + }); + return hookNames; +} + // Check if 'path' contains declaration of the form const X = useState(0); function isConfirmedHookDeclaration(path: NodePath): boolean { - const node = path.node.init; - if (node.type !== AST_NODE_TYPES.CALL_EXPRESSION) { + const nodeInit = path.node.init; + if (nodeInit == null || nodeInit.type !== AST_NODE_TYPES.CALL_EXPRESSION) { return false; } - const callee = node.callee; + const callee = nodeInit.callee; return isHook(callee); } @@ -370,10 +574,12 @@ function isReactFunction(node: Node, functionName: string): boolean { } // Check if 'path' is either State or Reducer hook -function isStateOrReducerHook(path: NodePath): boolean { +function isBuiltInHookThatReturnsTuple(path: NodePath): boolean { const callee = path.node.init.callee; return ( - isReactFunction(callee, 'useState') || isReactFunction(callee, 'useReducer') + isReactFunction(callee, 'useState') || + isReactFunction(callee, 'useReducer') || + isReactFunction(callee, 'useTransition') ); } @@ -394,9 +600,17 @@ function nodeContainsHookVariableName(hookNode: NodePath): boolean { const node = hookNode.node.id; if ( node.type === AST_NODE_TYPES.ARRAY_PATTERN || - (node.type === AST_NODE_TYPES.IDENTIFIER && !isStateOrReducerHook(hookNode)) + (node.type === AST_NODE_TYPES.IDENTIFIER && + !isBuiltInHookThatReturnsTuple(hookNode)) ) { return true; } return false; } + +function assertCallExpression(node: Node): Node { + if (node.type !== AST_NODE_TYPES.CALL_EXPRESSION) { + throw new Error('Expected a CallExpression node for a Hook declaration.'); + } + return node; +} diff --git a/packages/react-devtools-extensions/src/generateHookMap.js b/packages/react-devtools-extensions/src/generateHookMap.js new file mode 100644 index 00000000000000..d57bbb6063854f --- /dev/null +++ b/packages/react-devtools-extensions/src/generateHookMap.js @@ -0,0 +1,123 @@ +/* + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +import {getHookNamesMappingFromAST} from './astUtils'; +import {encode, decode} from 'sourcemap-codec'; +import {File} from '@babel/types'; + +export type HookMap = {| + names: $ReadOnlyArray, + mappings: HookMapMappings, +|}; + +export type EncodedHookMap = {| + names: $ReadOnlyArray, + mappings: string, +|}; + +// See generateHookMap below for more details on formatting +export type HookMapEntry = [ + number, // 1-indexed line number + number, // 0-indexed column number + number, // 0-indexed index into names array + number, // TODO: filler number to support reusing encoding from `sourcemap-codec` (see TODO below) +]; +export type HookMapLine = HookMapEntry[]; +export type HookMapMappings = HookMapLine[]; + +/** + * Given a parsed source code AST, returns a "Hook Map", which is a + * mapping which maps locations in the source code to their to their + * corresponding Hook name, if there is a relevant Hook name for that + * location (see getHookNamesMappingFromAST for details on the + * representation of the mapping). + * + * The format of the Hook Map follows a similar format as the `name` + * and `mappings` fields in the Source Map spec, where `names` is an + * array of strings, and `mappings` contains segments lines, columns, + * and indices into the `names` array. + * + * E.g.: + * { + * names: ["", "state"], + * mappings: [ + * [ -> line 1 + * [1, 0, 0], -> line, col, name index + * ], + * [ -> line 2 + * [2, 5, 1], -> line, col, name index + * [2, 15, 0], -> line, col, name index + * ], + * ], + * } + */ +export function generateHookMap(sourceAST: File): HookMap { + const hookNamesMapping = getHookNamesMappingFromAST(sourceAST); + const namesMap: Map = new Map(); + const names = []; + const mappings = []; + + let currentLine = null; + hookNamesMapping.forEach(({name, start}) => { + let nameIndex = namesMap.get(name); + if (nameIndex == null) { + names.push(name); + nameIndex = names.length - 1; + namesMap.set(name, nameIndex); + } + + // TODO: We add a -1 at the end of the entry so we can later + // encode/decode the mappings by reusing the encode/decode functions + // from the `sourcemap-codec` library. This library expects segments + // of specific sizes (i.e. of size 4) in order to encode them correctly. + // In the future, when we implement our own encoding, we will not + // need this restriction and can remove the -1 at the end. + const entry = [start.line, start.column, nameIndex, -1]; + + if (currentLine !== start.line) { + currentLine = start.line; + mappings.push([entry]); + } else { + const current = mappings[mappings.length - 1]; + current.push(entry); + } + }); + + return {names, mappings}; +} + +/** + * Returns encoded version of a Hook Map that is returned + * by generateHookMap. + * + * **NOTE:** + * TODO: To encode the `mappings` in the Hook Map, we + * reuse the encode function from the `sourcemap-codec` + * library, which means that we are restricted to only + * encoding segments of specific sizes. + * Inside generateHookMap we make sure to build segments + * of size 4. + * In the future, when we implement our own encoding, we will not + * need this restriction and can remove the -1 at the end. + */ +export function generateEncodedHookMap(sourceAST: File): EncodedHookMap { + const hookMap = generateHookMap(sourceAST); + const encoded = encode(hookMap.mappings); + return { + names: hookMap.names, + mappings: encoded, + }; +} + +export function decodeHookMap(encodedHookMap: EncodedHookMap): HookMap { + return { + names: encodedHookMap.names, + mappings: decode(encodedHookMap.mappings), + }; +} diff --git a/packages/react-devtools-extensions/src/getHookNameForLocation.js b/packages/react-devtools-extensions/src/getHookNameForLocation.js new file mode 100644 index 00000000000000..c65c5fb5a80247 --- /dev/null +++ b/packages/react-devtools-extensions/src/getHookNameForLocation.js @@ -0,0 +1,274 @@ +/* + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow strict-local + */ + +import type { + HookMap, + HookMapEntry, + HookMapLine, + HookMapMappings, +} from './generateHookMap'; +import type {Position} from './astUtils'; +import {NO_HOOK_NAME} from './astUtils'; + +/** + * Finds the Hook name assigned to a given location in the source code, + * and a HookMap extracted from an extended source map. + * The given location must correspond to the location in the *original* + * source code (i.e. *not* the generated one). + * + * Note that all locations in the source code are guaranteed to map + * to a name, including a sentinel value that represents a missing + * Hook name: ''. + * + * For more details on the format of the HookMap, see generateHookMap + * and the tests for that function and this function. + */ +export function getHookNameForLocation( + location: Position, + hookMap: HookMap, +): string | null { + const {names, mappings} = hookMap; + + // The HookMap mappings are grouped by lines, so first we look up + // which line of mappings covers the target location. + // Note that we expect to find a line since all the locations in the + // source code are guaranteed to map to a name, including a '' + // name. + const foundLine = binSearch(location, mappings, compareLinePositions); + if (foundLine == null) { + throw new Error( + `Expected to find a line in the HookMap that covers the target location at line: ${location.line}, column: ${location.column}`, + ); + } + + let foundEntry; + const foundLineNumber = getLineNumberFromLine(foundLine); + // The line found in the mappings will never be larger than the target + // line, and vice-versa, so if the target line doesn't match the found + // line, we immediately know that it must correspond to the last mapping + // entry for that line. + if (foundLineNumber !== location.line) { + foundEntry = foundLine[foundLine.length - 1]; + } else { + foundEntry = binSearch(location, foundLine, compareColumnPositions); + } + + if (foundEntry == null) { + throw new Error( + `Expected to find a mapping in the HookMap that covers the target location at line: ${location.line}, column: ${location.column}`, + ); + } + + const foundNameIndex = getHookNameIndexFromEntry(foundEntry); + if (foundNameIndex == null) { + throw new Error( + `Expected to find a name index in the HookMap that covers the target location at line: ${location.line}, column: ${location.column}`, + ); + } + const foundName = names[foundNameIndex]; + if (foundName == null) { + throw new Error( + `Expected to find a name in the HookMap that covers the target location at line: ${location.line}, column: ${location.column}`, + ); + } + + if (foundName === NO_HOOK_NAME) { + return null; + } + return foundName; +} + +function binSearch( + location: Position, + items: T[], + compare: ( + location: Position, + items: T[], + index: number, + ) => {|index: number | null, direction: number|}, +): T | null { + let count = items.length; + let index = 0; + let firstElementIndex = 0; + let step; + + while (count > 0) { + index = firstElementIndex; + step = Math.floor(count / 2); + index += step; + + const comparison = compare(location, items, index); + if (comparison.direction === 0) { + if (comparison.index == null) { + throw new Error('Expected an index when matching element is found.'); + } + firstElementIndex = comparison.index; + break; + } + + if (comparison.direction > 0) { + index++; + firstElementIndex = index; + count -= step + 1; + } else { + count = step; + } + } + + return firstElementIndex != null ? items[firstElementIndex] : null; +} + +/** + * Compares the target line location to the current location + * given by the provided index. + * + * If the target line location matches the current location, returns + * the index of the matching line in the mappings. In order for a line + * to match, the target line must match the line exactly, or be within + * the line range of the current line entries and the adjacent line + * entries. + * + * If the line doesn't match, returns the search direction for the + * next step in the binary search. + */ +function compareLinePositions( + location: Position, + mappings: HookMapMappings, + index: number, +): {|index: number | null, direction: number|} { + const startIndex = index; + const start = mappings[startIndex]; + if (start == null) { + throw new Error(`Unexpected line missing in HookMap at index ${index}.`); + } + const startLine = getLineNumberFromLine(start); + + let endLine; + let endIndex = index + 1; + const end = mappings[endIndex]; + if (end != null) { + endLine = getLineNumberFromLine(end); + } else { + endIndex = startIndex; + endLine = startLine; + } + + // When the line matches exactly, return the matching index + if (startLine === location.line) { + return {index: startIndex, direction: 0}; + } + if (endLine === location.line) { + return {index: endIndex, direction: 0}; + } + + // If we're at the end of the mappings, and the target line is greater + // than the current line, then this final line must cover the + // target location, so we return it. + if (location.line > endLine && end == null) { + return {index: endIndex, direction: 0}; + } + + // If the location is within the current line and the adjacent one, + // we know that the target location must be covered by the current line. + if (startLine < location.line && location.line < endLine) { + return {index: startIndex, direction: 0}; + } + + // Otherwise, return the next direction in the search. + return {index: null, direction: location.line - startLine}; +} + +/** + * Compares the target column location to the current location + * given by the provided index. + * + * If the target column location matches the current location, returns + * the index of the matching entry in the mappings. In order for a column + * to match, the target column must match the column exactly, or be within + * the column range of the current entry and the adjacent entry. + * + * If the column doesn't match, returns the search direction for the + * next step in the binary search. + */ +function compareColumnPositions( + location: Position, + line: HookMapLine, + index: number, +): {|index: number | null, direction: number|} { + const startIndex = index; + const start = line[index]; + if (start == null) { + throw new Error( + `Unexpected mapping missing in HookMap line at index ${index}.`, + ); + } + const startColumn = getColumnNumberFromEntry(start); + + let endColumn; + let endIndex = index + 1; + const end = line[endIndex]; + if (end != null) { + endColumn = getColumnNumberFromEntry(end); + } else { + endIndex = startIndex; + endColumn = startColumn; + } + + // When the column matches exactly, return the matching index + if (startColumn === location.column) { + return {index: startIndex, direction: 0}; + } + if (endColumn === location.column) { + return {index: endIndex, direction: 0}; + } + + // If we're at the end of the entries for this line, and the target + // column is greater than the current column, then this final entry + // must cover the target location, so we return it. + if (location.column > endColumn && end == null) { + return {index: endIndex, direction: 0}; + } + + // If the location is within the current column and the adjacent one, + // we know that the target location must be covered by the current entry. + if (startColumn < location.column && location.column < endColumn) { + return {index: startIndex, direction: 0}; + } + + // Otherwise, return the next direction in the search. + return {index: null, direction: location.column - startColumn}; +} + +function getLineNumberFromLine(line: HookMapLine): number { + return getLineNumberFromEntry(line[0]); +} + +function getLineNumberFromEntry(entry: HookMapEntry): number { + const lineNumber = entry[0]; + if (lineNumber == null) { + throw new Error('Unexpected line number missing in entry in HookMap'); + } + return lineNumber; +} + +function getColumnNumberFromEntry(entry: HookMapEntry): number { + const columnNumber = entry[1]; + if (columnNumber == null) { + throw new Error('Unexpected column number missing in entry in HookMap'); + } + return columnNumber; +} + +function getHookNameIndexFromEntry(entry: HookMapEntry): number { + const hookNameIndex = entry[2]; + if (hookNameIndex == null) { + throw new Error('Unexpected hook name index missing in entry in HookMap'); + } + return hookNameIndex; +} diff --git a/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js b/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js index 8bae59ce461b4e..78e0b7ef66f250 100644 --- a/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js +++ b/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js @@ -14,7 +14,10 @@ import {getHookName} from '../astUtils'; import {areSourceMapsAppliedToErrors} from '../ErrorTester'; import {__DEBUG__} from 'react-devtools-shared/src/constants'; import {getHookSourceLocationKey} from 'react-devtools-shared/src/hookNamesCache'; +import {decodeHookMap} from '../generateHookMap'; +import {getHookNameForLocation} from '../getHookNameForLocation'; +import type {HookMap} from '../generateHookMap'; import type { HooksNode, HookSource, @@ -26,10 +29,15 @@ import type {SourceConsumer} from '../astUtils'; const SOURCE_MAP_REGEX = / ?sourceMappingURL=([^\s'"]+)/gm; const MAX_SOURCE_LENGTH = 100_000_000; +const REACT_SOURCES_EXTENSION_KEY = 'x_react_sources'; +const FB_SOURCES_EXTENSION_KEY = 'x_fb_sources'; type AST = mixed; type HookSourceData = {| + // Hook map extracted from extended source map + hookMap: HookMap | null, + // Generated by react-debug-tools. hookSource: HookSource, @@ -128,6 +136,7 @@ export async function parseHookNames( const runtimeSourceURL = ((hookSource.fileName: any): string); const hookSourceData: HookSourceData = { + hookMap: null, hookSource, originalSourceAST: null, originalSourceCode: null, @@ -244,12 +253,16 @@ function extractAndLoadSourceMaps( // Hook source might be a URL like "https://4syus.csb.app/src/App.js" // Parsed source map might be a partial path like "src/App.js" - const match = parsed.sources.find( + const sourceIndex = parsed.sources.findIndex( source => source === 'Inline Babel script' || runtimeSourceURL.endsWith(source), ); - if (match) { + if (sourceIndex !== -1) { + const hookMap = extractHookMapFromSourceMap(parsed, sourceIndex); + if (hookMap != null) { + hookSourceData.hookMap = hookMap; + } setPromises.push( new SourceMapConsumer(parsed).then(sourceConsumer => { hookSourceData.sourceConsumer = sourceConsumer; @@ -288,9 +301,22 @@ function extractAndLoadSourceMaps( const fetchPromise = fetchPromises.get(url) || fetchFile(url).then( - sourceMapContents => - new SourceMapConsumer(JSON.parse(sourceMapContents)), - + sourceMapContents => { + const parsed = JSON.parse(sourceMapContents); + const sourceIndex = parsed.sources.findIndex(source => + runtimeSourceURL.endsWith(source), + ); + if (sourceIndex !== -1) { + const hookMap = extractHookMapFromSourceMap( + parsed, + sourceIndex, + ); + if (hookMap != null) { + hookSourceData.hookMap = hookMap; + } + } + return new SourceMapConsumer(parsed); + }, // In this case, we fall back to the assumption that the source has no source map. // This might indicate an (unlikely) edge case that had no source map, // but contained the string "sourceMappingURL". @@ -414,13 +440,24 @@ function findHookNames( return null; } - const name = getHookName( - hook, - hookSourceData.originalSourceAST, - ((hookSourceData.originalSourceCode: any): string), - ((originalSourceLineNumber: any): number), - originalSourceColumnNumber, - ); + let name; + if (hookSourceData.hookMap != null) { + name = getHookNameForLocation( + { + line: originalSourceLineNumber, + column: originalSourceColumnNumber, + }, + hookSourceData.hookMap, + ); + } else { + name = getHookName( + hook, + hookSourceData.originalSourceAST, + ((hookSourceData.originalSourceCode: any): string), + ((originalSourceLineNumber: any): number), + originalSourceColumnNumber, + ); + } if (__DEBUG__) { console.log(`findHookNames() Found name "${name || '-'}"`); @@ -475,6 +512,12 @@ async function parseSourceAST( // Use cached metadata. return; } + if (hookSourceData.hookMap != null) { + // If there's a hook map present from an extended sourcemap then + // we don't need to parse the source files and instead can use the + // hook map to extract hook names. + return; + } const {sourceConsumer} = hookSourceData; const runtimeSourceCode = ((hookSourceData.runtimeSourceCode: any): string); @@ -618,6 +661,29 @@ function updateLruCache( return Promise.resolve(); } +function extractHookMapFromSourceMap( + sourcemap, + sourceIndex: number, +): HookMap | null { + let hookMap; + if (sourcemap.hasOwnProperty(REACT_SOURCES_EXTENSION_KEY)) { + // When using the x_react_sources extension field, the first item + // for a given source is reserved for the Hook Map, which is why + // we look up the index at position 0. + hookMap = sourcemap[REACT_SOURCES_EXTENSION_KEY][sourceIndex][0]; + } else if (sourcemap.hasOwnProperty(FB_SOURCES_EXTENSION_KEY)) { + // When using the x_fb_sources extension field, the first item + // for a given source is reserved for the Function Map, and the + // Hook Map is added as the second item, which is why we look up + // the index at position 1. + hookMap = sourcemap[FB_SOURCES_EXTENSION_KEY][sourceIndex][1]; + } + if (hookMap != null) { + return decodeHookMap(hookMap); + } + return null; +} + export function purgeCachedMetadata(): void { originalURLToMetadataCache.reset(); runtimeURLToMetadataCache.reset(); diff --git a/scripts/flow/config/flowconfig b/scripts/flow/config/flowconfig index 2ace94c2d7cba3..453c8406d061c7 100644 --- a/scripts/flow/config/flowconfig +++ b/scripts/flow/config/flowconfig @@ -43,6 +43,7 @@ untyped-type-import=error server.max_workers=4 esproposal.class_static_fields=enable esproposal.class_instance_fields=enable +esproposal.optional_chaining=enable # Substituted by createFlowConfig.js: %REACT_RENDERER_FLOW_OPTIONS% diff --git a/yarn.lock b/yarn.lock index fbb9f335e6a36d..a5134686016b58 100644 --- a/yarn.lock +++ b/yarn.lock @@ -546,6 +546,18 @@ chalk "^2.0.0" js-tokens "^4.0.0" +"@babel/node@^7.14.7": + version "7.14.7" + resolved "https://registry.yarnpkg.com/@babel/node/-/node-7.14.7.tgz#0090e83e726027ea682240718ca39e4b625b15ad" + integrity sha512-QghINtVgOUCrSpE7z4IXPTGJfRYyjoY7ny5Qz0cuUlsThQv6WSn1xJk217WlEDucPLP2o5HwGXPSkxD4LWOZxQ== + dependencies: + "@babel/register" "^7.14.5" + commander "^4.0.1" + core-js "^3.15.0" + node-environment-flags "^1.0.5" + regenerator-runtime "^0.13.4" + v8flags "^3.1.1" + "@babel/parser@^7.0.0", "@babel/parser@^7.1.0", "@babel/parser@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.8.3.tgz#790874091d2001c9be6ec426c2eed47bc7679081" @@ -561,6 +573,11 @@ resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.12.5.tgz#b4af32ddd473c0bfa643bd7ff0728b8e71b81ea0" integrity sha512-FVM6RZQ0mn2KCf1VUED7KepYeUWoVShczewOCfm3nzoBybaih51h+sYVVGthW9M6lPByEPTQf+xm27PBdlpwmQ== +"@babel/parser@^7.14.8": + version "7.14.8" + resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.14.8.tgz#66fd41666b2d7b840bd5ace7f7416d5ac60208d4" + integrity sha512-syoCQFOoo/fzkWDeM0dLEZi5xqurb5vuyzwIMNZRNun+N/9A4cUZeQaE7dTrB8jGaKuJRBtEOajtnmw0I5hvvA== + "@babel/parser@^7.8.6", "@babel/parser@^7.9.0": version "7.9.4" resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.9.4.tgz#68a35e6b0319bbc014465be43828300113f2f2e8" @@ -1420,6 +1437,17 @@ "@babel/plugin-transform-react-jsx-source" "^7.10.4" "@babel/plugin-transform-react-pure-annotations" "^7.10.4" +"@babel/register@^7.14.5": + version "7.14.5" + resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.14.5.tgz#d0eac615065d9c2f1995842f85d6e56c345f3233" + integrity sha512-TjJpGz/aDjFGWsItRBQMOFTrmTI9tr79CHOK+KIvLeCkbxuOAk2M5QHjvruIMGoo9OuccMh5euplPzc5FjAKGg== + dependencies: + clone-deep "^4.0.1" + find-cache-dir "^2.0.0" + make-dir "^2.1.0" + pirates "^4.0.0" + source-map-support "^0.5.16" + "@babel/runtime-corejs2@^7.2.0": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/runtime-corejs2/-/runtime-corejs2-7.8.3.tgz#b62a61e0c41a90d2d91181fda6de21cecd3a9734" @@ -4701,6 +4729,15 @@ clone-buffer@^1.0.0: resolved "https://registry.yarnpkg.com/clone-buffer/-/clone-buffer-1.0.0.tgz#e3e25b207ac4e701af721e2cb5a16792cac3dc58" integrity sha1-4+JbIHrE5wGvch4staFnksrD3Fg= +clone-deep@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-4.0.1.tgz#c19fd9bdbbf85942b4fd979c84dcf7d5f07c2387" + integrity sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ== + dependencies: + is-plain-object "^2.0.4" + kind-of "^6.0.2" + shallow-clone "^3.0.0" + clone-response@1.0.2, clone-response@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/clone-response/-/clone-response-1.0.2.tgz#d1dc973920314df67fbeb94223b4ee350239e96b" @@ -5066,6 +5103,11 @@ core-js@^2.4.1, core-js@^2.6.5: resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c" integrity sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg== +core-js@^3.15.0: + version "3.16.0" + resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.16.0.tgz#1d46fb33720bc1fa7f90d20431f36a5540858986" + integrity sha512-5+5VxRFmSf97nM8Jr2wzOwLqRo6zphH2aX+7KsAUONObyzakDNq2G/bgbhinxB4PoV9L3aXQYhiDKyIKWd2c8g== + core-js@^3.6.5: version "3.6.5" resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.6.5.tgz#7395dc273af37fb2e50e9bd3d9fe841285231d1a" @@ -11210,6 +11252,14 @@ node-cleanup@^2.1.2: resolved "https://registry.yarnpkg.com/node-cleanup/-/node-cleanup-2.1.2.tgz#7ac19abd297e09a7f72a71545d951b517e4dde2c" integrity sha1-esGavSl+Caf3KnFUXZUbUX5N3iw= +node-environment-flags@^1.0.5: + version "1.0.6" + resolved "https://registry.yarnpkg.com/node-environment-flags/-/node-environment-flags-1.0.6.tgz#a30ac13621f6f7d674260a54dede048c3982c088" + integrity sha512-5Evy2epuL+6TM0lCQGpFIj6KwiEsGh1SrHUhTbNX+sLbBtjidPZFAnVK9y5yU1+h//RitLbRHTIMyxQPtxMdHw== + dependencies: + object.getownpropertydescriptors "^2.0.3" + semver "^5.7.0" + node-fetch@2.6.1: version "2.6.1" resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052" @@ -12353,7 +12403,7 @@ pinpoint@^1.1.0: resolved "https://registry.yarnpkg.com/pinpoint/-/pinpoint-1.1.0.tgz#0cf7757a6977f1bf7f6a32207b709e377388e874" integrity sha1-DPd1eml38b9/ajIge3CeN3OI6HQ= -pirates@^4.0.1: +pirates@^4.0.0, pirates@^4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.1.tgz#643a92caf894566f91b2b986d2c66950a8e2fb87" integrity sha512-WuNqLTbMI3tmfef2TKxlQmAiLHKtFhlsCZnPIpuv2Ow0RDVO8lfy1Opf4NUzlMXLjPl+Men7AuVdX6TA+s+uGA== @@ -13830,7 +13880,7 @@ semver-truncate@^1.1.2: dependencies: semver "^5.3.0" -"semver@2 || 3 || 4 || 5", semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0: +"semver@2 || 3 || 4 || 5", semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0: version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ== @@ -13957,6 +14007,13 @@ sha.js@^2.4.0, sha.js@^2.4.8, sha.js@~2.4.4: inherits "^2.0.1" safe-buffer "^5.0.1" +shallow-clone@^3.0.0: + version "3.0.1" + resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3" + integrity sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA== + dependencies: + kind-of "^6.0.2" + shallow-copy@0.0.1: version "0.0.1" resolved "https://registry.yarnpkg.com/shallow-copy/-/shallow-copy-0.0.1.tgz#415f42702d73d810330292cc5ee86eae1a11a170" @@ -14193,7 +14250,7 @@ source-map-support@0.5.16: buffer-from "^1.0.0" source-map "^0.6.0" -source-map-support@0.5.19, source-map-support@^0.5.17, source-map-support@~0.5.12: +source-map-support@0.5.19, source-map-support@^0.5.16, source-map-support@^0.5.17, source-map-support@~0.5.12: version "0.5.19" resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.19.tgz#a98b62f86dcaf4f67399648c085291ab9e8fed61" integrity sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw== @@ -15690,6 +15747,13 @@ v8-to-istanbul@^7.0.0: convert-source-map "^1.6.0" source-map "^0.7.3" +v8flags@^3.1.1: + version "3.2.0" + resolved "https://registry.yarnpkg.com/v8flags/-/v8flags-3.2.0.tgz#b243e3b4dfd731fa774e7492128109a0fe66d656" + integrity sha512-mH8etigqMfiGWdeXpaaqGfs6BndypxusHHcv2qSHyZkGEznCd/qAXCWWRzeowtL54147cktFOC4P5y+kl8d8Jg== + dependencies: + homedir-polyfill "^1.0.1" + validate-npm-package-license@^3.0.1: version "3.0.4" resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"