microsoft / microsoft/TypeScript

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

Ouverte
#43,906 3 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Bug Domain: JSX/TSX
Langage dominant
Go
Étoiles
111k
Forks
14.4k
Merge moyen
1 j 19 h
PR mergées (30 j)
117

Description

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

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par le TypeScript Playground lié et comparez les exemples TSX avec l’appel à React.createElement, en vous concentrant sur les discriminated-union props lorsque des children sont présents. Suivez la validation des props JSX du compilateur et ajoutez un test de régression pour le cas Accordion présenté ; le travail est terminé lorsque TSX signale la même erreur de validation que createElement.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
react, typescript
Domaine
compilers
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Clairement spécifiée
Accessibilité débutants
45/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.