For JSX Attributes, map over unions of props for contextual types (#17790)

* For JSX Attributes, allow attributes to fulfill the member of any union member; rather than all of them

* Use cached way of getting partial union members

* Reuse methodology used for object literals for jsx attributes

* Inline assignment

* Rename type

src/compiler/checker.ts

@@ -13121,12 +13121,12 @@ namespace ts {
 
             if (isJsxAttribute(node.parent)) {
                 // JSX expression is in JSX attribute
-                return getTypeOfPropertyOfType(attributesType, node.parent.name.escapedText);
+                return getTypeOfPropertyOfContextualType(attributesType, node.parent.name.escapedText);
             }
             else if (node.parent.kind === SyntaxKind.JsxElement) {
                 // JSX expression is in children of JSX Element, we will look for an "children" atttribute (we get the name from JSX.ElementAttributesProperty)
                 const jsxChildrenPropertyName = getJsxElementChildrenPropertyname();
-                return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfType(attributesType, jsxChildrenPropertyName) : anyType;
+                return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfContextualType(attributesType, jsxChildrenPropertyName) : anyType;
             }
             else {
                 // JSX expression is in JSX spread attribute
@@ -13144,7 +13144,7 @@ namespace ts {
                 if (!attributesType || isTypeAny(attributesType)) {
                     return undefined;
                 }
-                return getTypeOfPropertyOfType(attributesType, attribute.name.escapedText);
+                return getTypeOfPropertyOfContextualType(attributesType, attribute.name.escapedText);
             }
             else {
                 return attributesType;

tests/baselines/reference/tsxInferenceShouldNotYieldAnyOnUnions.js

@@ -0,0 +1,40 @@
+//// [index.tsx]
+namespace JSX {
+    export interface Element {}
+}
+
+type Props<T> = PropsBase<string> | PropsWithConvert<T>;
+
+interface PropsBase<T> {
+    data: T;
+}
+
+interface PropsWithConvert<T> extends PropsBase<T> {
+    convert: (t: T) => string;
+}
+
+function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
+    return <div />;
+}
+
+// Sanity check: function call equivalent versions work fine
+ShouldInferFromData({ data: "1" });
+ShouldInferFromData({ data: "1", convert: n => "" + n });
+ShouldInferFromData({ data: 2, convert: n => "" + n });
+
+
+const f1 = <ShouldInferFromData data={"1"} />;
+const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
+const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
+
+//// [index.jsx]
+function ShouldInferFromData(props) {
+    return <div />;
+}
+// Sanity check: function call equivalent versions work fine
+ShouldInferFromData({ data: "1" });
+ShouldInferFromData({ data: "1", convert: function (n) { return "" + n; } });
+ShouldInferFromData({ data: 2, convert: function (n) { return "" + n; } });
+var f1 = <ShouldInferFromData data={"1"}/>;
+var f2 = <ShouldInferFromData data={"1"} convert={function (n) { return "" + n; }}/>;
+var f3 = <ShouldInferFromData data={2} convert={function (n) { return "" + n; }}/>;

tests/baselines/reference/tsxInferenceShouldNotYieldAnyOnUnions.symbols

@@ -0,0 +1,90 @@
+=== tests/cases/compiler/index.tsx ===
+namespace JSX {
+>JSX : Symbol(JSX, Decl(index.tsx, 0, 0))
+
+    export interface Element {}
+>Element : Symbol(Element, Decl(index.tsx, 0, 15))
+}
+
+type Props<T> = PropsBase<string> | PropsWithConvert<T>;
+>Props : Symbol(Props, Decl(index.tsx, 2, 1))
+>T : Symbol(T, Decl(index.tsx, 4, 11))
+>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
+>PropsWithConvert : Symbol(PropsWithConvert, Decl(index.tsx, 8, 1))
+>T : Symbol(T, Decl(index.tsx, 4, 11))
+
+interface PropsBase<T> {
+>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
+>T : Symbol(T, Decl(index.tsx, 6, 20))
+
+    data: T;
+>data : Symbol(PropsBase.data, Decl(index.tsx, 6, 24))
+>T : Symbol(T, Decl(index.tsx, 6, 20))
+}
+
+interface PropsWithConvert<T> extends PropsBase<T> {
+>PropsWithConvert : Symbol(PropsWithConvert, Decl(index.tsx, 8, 1))
+>T : Symbol(T, Decl(index.tsx, 10, 27))
+>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
+>T : Symbol(T, Decl(index.tsx, 10, 27))
+
+    convert: (t: T) => string;
+>convert : Symbol(PropsWithConvert.convert, Decl(index.tsx, 10, 52))
+>t : Symbol(t, Decl(index.tsx, 11, 14))
+>T : Symbol(T, Decl(index.tsx, 10, 27))
+}
+
+function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>T : Symbol(T, Decl(index.tsx, 14, 29))
+>props : Symbol(props, Decl(index.tsx, 14, 32))
+>Props : Symbol(Props, Decl(index.tsx, 2, 1))
+>T : Symbol(T, Decl(index.tsx, 14, 29))
+>JSX : Symbol(JSX, Decl(index.tsx, 0, 0))
+>Element : Symbol(JSX.Element, Decl(index.tsx, 0, 15))
+
+    return <div />;
+>div : Symbol(unknown)
+}
+
+// Sanity check: function call equivalent versions work fine
+ShouldInferFromData({ data: "1" });
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 19, 21))
+
+ShouldInferFromData({ data: "1", convert: n => "" + n });
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 20, 21))
+>convert : Symbol(convert, Decl(index.tsx, 20, 32))
+>n : Symbol(n, Decl(index.tsx, 20, 41))
+>n : Symbol(n, Decl(index.tsx, 20, 41))
+
+ShouldInferFromData({ data: 2, convert: n => "" + n });
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 21, 21))
+>convert : Symbol(convert, Decl(index.tsx, 21, 30))
+>n : Symbol(n, Decl(index.tsx, 21, 39))
+>n : Symbol(n, Decl(index.tsx, 21, 39))
+
+
+const f1 = <ShouldInferFromData data={"1"} />;
+>f1 : Symbol(f1, Decl(index.tsx, 24, 5))
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 24, 31))
+
+const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
+>f2 : Symbol(f2, Decl(index.tsx, 25, 5))
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 25, 31))
+>convert : Symbol(convert, Decl(index.tsx, 25, 42))
+>n : Symbol(n, Decl(index.tsx, 25, 52))
+>n : Symbol(n, Decl(index.tsx, 25, 52))
+
+const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
+>f3 : Symbol(f3, Decl(index.tsx, 26, 5))
+>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
+>data : Symbol(data, Decl(index.tsx, 26, 31))
+>convert : Symbol(convert, Decl(index.tsx, 26, 40))
+>n : Symbol(n, Decl(index.tsx, 26, 50))
+>n : Symbol(n, Decl(index.tsx, 26, 50))
+

