No type error when setting an unknown property of a JSX element
See original GitHub issueBug Report
I’ve augmented solid-js
’s JSX.IntrinsicElements
with new intrinsic elements made within my solid-js-consuming application.
When I write an unknown prop manually (not with spread as detailed in https://github.com/microsoft/TypeScript/issues/18801), I do not get a type error.
https://user-images.githubusercontent.com/297678/104986944-4a9c7c00-59c9-11eb-9a24-24edb1dd8617.mp4
🔎 Search Terms
typescript no error on unknown prop
🕗 Version & Regression Information
Not sure when this happened, but I’ve been trying unsuccessfully to import {JSX}
into particular files to as not to clash with React’s global JSX
definitions, but because import {JSX}
does not work (https://github.com/microsoft/TypeScript/issues/41813), I’ve since started trying to use the new @jsxImportSource
feature as comments inside my files.
So far, I have gotten types to appear using per-file @jsxImportSource
comments, and there are no other global JSX types in those files (I have segregated React JSX code from Solid.js JSX code using Project References and placing the two forms of files in separate projects with their own tsconfig to ensure only certain types are available to each group of files).
So, I’m not sure, but it could be that I’m one of the few people testing unknown waters in TypeScript, and hitting this issue.
I have not tried with an older version of TypeScript, because @jsxImportSource
doesn’t work there, and import {JSX}
has never worked for JSX markup (#41813).
⏯ Playground Link
I tried to recreate the issue in playground, but due to https://github.com/microsoft/TypeScript-Website/issues/1427, @jsxImportSource
comments to not work in the playground, so I can’t reproduce a small version of my environment.
The following is my attempt to try @jsxImportSource
just to get started, but no luck (same example from https://github.com/microsoft/TypeScript-Website/issues/1427):
I’ll see if I can make a reproduction in a repo…
💻 Code
As you see in the video, I can hover on an unknown prop, and TypeScript will infer the type of the prop as whatever value I have set it to.
For example, in the next video I changed the value to a number, and now the type shows up as a number instead of a function:
https://user-images.githubusercontent.com/297678/104987468-a9aec080-59ca-11eb-83ed-11f802b4d8ba.mp4
I have double checked that the type supplied to JSX.IntrinsicElements
does not contain an index signature. There are only specific properties defined in the type of the video’s timeline-scrubber
.
🙁 Actual behavior
It infers unknown props.
🙂 Expected behavior
It should give a type error.
Issue Analytics
- State:
- Created 3 years ago
- Comments:6 (4 by maintainers)
@RyanCavanaugh How does this issue relate to https://github.com/microsoft/TypeScript/pull/26797 (which is closed in favor of the merged #44512)? Is it that the new index signature behavior allows to finally fix this issue?
If so, then doesn’t this issue need to be open, so that it can be fixed?
I still see the same unwanted behavior happening.
Users (library authors, custom element authors, etc) should be adding all the attribute types they need (to JSX types), and otherwise TS should error on unknown ones as a default.
Someone can easily add an index signature for
data-*
oraria-*
attributes to catch all of them.Can you please re-open this? 🙏
I think next steps would be:
-
check