The Wayback Machine - https://web.archive.org/web/20210719233253/https://github.com/facebook/react/pull/21833
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DevTools: Update named hooks match to use column number also #21833

Merged

Conversation

@bvaughn
Copy link
Contributor

@bvaughn bvaughn commented Jul 8, 2021

This prevents edge cases where AST nodes are incorrectly matched.

Resolves #21792

This prevents edge cases where AST nodes are incorrectly matched.
@bvaughn bvaughn force-pushed the bvaughn:devtools-hook-names-column-and-line-number branch from 157743a to c170b88 Jul 8, 2021
@sizebot
Copy link

@sizebot sizebot commented Jul 8, 2021

Comparing: 92af60a...c170b88

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js = 127.20 kB 127.20 kB = 40.76 kB 40.76 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 130.01 kB 130.01 kB = 41.67 kB 41.67 kB
facebook-www/ReactDOM-prod.classic.js = 404.75 kB 404.75 kB = 74.83 kB 74.83 kB
facebook-www/ReactDOM-prod.modern.js = 393.15 kB 393.15 kB = 73.07 kB 73.07 kB
facebook-www/ReactDOMForked-prod.classic.js = 404.75 kB 404.75 kB = 74.83 kB 74.83 kB

Significant size changes

Includes any change greater than 0.2%:

(No significant changes)

Generated by 🚫 dangerJS against c170b88

@bvaughn bvaughn merged commit f52b73f into facebook:main Jul 8, 2021
34 checks passed
34 checks passed
@facebook-github-tools
Facebook CLA Check Contributor License Agreement is valid!
Details
ci/circleci: RELEASE_CHANNEL_stable_yarn_build Your tests passed on CircleCI!
Details
ci/circleci: RELEASE_CHANNEL_stable_yarn_test_dom_fixtures Your tests passed on CircleCI!
Details
ci/circleci: build_devtools_and_process_artifacts Your tests passed on CircleCI!
Details
ci/circleci: build_devtools_scheduling_profiler Your tests passed on CircleCI!
Details
ci/circleci: get_base_build Your tests passed on CircleCI!
Details
ci/circleci: process_artifacts_combined Your tests passed on CircleCI!
Details
ci/circleci: setup Your tests passed on CircleCI!
Details
ci/circleci: sizebot Your tests passed on CircleCI!
Details
ci/circleci: sync_reconciler_forks Your tests passed on CircleCI!
Details
ci/circleci: yarn_build Your tests passed on CircleCI!
Details
ci/circleci: yarn_build_combined Your tests passed on CircleCI!
Details
ci/circleci: yarn_flow Your tests passed on CircleCI!
Details
ci/circleci: yarn_lint Your tests passed on CircleCI!
Details
ci/circleci: yarn_lint_build Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=experimental --env=development Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=experimental --env=production Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=stable --env=development Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=stable --env=development --persistent Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=stable --env=production Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-classic --env=development --variant=false Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-classic --env=development --variant=true Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-classic --env=production --variant=false Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-classic --env=production --variant=true Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-modern --env=development --variant=false Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-modern --env=development --variant=true Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-modern --env=production --variant=false Your tests passed on CircleCI!
Details
ci/circleci: yarn_test--r=www-modern --env=production --variant=true Your tests passed on CircleCI!
Details
ci/circleci: yarn_test_build---project=devtools -r=experimental Your tests passed on CircleCI!
Details
ci/circleci: yarn_test_build--r=experimental --env=development Your tests passed on CircleCI!
Details
ci/circleci: yarn_test_build--r=experimental --env=production Your tests passed on CircleCI!
Details
ci/circleci: yarn_test_build--r=stable --env=development Your tests passed on CircleCI!
Details
ci/circleci: yarn_test_build--r=stable --env=production Your tests passed on CircleCI!
Details
@codesandbox
ci/codesandbox Building packages succeeded.
Details
@bvaughn bvaughn deleted the bvaughn:devtools-hook-names-column-and-line-number branch Jul 8, 2021
(line === start.line && column < start.column) ||
(line === end.line && column > end.column)
Comment on lines +44 to +45

This comment has been minimized.

@motiz88

motiz88 Jul 9, 2021
Contributor

If I'm not mistaken, column is 1-based here (parsed from Error.prototype.stack) while start.column and end.column are 0-based (coming from the AST).

This comment has been minimized.

@bvaughn

bvaughn Jul 9, 2021
Author Contributor

Hey @motiz88 Thanks for checking this PR out.

Line number and column number typically come from the 'source-map' library, but they sometimes come from the 'error-stack-parser' library (if there's no source map):

if (areSourceMapsAppliedToErrors() || !sourceConsumer) {
// Either the current environment automatically applies source maps to errors,
// or the current code had no source map to begin with.
// Either way, we don't need to convert the Error stack frame locations.
originalSourceColumnNumber = columnNumber;
originalSourceLineNumber = lineNumber;
} else {
const position = sourceConsumer.originalPositionFor({
line: lineNumber,
// Column numbers are representated differently between tools/engines.
// For more info see https://github.com/facebook/react/issues/21792#issuecomment-873171991
column: columnNumber - 1,
});
originalSourceColumnNumber = position.column;
originalSourceLineNumber = position.line;
}

Would we need to add 1 when the values come from the 'source-map' library (so that we could later subtract one here)? Or is it just that they're represented as 0-based within the AST itself, but the value returned by 'source-map' would be 1-based again?

Ideally we'd write a unit test that caught these off-by-one errors to prevent from regressing.

This comment has been minimized.

@bvaughn

bvaughn Jul 13, 2021
Author Contributor

If I'm not mistaken, column is 1-based here (parsed from Error.prototype.stack) while start.column and end.column are 0-based (coming from the AST).

Just confirmed this using AST Explorer.

This comment has been minimized.

@bvaughn

bvaughn Jul 13, 2021
Author Contributor

I think...in practice...this will never cause a problem, because we are matching the 1-based Error stack location for the hook Identifier (e.g. useState) against the 0-based larger VariableDeclarator (e.g. [foo, setFoo] = useState()) so the ranges will always overlap.

I think we should still fix the code, but I'm not sure if it's possible to write an integration test that would fail without this change.

This comment has been minimized.

@bvaughn

bvaughn Jul 13, 2021
Author Contributor

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment