@samitouri / QOS-React-2 / commits / 9e8fe11e11

[DevTools] Keep query params in extracted source map urls (#22148)

## Summary Our current logic for extracting source map urls assumed that the url contained no query params (e.g. `?foo=bar`), and when extracting the url we would cut off the query params. I noticed this during internal testing, since removing the query params would cause loading source maps to fail. This commit fixes that behavior by ensuring that our regex captures the full url, including query params. ## Test Plan - yarn flow - yarn test - yarn test-build-devtools - added new regression tests - named hooks still work on manual test of browser extension on a few different apps (code sandbox, create-react-app, internally).

Juan committed Aug 20, 2021 at 18:04 UTC 9e8fe11e118c07713c7af4458b70aae57c889394
69 files changed +109 -84
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentUsingHooksIndirectly.js
+1 -1
@@ -42,4 +42,4 @@ function useIsDarkMode() {
42 }, []);
43 return [isDarkMode, () => {}];
44 }
45 -//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
\ No newline at end of file
45 +//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithCustomHook.js
+1 -1
@@ -48,4 +48,4 @@ function useFoo() {
48 foo: true
49 };
50 }
51 -//# sourceMappingURL=ComponentWithCustomHook.js.map
\ No newline at end of file
51 +//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithExternalCustomHooks.js
+1 -1
@@ -23,4 +23,4 @@ function Component() {
23 const theme = (0, _useTheme.default)();
24 return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
25 }
26 -//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
\ No newline at end of file
26 +//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithMultipleHooksPerLine.js
+1 -1
@@ -27,4 +27,4 @@ function Component() {
27
28 return a + b + c + d;
29 }
30 -//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
\ No newline at end of file
30 +//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithNestedHooks.js
+1 -1
@@ -25,4 +25,4 @@ function Component(props) {
25 module.exports = {
26 Component
27 };
28 -//# sourceMappingURL=ComponentWithNestedHooks.js.map
\ No newline at end of file
28 +//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ContainingStringSourceMappingURL.js
+1 -1
@@ -26,4 +26,4 @@ function Component() {
26 onClick: () => setCount(count + 1)
27 }, "Click me"));
28 }
29 -//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
\ No newline at end of file
29 +//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/Example.js
+1 -1
@@ -25,4 +25,4 @@ function Component() {
25 onClick: () => setCount(count + 1)
26 }, "Click me"));
27 }
28 -//# sourceMappingURL=Example.js.map
\ No newline at end of file
28 +//# sourceMappingURL=Example.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/InlineRequire.js
+1 -1
@@ -18,4 +18,4 @@ function Component() {
18
19 return count;
20 }
21 -//# sourceMappingURL=InlineRequire.js.map
\ No newline at end of file
21 +//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ToDoList.js
+1 -1
@@ -103,4 +103,4 @@ function List(props) {
103 toggleItem: toggleItem
104 }))));
105 }
106 -//# sourceMappingURL=ToDoList.js.map
\ No newline at end of file
106 +//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js
+1 -1
@@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
86 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
87
88 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; }
89 -//# sourceMappingURL=index.js.map
\ No newline at end of file
89 +//# sourceMappingURL=index.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/useTheme.js
+1 -1
@@ -24,4 +24,4 @@ function useTheme() {
24 (0, _react.useDebugValue)(theme);
25 return theme;
26 }
27 -//# sourceMappingURL=useTheme.js.map
\ No newline at end of file
27 +//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value
\ No newline at end of file
packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js
+9 -1
@@ -57,7 +57,15 @@ describe('parseHookNames', () => {
57 };
58
59 fetchMock.mockIf(/.+$/, request => {
60 - return requireText(request.url, 'utf8');
60 + const url = request.url;
61 + const isLoadingExternalSourceMap = /external\/.*\.map/.test(url);
62 + if (isLoadingExternalSourceMap) {
63 + // Assert that url contains correct query params
64 + expect(url.includes('?foo=bar&param=some_value')).toBe(true);
65 + const fileSystemPath = url.split('?')[0];
66 + return requireText(fileSystemPath, 'utf8');
67 + }
68 + return requireText(url, 'utf8');
69 });
70 });
71
packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js
+12 -6
@@ -97,7 +97,8 @@ function compile(fileName) {
97 // Generate compiled output with external source maps
98 writeFileSync(
99 resolve(externalDir, fileName),
100 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
100 + transformed.code +
101 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
102 'utf8',
103 );
104 writeFileSync(
@@ -167,7 +168,8 @@ function compile(fileName) {
168 // Generate compiled output using external source maps using index map format
169 writeFileSync(
170 resolve(externalIndexMapDir, fileName),
170 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
171 + transformed.code +
172 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
173 'utf8',
174 );
175 writeFileSync(
@@ -242,7 +244,8 @@ function compile(fileName) {
244 );
245 writeFileSync(
246 resolve(externalFbSourcesExtendedDir, fileName),
245 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
247 + transformed.code +
248 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
249 'utf8',
250 );
251 writeFileSync(
@@ -260,7 +263,8 @@ function compile(fileName) {
263 );
264 writeFileSync(
265 resolve(externalFbSourcesIndexMapExtendedDir, fileName),
263 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
266 + transformed.code +
267 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
268 'utf8',
269 );
270 writeFileSync(
@@ -279,7 +283,8 @@ function compile(fileName) {
283 );
284 writeFileSync(
285 resolve(externalReactSourcesExtendedDir, fileName),
282 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
286 + transformed.code +
287 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
288 'utf8',
289 );
290 writeFileSync(
@@ -297,7 +302,8 @@ function compile(fileName) {
302 );
303 writeFileSync(
304 resolve(externalReactSourcesIndexMapExtendedDir, fileName),
300 - transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
305 + transformed.code +
306 + `\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
307 'utf8',
308 );
309 writeFileSync(
packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js
+22 -11
@@ -26,7 +26,6 @@ import type {HookNames, LRUCache} from 'react-devtools-shared/src/types';
26 import type {Thenable} from 'shared/ReactTypes';
27 import type {SourceConsumer} from '../astUtils';
28
29 -const SOURCE_MAP_REGEX = / ?sourceMappingURL=([^\s'"]+)/gm;
29 const MAX_SOURCE_LENGTH = 100_000_000;
30
31 type AST = mixed;
@@ -213,18 +212,20 @@ function extractAndLoadSourceMaps(
212 return;
213 }
214
215 + const sourceMapRegex = / ?sourceMappingURL=([^\s'"]+)/gm;
216 const runtimeSourceCode = ((hookSourceData.runtimeSourceCode: any): string);
217 - const sourceMappingURLs = runtimeSourceCode.match(SOURCE_MAP_REGEX);
218 - if (sourceMappingURLs == null) {
217 + let sourceMappingURLMatch = sourceMapRegex.exec(runtimeSourceCode);
218 + if (sourceMappingURLMatch == null) {
219 // Maybe file has not been transformed; we'll try to parse it as-is in parseSourceAST().
220
221 if (__DEBUG__) {
222 console.log('extractAndLoadSourceMaps() No source map found');
223 }
224 } else {
225 - for (let i = 0; i < sourceMappingURLs.length; i++) {
225 + const externalSourceMapURLs = [];
226 + while (sourceMappingURLMatch != null) {
227 const {runtimeSourceURL} = hookSourceData;
227 - const sourceMappingURL = sourceMappingURLs[i];
228 + const sourceMappingURL = sourceMappingURLMatch[1];
229 const hasInlineSourceMap = sourceMappingURL.indexOf('base64,') >= 0;
230 if (hasInlineSourceMap) {
231 // TODO (named hooks) deduplicate parsing in this branch (similar to fetching in the other branch)
@@ -257,19 +258,30 @@ function extractAndLoadSourceMaps(
258 break;
259 }
260 } else {
260 - let url = sourceMappingURLs[i].split('=')[1];
261 + externalSourceMapURLs.push(sourceMappingURL);
262 + }
263 +
264 + sourceMappingURLMatch = sourceMapRegex.exec(runtimeSourceCode);
265 + }
266
262 - if (i !== sourceMappingURLs.length - 1) {
267 + const foundInlineSourceMap =
268 + hookSourceData.sourceConsumer != null &&
269 + hookSourceData.metadataConsumer != null;
270 + if (!foundInlineSourceMap) {
271 + externalSourceMapURLs.forEach((sourceMappingURL, index) => {
272 + if (index !== externalSourceMapURLs.length - 1) {
273 // Files with external source maps should only have a single source map.
274 // More than one result might indicate an edge case,
275 // like a string in the source code that matched our "sourceMappingURL" regex.
276 // We should just skip over cases like this.
277 console.warn(
268 - `More than one external source map detected in the source file; skipping "${url}"`,
278 + `More than one external source map detected in the source file; skipping "${sourceMappingURL}"`,
279 );
270 - continue;
280 + return;
281 }
282
283 + const {runtimeSourceURL} = hookSourceData;
284 + let url = sourceMappingURL;
285 if (!url.startsWith('http') && !url.startsWith('/')) {
286 // Resolve paths relative to the location of the file name
287 const lastSlashIdx = runtimeSourceURL.lastIndexOf('/');
@@ -316,8 +328,7 @@ function extractAndLoadSourceMaps(
328 hookSourceData.sourceConsumer = result?.sourceConsumer ?? null;
329 }),
330 );
319 - break;
320 - }
331 + });
332 }
333 }
334 });