microsoft / microsoft/TypeScript

Inconsistent behavior with Generic ElementType

オープン
#61,995 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る
Domain: JSX/TSX Help Wanted Possible Improvement
主要言語
Go
スター
111k
フォーク
14.3k
平均マージ
2日 4時間
マージ済み PR(30日)
132

説明

### 🔎 Search Terms

JSX, Generic ElementType, TS2786

### 🕗 Version & Regression Information

- Behavior seen in 5.8.3 and 5.9.0-dev.20250703
- I was unable to test this on prior versions

### ⏯ Playground Link

_No response_

### 💻 Code

```ts
export namespace dsl {
export namespace JSX {
export type Element = {
name: U
type: string
children: Element[]
}

[tsconfig.json](https://github.com/user-attachments/files/21047590/tsconfig.json)

export function createElement(
tag: JSX.ElementType,
props : { name: U },
...children: JSX.Element[]
): JSX.Element {
return tag(props, ...children)
}
}

function Form(props: { name: U }, ...children: dsl.JSX.Element[]) {
return { ...props, type: "form", children }
}

const formDesugared = dsl.createElement(
Form, { name: "one" }
)

const form = (
// <--- Error here, error TS2786: 'Form' cannot be used as a JSX component.
)

```

### 🙁 Actual behavior

Compile error:

sui.tsx:31:6 - error TS2786: 'Form' cannot be used as a JSX component.
Its type '(props: { name: U; }, ...children: Element[]) => { type: string; children: Element[]; name: U; }' is not a valid JSX element type.
Types of parameters 'props' and 'props' are incompatible.
Type '{ name: unknown; }' is not assignable to type '{ name: string; }'.
Types of property 'name' are incompatible.
Type 'unknown' is not assignable to type 'string'.

31

### 🙂 Expected behavior

Changing props: { name: U } in the definition of ElementType to props: { name: string } causes the code to compile [loosing the wanted typing of the resulting Element

Since the desugared version of the code compiles and infers types correctly, I'd expect the JSX code to compile, or at least produce a less deeply mysterious error - the type of the 'name' property plainly *isn't* unknown.

### Additional information about the issue

_No response_

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

リンクされた tsconfig.json を使って .tsx の例を TypeScript 5.8.3 と 5.9 の開発版で再現し、JSX と dsl.createElement、および診断 TS2786 を比較します。JSX.ElementType がジェネリック Form をどのようにチェックするかを追跡します。完了条件は、JSX 形式がデシュガーされた呼び出しと一貫してコンパイルされ、意図した推論済みの Element の型付けを保持し、誤解を招く未知の名前エラーを回避することです。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
typescript
領域
compilers
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
35/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。