Transform: Tab \t in JSX should be trimmed

[magic-akari]

OXC playground

[overlookmotel]

I think this should be fixed in parser (not transformer). I don't think we should have had nodes like this in the AST in the first place:

JSXText {
    span: Span { start: 68, end: 72 },
    value: "\n\t\t\t",
}

@Boshen can you confirm I am right about that?

[magic-akari]

I think this should be fixed in parser (not transformer). I don't think we should have had nodes like this in the AST in the first place:

JSXText {
    span: Span { start: 68, end: 72 },
    value: "\n\t\t\t",
}

@Boshen can you confirm I am right about that?

When I attempted to fix the issue, I suspected the parser.
But upon examining the AST outputs from both TypeScript and Babel, I discovered that they were both present in the AST.

When I tried to fix it, I suspected the parser might be the issue.
However, after reviewing the AST outputs from both TypeScript and Babel, I realized that they arre preserved in the AST.

[overlookmotel]

Re-opening as would like @Boshen's view on whether parser should be producing these JSXText elements which contain only whitespace.

If I remember right, we decided that our support for JSX is limited to React JSX (and React-like JSX, e.g. Vue), rather than attempting to follow the full "abstract" JSX spec. Therefore, even if JSX spec says these JSXText nodes should be present, I don't think that's relevant.

In React JSX (and ditto Vue) whitespace in these positions is not semantically meaningful. We don't use a Concrete Syntax Tree so, like other semantically-meaningless whitespace, personally I don't think this should appear in the AST.

It's not purely an academic question. In typical React/Vue/etc code, our AST will contain a lot of these pointless JSXText nodes. It may well has a measurable perf impact. @magic-akari's simple example has 11 JSXText nodes in it.

[Boshen]

The parser is correct according to the spec https://facebook.github.io/jsx/#prod-JSXText

The transformer is responsible for how to deal with these whitespaces, which is also correct, because our jsx transform is correct.