Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Preserve HTML entity-encoded whitespace in JSX text trimming#17798

Open
veeceey wants to merge 2 commits intobabel:mainfrom
veeceey:fix/issue-17683-jsx-html-entities
Open

Preserve HTML entity-encoded whitespace in JSX text trimming#17798
veeceey wants to merge 2 commits intobabel:mainfrom
veeceey:fix/issue-17683-jsx-html-entities

Conversation

@veeceey
Copy link
Contributor

@veeceey veeceey commented Feb 14, 2026

Problem

When JSX text contains HTML entity-encoded whitespace characters like   (space), 	 (tab), or 
 (newline), they get stripped during the JSX text whitespace trimming step. This happens because cleanJSXElementLiteralChild operates on child.value, which has entities already decoded by the parser, making entity-encoded spaces indistinguishable from literal whitespace.

For example:

<example>
  foo
  <hr />&#32;
  bar
</example>

Produces children: ["foo", <hr />, "bar"] - the &#32; space is completely lost.

Both esbuild and tsc correctly preserve these entity-encoded whitespace characters.

Fix

Modified cleanJSXElementLiteralChild to use child.extra.raw (the raw source text with entities still encoded) for whitespace trimming decisions. In the raw text, &#32; is treated as non-whitespace content (because it's the literal characters &, #, 3, 2, ;). After trimming, the entities are decoded to produce the final string value.

A decodeHTMLEntities function handles all three entity forms: numeric decimal (&#32;), numeric hex (&#x20;), and named (&amp;), using the same XHTML entity table as the parser.

Test plan

  • Added test fixtures for both classic and automatic runtime modes
  • Verified that existing whitespace trimming behavior is preserved for literal whitespace
  • Verified &nbsp; handling is unchanged (it was never affected since U+00A0 != U+0020)
  • All 5630 babel-types tests pass
  • All 160 babel-plugin-transform-react-jsx tests pass

Fixes #17683

cleanJSXElementLiteralChild was stripping whitespace characters that were
intentionally encoded as HTML entities (e.g. &babel#32;, &babel#9;, &babel#10;). This
happened because entities were decoded before the whitespace trimming
algorithm ran, making entity-encoded spaces indistinguishable from
literal whitespace.

The fix uses the raw source text (child.extra.raw) for trimming, where
entity syntax like &babel#32; is treated as non-whitespace content. After
trimming, entities are decoded to produce the final string value. This
matches the behavior of esbuild and tsc, which both preserve
entity-encoded whitespace.

Fixes babel#17683
@babel-bot
Copy link
Collaborator

babel-bot commented Feb 14, 2026

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

@pkg-pr-new
Copy link

pkg-pr-new bot commented Feb 14, 2026

Open in StackBlitz

commit: bd51c31

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

HTML Entities-encoded whitespace gets trimmed in JSX

2 participants