1

Consider this:

const selectLiteral /*: JSX.Element */ = <select></select>;
const selectCode /*: React.ReactDetailedReactHTMLElement<{}, HTMLElement> */ = React.createElement('select', {});

The typing of createElement is a bit incomplete due to non-specific HTMLElement but that's on react's type definition file.

What I don't get is why do all XML literals get JSX.Element instead of specific type? This seems like a deliberate choice? Also applies to custom components.

Marcin Wisnicki
  • 4,511
  • 4
  • 35
  • 57
  • This questions are relative to your: https://stackoverflow.com/questions/68398560/typescript-type-for-react-functioncomponent-that-returns-exactly-one-intrinsicel#answer-68399995 and https://stackoverflow.com/questions/68502411/typescript-type-that-excludes-types-with-a-generic-parameter-of-any – captain-yossarian from Ukraine Jul 23 '21 at 19:14
  • 1
    Why is there a need to? Usually `JSX.Element` is the "final rendered product" you either return or embed in another component. You shouldn't have to interact with its fields or props. – Kelvin Schoofs Jul 23 '21 at 19:18
  • 1
    It may be worth mentioning that `React.createElement` has 8 overload signatures. And `ReactDetailedReactHTMLElement` is not a type that is publicly exported by react. That's a lot of complexity for something you, arguably, shouldn't need. – Alex Wayne Jul 23 '21 at 19:21

0 Answers0