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

Improve error message when not providing a value for JSX key #12983

Merged
merged 4 commits into from Mar 16, 2021

Conversation

@hajnalbendeguz
Copy link
Contributor

@hajnalbendeguz hajnalbendeguz commented Mar 8, 2021

Q                       A
Fixed Issues? Fixes #12931
Patch: Bug Fix? No
Major: Breaking Change? No
Minor: New Feature? No
Tests Added + Pass? Yes
Documentation PR Link -
Any Dependency Changes? None
License MIT

Throwing a more descriptive error when compiling a React element in a list that hasn't been given a value for its key.
eg. <Component key />

@babel-bot
Copy link
Collaborator

@babel-bot babel-bot commented Mar 9, 2021

Build successful! You can test your changes in the REPL here: https://babeljs.io/repl/build/44294/

@codesandbox
Copy link

@codesandbox codesandbox bot commented Mar 9, 2021

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit d0c94e1:

Sandbox Source
babel-repl-custom-plugin Configuration
babel-plugin-multi-config Configuration
@JLHwung
JLHwung approved these changes Mar 9, 2021
@@ -0,0 +1,2 @@

This comment has been minimized.

@JLHwung

JLHwung Mar 9, 2021
Contributor

Can you duplicate this test to fixtures/react/, which shares test suites with react-automatic but with runtime set to classic, the default behaviour of Babel 7.

This comment has been minimized.

@hajnalbendeguz

hajnalbendeguz Mar 13, 2021
Author Contributor

Okay. I've done that. As I mentioned in the issue, the compilation was successful in development mode. Fixing it was a bit trickier. Let me know if I have to improve my solution in any way.

hajnalbendeguz and others added 3 commits Mar 10, 2021
Copy link
Member

@nicolo-ribaudo nicolo-ribaudo left a comment

We should also throw in development mode, but let's merge this as-is for now since it already fixes the original problem (the unhelpful error message).

If you want to open the follow-up PR please do so, otherwise I'll open an issue about it!

@nicolo-ribaudo nicolo-ribaudo changed the title Improve error message when not providing a value for key Improve error message when not providing a value for JSX key Mar 16, 2021
@nicolo-ribaudo nicolo-ribaudo merged commit 281acd6 into babel:main Mar 16, 2021
25 of 27 checks passed
25 of 27 checks passed
@github-actions
Prepare Cache
Details
@github-actions
Test on Node.js Latest
Details
@github-actions
Build Babel Artifacts
Details
@github-actions
Test Babel 8 breaking changes
Details
@github-actions
Publish to local Verdaccio registry
Details
@github-actions
Lint
Details
@github-actions
Test on Node.js (14)
Details
@github-actions
Test on Node.js (12)
Details
@github-actions
Test on Node.js (10)
Details
@github-actions
Test on Node.js (8)
Details
@github-actions
Test on Node.js (6)
Details
@github-actions
Test on Windows
Details
@github-actions
Third-party Parser Tests
Details
@github-actions
Test @babel/runtime integrations
Details
@github-actions
E2E (babel)
Details
@github-actions
E2E (babel-old-version)
Details
@github-actions
E2E (create-react-app)
Details
@github-actions
E2E (vue-cli)
Details
@github-actions
E2E (jest)
Details
@circleci-checks
e2e-breaking-pr Workflow: e2e-breaking-pr
Details
@circleci-checks
test262-pr Workflow: test262-pr
Details
@gitpod-io
Gitpod Open an online workspace in Gitpod
Details
@babel-bot
babel/repl REPL preview is available
Details
@circleci-checks
build-standalone Workflow: build-standalone
Details
@codesandbox
ci/codesandbox Building packages succeeded.
Details
@codecov
codecov/project 91.40% (target 90.00%)
Details
@circleci-checks
e2e Workflow: e2e
Details
@yedidyak
Copy link

@yedidyak yedidyak commented Mar 24, 2021

This changed the behaviour very slightly, and actually ended up breaking a build of ours. Now when running the react-native metro bundler on an error case of 'key' used as a boolean it throws an exception and fails at compile time, instead of at runtime.

We fixed it by fixing the bug, but maybe worth checking this scenario in future.

Thanks for working on amazing open source anyway!

@nicolo-ribaudo
Copy link
Member

@nicolo-ribaudo nicolo-ribaudo commented Mar 24, 2021

Oh sorry for the inconvenience, I assumed this was already a compile-time error (just with a worse message) because of #12931.

If many people are affected we could make it a warning instead, but since this would be a runtime error anyway I lean towards leaving it as-is.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

6 participants