Repository navigation
JSX bug when combining union and intersection types #15355
Description
TypeScript Versions: 2.2.2, and the 2.3.0 mistakenly released last week
Code
import * as React from 'react';
import { ComponentClass, StatelessComponent } from 'react';
export type ComponentType<P> = ComponentClass<P> | StatelessComponent<P>;
export function withProps<P1, P2>(Component: ComponentType<P1 & P2>, props1: P1) {
return (props2: P2) => <Component {...props1} {...props2} />;
}Expected behavior:
Successful compilation.
Actual behavior:
TS2324: Property 'children' is missing in type '(IntrinsicAttributes & IntrinsicClassAttributes<Component<P1 & P2, ComponentState>> & Readonly<{ ...'.
Seems to me that this should be possible, since separate functions for each half of the union type pass the typechecker successfully:
function withProps2<P1, P2>(Component: StatelessComponent<P1 & P2>, props1: P1) {
return (props2: P2) => <Component {...props1} {...props2} />;
}
function withProps3<P1, P2>(Component: ComponentClass<P1 & P2>, props1: P1) {
return (props2: P2) => <Component {...props1} {...props2} />;
}
Activity
mhegazy commentedon Apr 24, 2017
I am not getting these errors running locally. Can you share a self contained repro?
whatisaphone commentedon Apr 25, 2017
After digging deeper, it turns out the root cause of my issue is already tracked by #10727 and #13288, so this can be closed. I'll wait for 2.3. Sorry for the noise!
mhegazy commentedon May 19, 2017
Automatically closing this issue for housekeeping purposes. The issue labels indicate that it is unactionable at the moment or has already been addressed.