Skip to content

Commit 009d9b4

Browse files
authored
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
1 parent bdc2aa8 commit 009d9b4

File tree

5 files changed

+280
-3
lines changed

5 files changed

+280
-3
lines changed

src/compiler/checker.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13121,12 +13121,12 @@ namespace ts {
1312113121

1312213122
if (isJsxAttribute(node.parent)) {
1312313123
// JSX expression is in JSX attribute
13124-
return getTypeOfPropertyOfType(attributesType, node.parent.name.escapedText);
13124+
return getTypeOfPropertyOfContextualType(attributesType, node.parent.name.escapedText);
1312513125
}
1312613126
else if (node.parent.kind === SyntaxKind.JsxElement) {
1312713127
// JSX expression is in children of JSX Element, we will look for an "children" atttribute (we get the name from JSX.ElementAttributesProperty)
1312813128
const jsxChildrenPropertyName = getJsxElementChildrenPropertyname();
13129-
return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfType(attributesType, jsxChildrenPropertyName) : anyType;
13129+
return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfContextualType(attributesType, jsxChildrenPropertyName) : anyType;
1313013130
}
1313113131
else {
1313213132
// JSX expression is in JSX spread attribute
@@ -13144,7 +13144,7 @@ namespace ts {
1314413144
if (!attributesType || isTypeAny(attributesType)) {
1314513145
return undefined;
1314613146
}
13147-
return getTypeOfPropertyOfType(attributesType, attribute.name.escapedText);
13147+
return getTypeOfPropertyOfContextualType(attributesType, attribute.name.escapedText);
1314813148
}
1314913149
else {
1315013150
return attributesType;
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
//// [index.tsx]
2+
namespace JSX {
3+
export interface Element {}
4+
}
5+
6+
type Props<T> = PropsBase<string> | PropsWithConvert<T>;
7+
8+
interface PropsBase<T> {
9+
data: T;
10+
}
11+
12+
interface PropsWithConvert<T> extends PropsBase<T> {
13+
convert: (t: T) => string;
14+
}
15+
16+
function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
17+
return <div />;
18+
}
19+
20+
// Sanity check: function call equivalent versions work fine
21+
ShouldInferFromData({ data: "1" });
22+
ShouldInferFromData({ data: "1", convert: n => "" + n });
23+
ShouldInferFromData({ data: 2, convert: n => "" + n });
24+
25+
26+
const f1 = <ShouldInferFromData data={"1"} />;
27+
const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
28+
const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
29+
30+
//// [index.jsx]
31+
function ShouldInferFromData(props) {
32+
return <div />;
33+
}
34+
// Sanity check: function call equivalent versions work fine
35+
ShouldInferFromData({ data: "1" });
36+
ShouldInferFromData({ data: "1", convert: function (n) { return "" + n; } });
37+
ShouldInferFromData({ data: 2, convert: function (n) { return "" + n; } });
38+
var f1 = <ShouldInferFromData data={"1"}/>;
39+
var f2 = <ShouldInferFromData data={"1"} convert={function (n) { return "" + n; }}/>;
40+
var f3 = <ShouldInferFromData data={2} convert={function (n) { return "" + n; }}/>;
Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
=== tests/cases/compiler/index.tsx ===
2+
namespace JSX {
3+
>JSX : Symbol(JSX, Decl(index.tsx, 0, 0))
4+
5+
export interface Element {}
6+
>Element : Symbol(Element, Decl(index.tsx, 0, 15))
7+
}
8+
9+
type Props<T> = PropsBase<string> | PropsWithConvert<T>;
10+
>Props : Symbol(Props, Decl(index.tsx, 2, 1))
11+
>T : Symbol(T, Decl(index.tsx, 4, 11))
12+
>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
13+
>PropsWithConvert : Symbol(PropsWithConvert, Decl(index.tsx, 8, 1))
14+
>T : Symbol(T, Decl(index.tsx, 4, 11))
15+
16+
interface PropsBase<T> {
17+
>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
18+
>T : Symbol(T, Decl(index.tsx, 6, 20))
19+
20+
data: T;
21+
>data : Symbol(PropsBase.data, Decl(index.tsx, 6, 24))
22+
>T : Symbol(T, Decl(index.tsx, 6, 20))
23+
}
24+
25+
interface PropsWithConvert<T> extends PropsBase<T> {
26+
>PropsWithConvert : Symbol(PropsWithConvert, Decl(index.tsx, 8, 1))
27+
>T : Symbol(T, Decl(index.tsx, 10, 27))
28+
>PropsBase : Symbol(PropsBase, Decl(index.tsx, 4, 56))
29+
>T : Symbol(T, Decl(index.tsx, 10, 27))
30+
31+
convert: (t: T) => string;
32+
>convert : Symbol(PropsWithConvert.convert, Decl(index.tsx, 10, 52))
33+
>t : Symbol(t, Decl(index.tsx, 11, 14))
34+
>T : Symbol(T, Decl(index.tsx, 10, 27))
35+
}
36+
37+
function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
38+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
39+
>T : Symbol(T, Decl(index.tsx, 14, 29))
40+
>props : Symbol(props, Decl(index.tsx, 14, 32))
41+
>Props : Symbol(Props, Decl(index.tsx, 2, 1))
42+
>T : Symbol(T, Decl(index.tsx, 14, 29))
43+
>JSX : Symbol(JSX, Decl(index.tsx, 0, 0))
44+
>Element : Symbol(JSX.Element, Decl(index.tsx, 0, 15))
45+
46+
return <div />;
47+
>div : Symbol(unknown)
48+
}
49+
50+
// Sanity check: function call equivalent versions work fine
51+
ShouldInferFromData({ data: "1" });
52+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
53+
>data : Symbol(data, Decl(index.tsx, 19, 21))
54+
55+
ShouldInferFromData({ data: "1", convert: n => "" + n });
56+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
57+
>data : Symbol(data, Decl(index.tsx, 20, 21))
58+
>convert : Symbol(convert, Decl(index.tsx, 20, 32))
59+
>n : Symbol(n, Decl(index.tsx, 20, 41))
60+
>n : Symbol(n, Decl(index.tsx, 20, 41))
61+
62+
ShouldInferFromData({ data: 2, convert: n => "" + n });
63+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
64+
>data : Symbol(data, Decl(index.tsx, 21, 21))
65+
>convert : Symbol(convert, Decl(index.tsx, 21, 30))
66+
>n : Symbol(n, Decl(index.tsx, 21, 39))
67+
>n : Symbol(n, Decl(index.tsx, 21, 39))
68+
69+
70+
const f1 = <ShouldInferFromData data={"1"} />;
71+
>f1 : Symbol(f1, Decl(index.tsx, 24, 5))
72+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
73+
>data : Symbol(data, Decl(index.tsx, 24, 31))
74+
75+
const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
76+
>f2 : Symbol(f2, Decl(index.tsx, 25, 5))
77+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
78+
>data : Symbol(data, Decl(index.tsx, 25, 31))
79+
>convert : Symbol(convert, Decl(index.tsx, 25, 42))
80+
>n : Symbol(n, Decl(index.tsx, 25, 52))
81+
>n : Symbol(n, Decl(index.tsx, 25, 52))
82+
83+
const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
84+
>f3 : Symbol(f3, Decl(index.tsx, 26, 5))
85+
>ShouldInferFromData : Symbol(ShouldInferFromData, Decl(index.tsx, 12, 1))
86+
>data : Symbol(data, Decl(index.tsx, 26, 31))
87+
>convert : Symbol(convert, Decl(index.tsx, 26, 40))
88+
>n : Symbol(n, Decl(index.tsx, 26, 50))
89+
>n : Symbol(n, Decl(index.tsx, 26, 50))
90+
Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
=== tests/cases/compiler/index.tsx ===
2+
namespace JSX {
3+
>JSX : any
4+
5+
export interface Element {}
6+
>Element : Element
7+
}
8+
9+
type Props<T> = PropsBase<string> | PropsWithConvert<T>;
10+
>Props : Props<T>
11+
>T : T
12+
>PropsBase : PropsBase<T>
13+
>PropsWithConvert : PropsWithConvert<T>
14+
>T : T
15+
16+
interface PropsBase<T> {
17+
>PropsBase : PropsBase<T>
18+
>T : T
19+
20+
data: T;
21+
>data : T
22+
>T : T
23+
}
24+
25+
interface PropsWithConvert<T> extends PropsBase<T> {
26+
>PropsWithConvert : PropsWithConvert<T>
27+
>T : T
28+
>PropsBase : PropsBase<T>
29+
>T : T
30+
31+
convert: (t: T) => string;
32+
>convert : (t: T) => string
33+
>t : T
34+
>T : T
35+
}
36+
37+
function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
38+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
39+
>T : T
40+
>props : Props<T>
41+
>Props : Props<T>
42+
>T : T
43+
>JSX : any
44+
>Element : JSX.Element
45+
46+
return <div />;
47+
><div /> : JSX.Element
48+
>div : any
49+
}
50+
51+
// Sanity check: function call equivalent versions work fine
52+
ShouldInferFromData({ data: "1" });
53+
>ShouldInferFromData({ data: "1" }) : JSX.Element
54+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
55+
>{ data: "1" } : { data: string; }
56+
>data : string
57+
>"1" : "1"
58+
59+
ShouldInferFromData({ data: "1", convert: n => "" + n });
60+
>ShouldInferFromData({ data: "1", convert: n => "" + n }) : JSX.Element
61+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
62+
>{ data: "1", convert: n => "" + n } : { data: string; convert: (n: string) => string; }
63+
>data : string
64+
>"1" : "1"
65+
>convert : (n: string) => string
66+
>n => "" + n : (n: string) => string
67+
>n : string
68+
>"" + n : string
69+
>"" : ""
70+
>n : string
71+
72+
ShouldInferFromData({ data: 2, convert: n => "" + n });
73+
>ShouldInferFromData({ data: 2, convert: n => "" + n }) : JSX.Element
74+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
75+
>{ data: 2, convert: n => "" + n } : { data: number; convert: (n: number) => string; }
76+
>data : number
77+
>2 : 2
78+
>convert : (n: number) => string
79+
>n => "" + n : (n: number) => string
80+
>n : number
81+
>"" + n : string
82+
>"" : ""
83+
>n : number
84+
85+
86+
const f1 = <ShouldInferFromData data={"1"} />;
87+
>f1 : JSX.Element
88+
><ShouldInferFromData data={"1"} /> : JSX.Element
89+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
90+
>data : string
91+
>"1" : "1"
92+
93+
const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
94+
>f2 : JSX.Element
95+
><ShouldInferFromData data={"1"} convert={n => "" + n} /> : JSX.Element
96+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
97+
>data : string
98+
>"1" : "1"
99+
>convert : (n: "1") => string
100+
>n => "" + n : (n: "1") => string
101+
>n : "1"
102+
>"" + n : string
103+
>"" : ""
104+
>n : "1"
105+
106+
const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;
107+
>f3 : JSX.Element
108+
><ShouldInferFromData data={2} convert={n => "" + n} /> : JSX.Element
109+
>ShouldInferFromData : <T>(props: Props<T>) => JSX.Element
110+
>data : number
111+
>2 : 2
112+
>convert : (n: 2) => string
113+
>n => "" + n : (n: 2) => string
114+
>n : 2
115+
>"" + n : string
116+
>"" : ""
117+
>n : 2
118+
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
// @jsx: preserve
2+
// @filename: index.tsx
3+
namespace JSX {
4+
export interface Element {}
5+
}
6+
7+
type Props<T> = PropsBase<string> | PropsWithConvert<T>;
8+
9+
interface PropsBase<T> {
10+
data: T;
11+
}
12+
13+
interface PropsWithConvert<T> extends PropsBase<T> {
14+
convert: (t: T) => string;
15+
}
16+
17+
function ShouldInferFromData<T>(props: Props<T>): JSX.Element {
18+
return <div />;
19+
}
20+
21+
// Sanity check: function call equivalent versions work fine
22+
ShouldInferFromData({ data: "1" });
23+
ShouldInferFromData({ data: "1", convert: n => "" + n });
24+
ShouldInferFromData({ data: 2, convert: n => "" + n });
25+
26+
27+
const f1 = <ShouldInferFromData data={"1"} />;
28+
const f2 = <ShouldInferFromData data={"1"} convert={n => "" + n} />;
29+
const f3 = <ShouldInferFromData data={2} convert={n => "" + n} />;

0 commit comments

Comments
 (0)