maxjhandsome
/
react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[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).
This commit is contained in:
Juan 2021-08-20 18:04:30 -04:00 committed by GitHub
parent 83205c0aea
commit 9e8fe11e11
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
69 changed files with 109 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithCustomHook.js vendored
View File

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

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

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

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

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index-map/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/fb-sources-extended/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

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

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index-map/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithCustomHook.js vendored
View File

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentUsingHooksIndirectly.js vendored
View File

@ -42,4 +42,4 @@ function useIsDarkMode() {
}, []);
return [isDarkMode, () => {}];
}
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map
//# sourceMappingURL=ComponentUsingHooksIndirectly.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithCustomHook.js vendored
View File

@ -48,4 +48,4 @@ function useFoo() {
foo: true
};
}
//# sourceMappingURL=ComponentWithCustomHook.js.map
//# sourceMappingURL=ComponentWithCustomHook.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithExternalCustomHooks.js vendored
View File

@ -23,4 +23,4 @@ function Component() {
const theme = (0, _useTheme.default)();
return /*#__PURE__*/_react.default.createElement("div", null, "theme: ", theme);
}
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map
//# sourceMappingURL=ComponentWithExternalCustomHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithMultipleHooksPerLine.js vendored
View File

@ -27,4 +27,4 @@ function Component() {
return a + b + c + d;
}
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map
//# sourceMappingURL=ComponentWithMultipleHooksPerLine.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ComponentWithNestedHooks.js vendored
View File

@ -25,4 +25,4 @@ function Component(props) {
module.exports = {
Component
};
//# sourceMappingURL=ComponentWithNestedHooks.js.map
//# sourceMappingURL=ComponentWithNestedHooks.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ContainingStringSourceMappingURL.js vendored
View File

@ -26,4 +26,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map
//# sourceMappingURL=ContainingStringSourceMappingURL.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/Example.js vendored
View File

@ -25,4 +25,4 @@ function Component() {
onClick: () => setCount(count + 1)
}, "Click me"));
}
//# sourceMappingURL=Example.js.map
//# sourceMappingURL=Example.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/InlineRequire.js vendored
View File

@ -18,4 +18,4 @@ function Component() {
return count;
}
//# sourceMappingURL=InlineRequire.js.map
//# sourceMappingURL=InlineRequire.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/ToDoList.js vendored
View File

@ -103,4 +103,4 @@ function List(props) {
toggleItem: toggleItem
}))));
}
//# sourceMappingURL=ToDoList.js.map
//# sourceMappingURL=ToDoList.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index-map/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/index.js vendored
View File

@ -86,4 +86,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
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
//# sourceMappingURL=index.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/react-sources-extended/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

2
packages/react-devtools-extensions/src/__tests__/__source__/__compiled__/external/useTheme.js vendored
View File

@ -24,4 +24,4 @@ function useTheme() {
(0, _react.useDebugValue)(theme);
return theme;
}
//# sourceMappingURL=useTheme.js.map
//# sourceMappingURL=useTheme.js.map?foo=bar&param=some_value

10
packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js vendored
View File

@ -57,7 +57,15 @@ describe('parseHookNames', () => {
};
fetchMock.mockIf(/.+$/, request => {
return requireText(request.url, 'utf8');
const url = request.url;
const isLoadingExternalSourceMap = /external\/.*\.map/.test(url);
if (isLoadingExternalSourceMap) {
// Assert that url contains correct query params
expect(url.includes('?foo=bar&param=some_value')).toBe(true);
const fileSystemPath = url.split('?')[0];
return requireText(fileSystemPath, 'utf8');
}
return requireText(url, 'utf8');
});
});

18
packages/react-devtools-extensions/src/__tests__/updateMockSourceMaps.js vendored
View File