tests/baselines/reference/tsxInferenceShouldNotYieldAnyOnUnions.types

@@ -0,0 +1,118 @@
+=== tests/cases/compiler/index.tsx ===
+namespace JSX {
+>JSX : any
+
+    export interface Element {}
+>Element : Element
+}
+
+type Props<T> = PropsBase<string> | PropsWithConvert<T>;
+>Props : Props<T>
+>T : T
+>PropsBase : PropsBase<T>
+>PropsWithConvert : PropsWithConvert<T>
+>T : T
+
+interface PropsBase<T> {
+>PropsBase : PropsBase<T>
+>T : T
+
+    data: T;
+>data : T
+>T : T
+}
+
+interface PropsWithConvert<T> extends PropsBase<T> {
+>PropsWithConvert : PropsWithConvert<T>
+>T : T
+>PropsBase : PropsBase<T>
+>T : T
+
+    convert: (t: T) => string;
+>convert : (t: T) => string
+>t : T
+>T : T
+}
+
+function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>T : T
+>props : Props<T>
+>Props : Props<T>
+>T : T
+>JSX : any
+>Element : JSX.Element
+
+    return <div />;
+><div /> : JSX.Element
+>div : any
+}
+
+// Sanity check: function call equivalent versions work fine
+ShouldInferFromData({ data: "1" });
+>ShouldInferFromData({ data: "1" }) : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>{ data: "1" } : { data: string; }
+>data : string
+>"1" : "1"
+
+ShouldInferFromData({ data: "1", convert: n => "" + n });
+>ShouldInferFromData({ data: "1", convert: n => "" + n }) : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>{ data: "1", convert: n => "" + n } : { data: string; convert: (n: string) => string; }
+>data : string
+>"1" : "1"
+>convert : (n: string) => string
+>n => "" + n : (n: string) => string
+>n : string
+>"" + n : string
+>"" : ""
+>n : string
+
+ShouldInferFromData({ data: 2, convert: n => "" + n });
+>ShouldInferFromData({ data: 2, convert: n => "" + n }) : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>{ data: 2, convert: n => "" + n } : { data: number; convert: (n: number) => string; }
+>data : number
+>2 : 2
+>convert : (n: number) => string
+>n => "" + n : (n: number) => string
+>n : number
+>"" + n : string
+>"" : ""
+>n : number
+
+
+const f1 = <ShouldInferFromData data={"1"} />;
+>f1 : JSX.Element
+><ShouldInferFromData data={"1"} /> : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>data : string
+>"1" : "1"
+
+const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
+>f2 : JSX.Element
+><ShouldInferFromData data={"1"} convert={n => "" + n} /> : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>data : string
+>"1" : "1"
+>convert : (n: "1") => string
+>n => "" + n : (n: "1") => string
+>n : "1"
+>"" + n : string
+>"" : ""
+>n : "1"
+
+const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
+>f3 : JSX.Element
+><ShouldInferFromData data={2} convert={n => "" + n} /> : JSX.Element
+>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
+>data : number
+>2 : 2
+>convert : (n: 2) => string
+>n => "" + n : (n: 2) => string
+>n : 2
+>"" + n : string
+>"" : ""
+>n : 2
+

tests/cases/compiler/tsxInferenceShouldNotYieldAnyOnUnions.tsx

@@ -0,0 +1,29 @@
+// @jsx: preserve
+// @filename: index.tsx
+namespace JSX {
+    export interface Element {}
+}
+
+type Props<T> = PropsBase<string> | PropsWithConvert<T>;
+
+interface PropsBase<T> {
+    data: T;
+}
+
+interface PropsWithConvert<T> extends PropsBase<T> {
+    convert: (t: T) => string;
+}
+
+function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
+    return <div />;
+}
+
+// Sanity check: function call equivalent versions work fine
+ShouldInferFromData({ data: "1" });
+ShouldInferFromData({ data: "1", convert: n => "" + n });
+ShouldInferFromData({ data: 2, convert: n => "" + n });
+
+
+const f1 = <ShouldInferFromData data={"1"} />;
+const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
+const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;