Missing error after spreading generic props into JSX

[OliverJAsh]

TypeScript Version: 3.2.2

Search Terms:

Code

type Component<P> = (props: P) => any;

const myHof = <ComposedComponentProps extends any>(
    ComposedComponent: Component<ComposedComponentProps>,
) => {
    type WrapperComponentProps = ComposedComponentProps & { myProp: string };
    declare const WrapperComponent: Component<WrapperComponentProps>;

    declare const props: ComposedComponentProps;

    // Expected no error, got none - good
    WrapperComponent({ ...props, myProp: '1000000' });
    // Expected error, got one - good
    WrapperComponent({ ...props, myProp: 1000000 });
}

However, when I try to do the same with React (.tsx):

import React from 'react';

const myHoc = <ComposedComponentProps extends any>(
    ComposedComponent: React.ComponentClass<ComposedComponentProps>,
) => {
    type WrapperComponentProps = ComposedComponentProps & { myProp: string };
    declare const WrapperComponent: React.ComponentClass<WrapperComponentProps>;

    declare const props: ComposedComponentProps;

    // Expected no error, got none - good
    <WrapperComponent {...props} myProp={'1000000'} />;
    // Expected error, but got none - bad!
    <WrapperComponent {...props} myProp={1000000} />;
};

[weswigham]

Looks like the issue is caused by the extends any. As a workaround, use extends unknown (to which it should behave identically to) until we have a fix in, instead.

[OliverJAsh]

Aha, thanks. The reason I do the extends btw is because it's needed for arrow functions in .jsx/.tsx.

[weswigham]

@OliverJAsh A trailing comma on the type argument list should disambiguate as well.

[RyanCavanaugh]

@weswigham let's please merge at the start of the 3.9 branch