Skip to content

Commit 47f10b3

Browse files
committed
test cases for jsx elements
1 parent 1a24143 commit 47f10b3

6 files changed

+398
-0
lines changed

tests/cases/compiler/jsxReactApp.tsx

+195
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,195 @@
1+
declare module React {
2+
3+
interface ComponentClass<P> {
4+
new(props: any): Component<any, any>;
5+
prototype: { props: P };
6+
}
7+
8+
interface ReactCompositeElement<P extends ReactAttributes> {
9+
type: ComponentClass<P>;
10+
props?: P;
11+
key?: number | string;
12+
ref?: string;
13+
}
14+
15+
interface ReactHtmlElement {
16+
type: string;
17+
props?: ReactAttributes;
18+
key?: number | string;
19+
ref?: string;
20+
}
21+
22+
type ReactElement = ReactCompositeElement<any> | ReactHtmlElement;
23+
24+
interface ReactElementArray extends Array<string | ReactElement | ReactElementArray> {
25+
26+
}
27+
28+
class Component<P extends ReactAttributes, S> {
29+
constructor(props: P, childen?: any[]);
30+
31+
props: P;
32+
state: S;
33+
34+
setState(state: S, callback?: () => void): void
35+
render(): ReactElement;
36+
}
37+
38+
interface ReactAttributes {
39+
children?: ReactElementArray;
40+
key?: number | string;
41+
ref?: string;
42+
43+
// Event Attributes
44+
45+
dangerouslySetInnerHTML?: {
46+
__html: string;
47+
};
48+
}
49+
50+
interface HTMLAttributes extends ReactAttributes {
51+
accept?: string;
52+
acceptCharset?: string;
53+
accessKey?: string;
54+
action?: string;
55+
allowFullScreen?: boolean;
56+
allowTransparency?: boolean;
57+
alt?: string;
58+
async?: boolean;
59+
autoComplete?: boolean;
60+
autoFocus?: boolean;
61+
autoPlay?: boolean;
62+
cellPadding?: number | string;
63+
cellSpacing?: number | string;
64+
charSet?: string;
65+
checked?: boolean;
66+
classID?: string;
67+
className?: string;
68+
cols?: number;
69+
colSpan?: number;
70+
content?: string;
71+
contentEditable?: boolean;
72+
contextMenu?: string;
73+
controls?: any;
74+
coords?: string;
75+
crossOrigin?: string;
76+
data?: string;
77+
dateTime?: string;
78+
defer?: boolean;
79+
dir?: string;
80+
disabled?: boolean;
81+
download?: any;
82+
draggable?: boolean;
83+
encType?: string;
84+
form?: string;
85+
formNoValidate?: boolean;
86+
frameBorder?: number | string;
87+
height?: number | string;
88+
hidden?: boolean;
89+
href?: string;
90+
hrefLang?: string;
91+
htmlFor?: string;
92+
httpEquiv?: string;
93+
icon?: string;
94+
id?: string;
95+
label?: string;
96+
lang?: string;
97+
list?: string;
98+
loop?: boolean;
99+
manifest?: string;
100+
max?: number | string;
101+
maxLength?: number;
102+
media?: string;
103+
mediaGroup?: string;
104+
method?: string;
105+
min?: number | string;
106+
multiple?: boolean;
107+
muted?: boolean;
108+
name?: string;
109+
noValidate?: boolean;
110+
open?: boolean;
111+
pattern?: string;
112+
placeholder?: string;
113+
poster?: string;
114+
preload?: string;
115+
radioGroup?: string;
116+
readOnly?: boolean;
117+
rel?: string;
118+
required?: boolean;
119+
role?: string;
120+
rows?: number;
121+
rowSpan?: number;
122+
sandbox?: string;
123+
scope?: string;
124+
scrollLeft?: number;
125+
scrolling?: string;
126+
scrollTop?: number;
127+
seamless?: boolean;
128+
selected?: boolean;
129+
shape?: string;
130+
size?: number;
131+
sizes?: string;
132+
span?: number;
133+
spellCheck?: boolean;
134+
src?: string;
135+
srcDoc?: string;
136+
srcSet?: string;
137+
start?: number;
138+
step?: number | string;
139+
tabIndex?: number;
140+
target?: string;
141+
title?: string;
142+
type?: string;
143+
useMap?: string;
144+
value?: string;
145+
width?: number | string;
146+
wmode?: string;
147+
148+
// Non-standard Attributes
149+
autoCapitalize?: boolean;
150+
autoCorrect?: boolean;
151+
property?: string;
152+
itemProp?: string;
153+
itemScope?: boolean;
154+
itemType?: string;
155+
}
156+
157+
function createElement(type: string, props?: HTMLAttributes, ...rest: any[]): ReactHtmlElement;
158+
function createElement<P>(type: ComponentClass<P>, props?: P, ...rest: any[]): ReactCompositeElement<P>;
159+
}
160+
161+
class TodoList extends React.Component<{ items: string[] },{}> {
162+
render(): React.ReactElement {
163+
return <ul>{this.props.items.map(itemText => <li>{itemText}</li>)}</ul>;
164+
}
165+
}
166+
167+
class TodoApp extends React.Component<{},{items?: string[]; text?: string}> {
168+
state = {items: [], text: ''};
169+
170+
onChange = (e: any) => {
171+
this.setState({
172+
text: <string>e.target.value
173+
});
174+
}
175+
176+
handleSubmit = (e: any) => {
177+
e.preventDefault();
178+
var nextItems = this.state.items.concat([this.state.text]);
179+
var nextText = '';
180+
this.setState({items: nextItems, text: nextText});
181+
}
182+
183+
render(): React.ReactElement {
184+
return (
185+
<div>
186+
<h3>TODO</h3>
187+
<TodoList items={this.state.items} />
188+
<form onSubmit={this.handleSubmit}>
189+
<input onChange={this.onChange} value={this.state.text} />
190+
<button>{'Add #' + (this.state.items.length + 1)}</button>
191+
</form>
192+
</div>
193+
);
194+
}
195+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
2+
<any> { test: <any></any> };
3+
4+
<any><any></any>;
5+
6+
<foo>hello {<foo>{}} </foo>;
7+
8+
<foo test={<foo>{}}>hello</foo>;
9+
10+
<foo test={<foo>{}}>hello{<foo>{}}</foo>;
11+
12+
<foo>{<foo><foo>{/foo/.test(x) ? <foo><foo></foo> : <foo><foo></foo>}</foo>}</foo>
13+
14+
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<a></b>;
2+
<a> foo {}</b>;
3+
<a> foo bar</b>;
4+
<MyElement.myProperty> Hello </
5+
MyElement.
6+
myProperty
7+
>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
2+
<a />;
3+
4+
//<n:a n:v />; Namespace unsuported
5+
6+
//<a n:foo="bar"> {value} <b><c /></b></a>; Namespace unsuported
7+
8+
<a b={" "} c=" " d="&amp;" e="id=1&group=2" f="&#123456789" g="&#123*;" h="&#x;" />;
9+
10+
<a b="&notanentity;" />;
11+
<a
12+
/>;
13+
14+
<日本語></日本語>;
15+
16+
<AbC_def
17+
test="&#x0026;&#38;">
18+
bar
19+
baz
20+
</AbC_def>;
21+
22+
<a b={x ? <c /> : <d />} />;
23+
24+
<a>{}</a>;
25+
26+
<a>{/* this is a comment */}</a>;
27+
28+
<div>@test content</div>;
29+
30+
<div><br />7x invalid-js-identifier</div>;
31+
32+
<LeftRight left=<a /> right=<b>monkeys /> gorillas</b> />;
33+
34+
<a.b></a.b>;
35+
36+
<a.b.c></a.b.c>;
37+
38+
(<div />) < x;
39+
40+
<div {...props} />;
41+
42+
<div {...props} post="attribute" />;
43+
44+
<div pre="leading" pre2="attribute" {...props}></div>;
45+
46+
<a> </a>;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
2+
</>;
3+
<a: />;
4+
<:a />;
5+
<a b=d />;
6+
<a>;
7+
<a></b>;
8+
<a foo="bar;
9+
<a:b></b>;
10+
<a:b.c></a:b.c>;
11+
<a.b:c></a.b:c>;
12+
<a.b.c></a>;
13+
<.a></.a>;
14+
<a.></a.>;
15+
<a[foo]></a[foo]>;
16+
<a['foo']></a['foo']>;
17+
<a><a />;
18+
<a b={}>;
19+
var x = <div>one</div><div>two</div>;;
20+
var x = <div>one</div> /* intervening comment */ <div>two</div>;;
21+
<a>{"str";}</a>;
22+
<span className="a", id="b" />;
23+
<div className"app">;
24+
<div {props} />;
25+
26+
<div>stuff</div {...props}>;
27+
<div {...props}>stuff</div {...props}>;
28+
29+
<a>></a>;
30+
<a> ></a>;
31+
<a b=}>;
32+
<a b=<}>;
33+
<a>}</a>;
34+
<a .../*hai*/asdf/>;

0 commit comments

Comments
 (0)