microsoft / microsoft/TypeScript
JSX Fragments are in-properly typed with `<></>` syntax, when using `react-jsx` JSX option
Dieses Issue hat noch niemand übernommen.
- Vorherrschende Sprache
- Go
- Sterne
- 111k
- Forks
- 14.3k
- Ø Merge
- 2 T. 4 Std.
- Gemergte PRs (30 T.)
- 132
Beschreibung
### 🔎 Search Terms
JSX, Fragment, children type
### 🕗 Version & Regression Information
Bug exists since TypeScript introduces `"jsx": "react-jsx"` from version 4.1.2 until `next` version (`6.0.0-dev.20250830`).
### ⏯ Playground Link
https://stackblitz.com/edit/stackblitz-starters-sffhmvvz?file=index.tsx
### 💻 Code
```tsx
import { Fragment } from "@/jsx-runtime";
{"ok"}
{({ foo }) => "also ok"}
;
<>
{"ok"}
{({ foo }) => "not ok"}
{/* ^ Binding element 'foo' implicitly has an 'any' type. */}
;
```
With following `@/jsx-runtime` definition:
```ts
export const jsx = (...args: unknown[]) => {};
type JsxElement =
| JsxElementArray
| undefined
| string
| ((arg: { foo: "bar " }) => void);
interface JsxElementArray extends Array {}
interface FragmentProps {
children?: JsxElement;
}
export const Fragment = (props: FragmentProps) => {};
```
and tsconfig:
```json
{
"compilerOptions": {
"strict": true,
"jsx": "react-jsx",
"jsxImportSource": "@",
// [...]
}
}
```
### 🙁 Actual behavior
The first JSX expression using `` pass the type checking while the second JSX using `<>` syntax reports error due to it's children was typed to `any`:
```
index.tsx:10:7 - error TS7031: Binding element 'foo' implicitly has an 'any' type.
10 {({ foo }) => "not ok"}
~~~
Found 1 error in index.tsx:10
```
### 🙂 Expected behavior
These two JSX expressions should both pass the type checking.
### Additional information about the issue
This issue was first mentioned at #50429 and fixed in #59933, but the fix only take effects on `"jsx": "react"` not `"jsx": "react-jsx"`, while the latter is a more encouraged approach in a modern project.
Beitragsleitfaden
Erste Schritte
- Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
- Forke das Repository und arbeite in einem Branch.
- Öffne einen Pull Request, der die Issue-Nummer nennt.
Bewertung
Dieses Issue wurde noch nicht bewertet.