microsoft / microsoft/TypeScript

Properties detectable as excess due to missing discriminant should be flagged in JSX expressions

オープン
#43,906 コメント 3 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

Bug Domain: JSX/TSX
主要言語
Go
スター
111k
フォーク
14.4k
平均マージ
1日 19時間
マージ済み PR(30日)
117

説明

Bug Report

When using TSX syntax to create a element which props are typed as a discriminated union, validation works when given element is constructed in TSX syntax without children, but loses validation once you add children.

🔎 Search Terms

react createElement validation tsx jsx children throws

🕗 Version & Regression Information
  • This is the behavior in every version I tried (3.x - 4.3.0-beta)
⏯ Playground Link

Playground link with relevant code

💻 Code
// this one should error but does not because it has children (tsx syntax)
const B = (
  <Accordion defaultSelectedKeys={new Set()}>
    <span>1</span>
  </Accordion>
)
// while using createElement it does error (like it should)
React.createElement(Accordion, {defaultSelectedKeys:new Set<Key>()}, <span>1</span>)
// while these also error (like they should) because they are without children.
const X = <Accordion defaultSelectedKeys={new Set()} />
const Y = <Accordion multiple defaultSelectedKey="1" />

🙁 Actual behavior

Like shown above, while React.createElement throws like it should, using TSX syntax though, it stops working.

🙂 Expected behavior

Same behavior as with createElement - raise a validation error with children

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

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

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

リンクされた TypeScript Playground から始め、children が存在する場合の discriminated-union props に焦点を当てて、TSX の例と React.createElement の呼び出しを比較します。コンパイラーの JSX prop 検証を追跡し、示されている Accordion のケースに対する回帰テストを追加します。完了の条件は、TSX が createElement と同じ検証エラーを報告することです。

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

評価

技術スタック
react, typescript
領域
compilers
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
明確に書かれている
初心者へのやさしさ
45/100

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

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