diff --git a/packages/react-devtools-extensions/src/astUtils.js b/packages/react-devtools-extensions/src/astUtils.js index 23208fca1eeef..879f17ae18055 100644 --- a/packages/react-devtools-extensions/src/astUtils.js +++ b/packages/react-devtools-extensions/src/astUtils.js @@ -40,6 +40,17 @@ function checkNodeLocation( return false; } + // Column numbers are representated differently between tools/engines. + // Error.prototype.stack columns are 1-based (like most IDEs) but ASTs are 0-based. + // + // In practice this will probably never matter, + // because this code matches the 1-based Error stack location for the hook Identifier (e.g. useState) + // with the larger 0-based VariableDeclarator (e.g. [foo, setFoo] = useState()) + // so the ranges should always overlap. + // + // 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) diff --git a/packages/react-devtools-extensions/src/parseHookNames.js b/packages/react-devtools-extensions/src/parseHookNames.js index 7250dfee687c1..58436acf4f8c6 100644 --- a/packages/react-devtools-extensions/src/parseHookNames.js +++ b/packages/react-devtools-extensions/src/parseHookNames.js @@ -378,6 +378,7 @@ function findHookNames( line: lineNumber, // Column numbers are representated differently between tools/engines. + // Error.prototype.stack columns are 1-based (like most IDEs) but ASTs are 0-based. // For more info see https://github.com/facebook/react/issues/21792#issuecomment-873171991 column: columnNumber - 1, }); @@ -476,6 +477,7 @@ async function parseSourceAST( line: lineNumber, // Column numbers are representated differently between tools/engines. + // Error.prototype.stack columns are 1-based (like most IDEs) but ASTs are 0-based. // For more info see https://github.com/facebook/react/issues/21792#issuecomment-873171991 column: columnNumber - 1, });