@ -97,7 +97,8 @@ function compile(fileName) {
// Generate compiled output with external source maps
writeFileSync(
resolve(externalDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(
@ -167,7 +168,8 @@ function compile(fileName) {
// Generate compiled output using external source maps using index map format
writeFileSync(
resolve(externalIndexMapDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(
@ -242,7 +244,8 @@ function compile(fileName) {
);
writeFileSync(
resolve(externalFbSourcesExtendedDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(
@ -260,7 +263,8 @@ function compile(fileName) {
);
writeFileSync(
resolve(externalFbSourcesIndexMapExtendedDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(
@ -279,7 +283,8 @@ function compile(fileName) {
);
writeFileSync(
resolve(externalReactSourcesExtendedDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(
@ -297,7 +302,8 @@ function compile(fileName) {
);
writeFileSync(
resolve(externalReactSourcesIndexMapExtendedDir, fileName),
transformed.code + `\n//# sourceMappingURL=${fileName}.map`,
transformed.code +
`\n//# sourceMappingURL=${fileName}.map?foo=bar&param=some_value`,
'utf8',
);
writeFileSync(

33
packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js vendored
View File

@ -26,7 +26,6 @@ import type {HookNames, LRUCache} from 'react-devtools-shared/src/types';
import type {Thenable} from 'shared/ReactTypes';
import type {SourceConsumer} from '../astUtils';
const SOURCE_MAP_REGEX = / ?sourceMappingURL=([^\s'"]+)/gm;
const MAX_SOURCE_LENGTH = 100_000_000;
type AST = mixed;
@ -213,18 +212,20 @@ function extractAndLoadSourceMaps(
return;
}
const sourceMapRegex = / ?sourceMappingURL=([^\s'"]+)/gm;
const runtimeSourceCode = ((hookSourceData.runtimeSourceCode: any): string);
const sourceMappingURLs = runtimeSourceCode.match(SOURCE_MAP_REGEX);
if (sourceMappingURLs == null) {
let sourceMappingURLMatch = sourceMapRegex.exec(runtimeSourceCode);
if (sourceMappingURLMatch == null) {
// Maybe file has not been transformed; we'll try to parse it as-is in parseSourceAST().
if (__DEBUG__) {
console.log('extractAndLoadSourceMaps() No source map found');
}
} else {
for (let i = 0; i < sourceMappingURLs.length; i++) {
const externalSourceMapURLs = [];
while (sourceMappingURLMatch != null) {
const {runtimeSourceURL} = hookSourceData;
const sourceMappingURL = sourceMappingURLs[i];
const sourceMappingURL = sourceMappingURLMatch[1];
const hasInlineSourceMap = sourceMappingURL.indexOf('base64,') >= 0;
if (hasInlineSourceMap) {
// TODO (named hooks) deduplicate parsing in this branch (similar to fetching in the other branch)
@ -257,19 +258,30 @@ function extractAndLoadSourceMaps(
break;
}
} else {
let url = sourceMappingURLs[i].split('=')[1];
externalSourceMapURLs.push(sourceMappingURL);
}
if (i !== sourceMappingURLs.length - 1) {
sourceMappingURLMatch = sourceMapRegex.exec(runtimeSourceCode);
}
const foundInlineSourceMap =
hookSourceData.sourceConsumer != null &&
hookSourceData.metadataConsumer != null;
if (!foundInlineSourceMap) {
externalSourceMapURLs.forEach((sourceMappingURL, index) => {
if (index !== externalSourceMapURLs.length - 1) {
// Files with external source maps should only have a single source map.
// More than one result might indicate an edge case,
// like a string in the source code that matched our "sourceMappingURL" regex.
// We should just skip over cases like this.
console.warn(
`More than one external source map detected in the source file; skipping "${url}"`,
`More than one external source map detected in the source file; skipping "${sourceMappingURL}"`,
);
continue;
return;
}
const {runtimeSourceURL} = hookSourceData;
let url = sourceMappingURL;
if (!url.startsWith('http') && !url.startsWith('/')) {
// Resolve paths relative to the location of the file name
const lastSlashIdx = runtimeSourceURL.lastIndexOf('/');
@ -316,8 +328,7 @@ function extractAndLoadSourceMaps(
hookSourceData.sourceConsumer = result?.sourceConsumer ?? null;
}),
);
break;
}
});
}
}
});