Excess property checking on nested objects doesn't work in JSX as of TS 3.2

[pelotom]

TypeScript Version: 3.2.2

Search Terms:

excess property jsx

Code

function Foo(props: { x: { foo: number } }) {
  return null;
}

Foo({ x: { foo: 42, bar: 'hello' } }); // <-- correctly has error
<Foo x={{ foo: 42, bar: 'hello' }} />; // <-- incorrectly has no error

Expected behavior:

Both of the last 2 lines should exhibit an excess property error.

Actual behavior:

Only the first line does.

Related Issues:

It's also the case that

React.createElement(Foo, { x: { foo: 42, bar: 'hello' } });

fails to produce the error, however by tweaking the type of createElement in @types/react I'm able to fix that. So #14729 seems related, in that, if the JSX type checking were based on createElement's type, this issue could be fixed by fixing @types/react.

[christianalfoni]

After playing around with this for ages I got to the same conclusion, here shown in a Codesandbox: https://codesandbox.io/s/sleepy-moon-dqzl7

The funny thing is that the type error appears on the first property added to the object, but as soon as you have one valid property, all of them becomes valid.

Is this issue still considered a bug, now in the backlog?

[jakebailey]

This one was fixed by #30853 but was missed in the list of issues it closed (but the PR does explicitly call out JSX excess property checking).