mirror of
https://github.com/microsoft/TypeScript.git
synced 2025-11-18 17:21:48 +00:00
Conformance tests for JSX
This commit is contained in:
Ryan Cavanaugh
@@ -0,0 +1,22 @@
|
||||
// @jsx: preserve
|
||||
|
||||
declare var createElement: any;
|
||||
|
||||
class foo {}
|
||||
|
||||
var x: any;
|
||||
x = <any> { test: <any></any> };
|
||||
|
||||
x = <any><any></any>;
|
||||
|
||||
x = <foo>hello {<foo>{}} </foo>;
|
||||
|
||||
x = <foo test={<foo>{}}>hello</foo>;
|
||||
|
||||
x = <foo test={<foo>{}}>hello{<foo>{}}</foo>;
|
||||
|
||||
x = <foo>x</foo>, x = <foo/>;
|
||||
|
||||
<foo>{<foo><foo>{/foo/.test(x) ? <foo><foo></foo> : <foo><foo></foo>}</foo>}</foo>
|
||||
|
||||
|
||||
@@ -0,0 +1,54 @@
|
||||
// @jsx: preserve
|
||||
declare var React: any;
|
||||
declare var 日本語;
|
||||
declare var AbC_def;
|
||||
declare var LeftRight;
|
||||
declare var x;
|
||||
declare var a;
|
||||
declare var props;
|
||||
|
||||
<a />;
|
||||
|
||||
//<n:a n:v />; Namespace unsuported
|
||||
|
||||
//<a n:foo="bar"> {value} <b><c /></b></a>; Namespace unsuported
|
||||
|
||||
<a b={" "} c=" " d="&" e="id=1&group=2" f="�" g="{*;" h="&#x;" />;
|
||||
|
||||
<a b="¬anentity;" />;
|
||||
<a
|
||||
/>;
|
||||
|
||||
<日本語></日本語>;
|
||||
|
||||
<AbC_def
|
||||
test="&&">
|
||||
bar
|
||||
baz
|
||||
</AbC_def>;
|
||||
|
||||
<a b={x ? <c /> : <d />} />;
|
||||
|
||||
<a>{}</a>;
|
||||
|
||||
<a>{/* this is a comment */}</a>;
|
||||
|
||||
<div>@test content</div>;
|
||||
|
||||
<div><br />7x invalid-js-identifier</div>;
|
||||
|
||||
<LeftRight left=<a /> right=<b>monkeys /> gorillas</b> />;
|
||||
|
||||
<a.b></a.b>;
|
||||
|
||||
<a.b.c></a.b.c>;
|
||||
|
||||
(<div />) < x;
|
||||
|
||||
<div {...props} />;
|
||||
|
||||
<div {...props} post="attribute" />;
|
||||
|
||||
<div pre="leading" pre2="attribute" {...props}></div>;
|
||||
|
||||
<a> </a>;
|
||||
@@ -0,0 +1,36 @@
|
||||
// @jsx: preserve
|
||||
declare var React: any;
|
||||
|
||||
</>;
|
||||
<a: />;
|
||||
<:a />;
|
||||
<a b=d />;
|
||||
<a>;
|
||||
<a></b>;
|
||||
<a foo="bar;
|
||||
<a:b></b>;
|
||||
<a:b.c></a:b.c>;
|
||||
<a.b:c></a.b:c>;
|
||||
<a.b.c></a>;
|
||||
<.a></.a>;
|
||||
<a.></a.>;
|
||||
<a[foo]></a[foo]>;
|
||||
<a['foo']></a['foo']>;
|
||||
<a><a />;
|
||||
<a b={}>;
|
||||
var x = <div>one</div><div>two</div>;;
|
||||
var x = <div>one</div> /* intervening comment */ <div>two</div>;;
|
||||
<a>{"str";}</a>;
|
||||
<span className="a", id="b" />;
|
||||
<div className"app">;
|
||||
<div {props} />;
|
||||
|
||||
<div>stuff</div {...props}>;
|
||||
<div {...props}>stuff</div {...props}>;
|
||||
|
||||
<a>></a>;
|
||||
<a> ></a>;
|
||||
<a b=}>;
|
||||
<a b=<}>;
|
||||
<a>}</a>;
|
||||
<a .../*hai*/asdf/>;
|
||||
@@ -0,0 +1,117 @@
|
||||
// @jsx: preserve
|
||||
|
||||
declare var React: any;
|
||||
declare var Component:any;
|
||||
declare var Composite:any;
|
||||
declare var Composite2:any;
|
||||
declare var Child:any;
|
||||
declare var Namespace:any;
|
||||
declare var foo: any;
|
||||
declare var bar: any;
|
||||
declare var y:any;
|
||||
declare var x:any;
|
||||
declare var z:any;
|
||||
declare var hasOwnProperty:any;
|
||||
|
||||
<div>text</div>;
|
||||
|
||||
<div>
|
||||
{this.props.children}
|
||||
</div>;
|
||||
|
||||
<div>
|
||||
<div><br /></div>
|
||||
<Component>{foo}<br />{bar}</Component>
|
||||
<br />
|
||||
</div>;
|
||||
|
||||
|
||||
<Composite>
|
||||
{this.props.children}
|
||||
</Composite>;
|
||||
|
||||
<Composite>
|
||||
<Composite2 />
|
||||
</Composite>;
|
||||
|
||||
var x =
|
||||
<div
|
||||
attr1={
|
||||
"foo" + "bar"
|
||||
}
|
||||
attr2={
|
||||
"foo" + "bar" +
|
||||
|
||||
"baz" + "bug"
|
||||
}
|
||||
attr3={
|
||||
"foo" + "bar" +
|
||||
"baz" + "bug"
|
||||
// Extra line here.
|
||||
}
|
||||
attr4="baz">
|
||||
</div>;
|
||||
|
||||
(
|
||||
<div>
|
||||
{/* A comment at the beginning */}
|
||||
{/* A second comment at the beginning */}
|
||||
<span>
|
||||
{/* A nested comment */}
|
||||
</span>
|
||||
{/* A sandwiched comment */}
|
||||
<br />
|
||||
{/* A comment at the end */}
|
||||
{/* A second comment at the end */}
|
||||
</div>
|
||||
);
|
||||
|
||||
(
|
||||
<div
|
||||
/* a multi-line
|
||||
comment */
|
||||
attr1="foo">
|
||||
<span // a double-slash comment
|
||||
attr2="bar"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
<div> </div>;
|
||||
|
||||
<div> </div>;
|
||||
|
||||
<hasOwnProperty>testing</hasOwnProperty>;
|
||||
|
||||
<Component constructor="foo" />;
|
||||
|
||||
<Namespace.Component />;
|
||||
|
||||
<Namespace.DeepNamespace.Component />;
|
||||
|
||||
<Component { ... x } y
|
||||
={2 } z />;
|
||||
|
||||
<Component
|
||||
{...this.props} sound="moo" />;
|
||||
|
||||
<font-face />;
|
||||
|
||||
<Component x={y} />;
|
||||
|
||||
<x-component />;
|
||||
|
||||
<Component {...x} />;
|
||||
|
||||
<Component { ...x } y={2} />;
|
||||
|
||||
<Component { ... x } y={2} z />;
|
||||
|
||||
<Component x={1} {...y} />;
|
||||
|
||||
|
||||
<Component x={1} y="2" {...z} {...z}><Child /></Component>;
|
||||
|
||||
<Component x="1" {...(z = { y: 2 }, z)} z={3}>Text</Component>;
|
||||
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
// @jsx: preserve
|
||||
|
||||
declare namespace JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
div: {
|
||||
text?: string;
|
||||
width?: number;
|
||||
}
|
||||
|
||||
span: any;
|
||||
}
|
||||
}
|
||||
|
||||
// Error, number is not assignable to string
|
||||
<div text={42} />;
|
||||
|
||||
// Error, string is not assignable to number
|
||||
<div width={'foo'} />;
|
||||
|
||||
// Error, number is not assignable to string
|
||||
var attribs = { text: 100 };
|
||||
<div {...attribs} />;
|
||||
|
||||
// No errors here
|
||||
<span foo='bar' bar={'foo'} />;
|
||||
@@ -0,0 +1,12 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: { "data-foo"?: string };
|
||||
}
|
||||
}
|
||||
|
||||
// Invalid names
|
||||
<test1 32data={32} />;
|
||||
<test1 -data={32} />;
|
||||
@@ -0,0 +1,9 @@
|
||||
/// @jsx: preserve
|
||||
|
||||
declare namespace JSX {
|
||||
interface IntrinsicElements {
|
||||
x: { y: number; z: string; };
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
// OK
|
||||
<test1 x={0}/>; // OK
|
||||
<test1 />; // OK
|
||||
<test1 data-x={true}/>; // OK
|
||||
<test2 reqd='true'/>; // OK
|
||||
<test2 reqd={'true'}/>; // OK
|
||||
// Errors
|
||||
<test1 x={'0'}/>; // Error, '0' is not number
|
||||
<test1 y={0}/>; // Error, no property "y"
|
||||
<test1 y="foo"/>; // Error, no property "y"
|
||||
<test1 x="32"/>; // Error, "32" is not number
|
||||
// TODO attribute 'var' should be parseable
|
||||
// <test1 var="10" />; // Error, no 'var' property
|
||||
<test2 />; // Error, missing reqd
|
||||
<test2 reqd={10}/>; // Error, reqd is not string
|
||||
@@ -0,0 +1,33 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: Attribs1;
|
||||
test2: { reqd: string };
|
||||
}
|
||||
}
|
||||
interface Attribs1 {
|
||||
x?: number;
|
||||
s?: string;
|
||||
}
|
||||
|
||||
// OK
|
||||
<test1 x={0} />; // OK
|
||||
<test1 />; // OK
|
||||
<test1 data-x={true} />; // OK
|
||||
|
||||
<test2 reqd='true' />; // OK
|
||||
<test2 reqd={'true'} />; // OK
|
||||
|
||||
// Errors
|
||||
<test1 x={'0'} />; // Error, '0' is not number
|
||||
<test1 y={0} />; // Error, no property "y"
|
||||
<test1 y="foo" />; // Error, no property "y"
|
||||
<test1 x="32" />; // Error, "32" is not number
|
||||
// TODO attribute 'var' should be parseable
|
||||
// <test1 var="10" />; // Error, no 'var' property
|
||||
|
||||
<test2 />; // Error, missing reqd
|
||||
<test2 reqd={10} />; // Error, reqd is not string
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
// OK
|
||||
<test1 c1={function (x) { return x.length; }}/>; // OK
|
||||
<test1 data-c1={function (x) { return x.leng; }}/>; // OK
|
||||
// Errors
|
||||
<test1 c1={function (x) { return x.leng; }}/>; // Error, no leng on 'string'
|
||||
@@ -0,0 +1,19 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: Attribs1;
|
||||
}
|
||||
}
|
||||
interface Attribs1 {
|
||||
c1?: (x: string) => void;
|
||||
}
|
||||
|
||||
// OK
|
||||
<test1 c1={(x) => x.length} />; // OK
|
||||
<test1 data-c1={(x) => x.leng} />; // OK
|
||||
|
||||
|
||||
// Errors
|
||||
<test1 c1={(x) => x.leng} />; // Error, no leng on 'string'
|
||||
@@ -0,0 +1,21 @@
|
||||
// OK
|
||||
var obj1 = { x: 'foo' };
|
||||
<test1 {...obj1}/>;
|
||||
// Error, x is not string
|
||||
var obj2 = { x: 32 };
|
||||
<test1 {...obj2}/>;
|
||||
// Error, x is missing
|
||||
var obj3 = { y: 32 };
|
||||
<test1 {...obj3}/>;
|
||||
// OK
|
||||
var obj4 = { x: 32, y: 32 };
|
||||
<test1 {...obj4} x="ok"/>;
|
||||
// Error
|
||||
var obj5 = { x: 32, y: 32 };
|
||||
<test1 x="ok" {...obj5}/>;
|
||||
// OK
|
||||
var obj6 = { x: 'ok', y: 32, extra: 100 };
|
||||
<test1 {...obj6}/>;
|
||||
// Error
|
||||
var obj7 = { x: 'foo' };
|
||||
<test1 x={32} {...obj7}/>;
|
||||
@@ -0,0 +1,41 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: Attribs1;
|
||||
}
|
||||
}
|
||||
interface Attribs1 {
|
||||
x: string;
|
||||
y?: number;
|
||||
z?: string;
|
||||
}
|
||||
|
||||
// OK
|
||||
var obj1 = { x: 'foo' };
|
||||
<test1 {...obj1} />
|
||||
|
||||
// Error, x is not string
|
||||
var obj2 = { x: 32 };
|
||||
<test1 {...obj2} />
|
||||
|
||||
// Error, x is missing
|
||||
var obj3 = { y: 32 };
|
||||
<test1 {...obj3} />
|
||||
|
||||
// OK
|
||||
var obj4 = { x: 32, y: 32 };
|
||||
<test1 {...obj4} x="ok" />
|
||||
|
||||
// Error
|
||||
var obj5 = { x: 32, y: 32 };
|
||||
<test1 x="ok" {...obj5} />
|
||||
|
||||
// OK
|
||||
var obj6 = { x: 'ok', y: 32, extra: 100 };
|
||||
<test1 {...obj6} />
|
||||
|
||||
// Error
|
||||
var obj7 = { x: 'foo' };
|
||||
<test1 x={32} {...obj7} />
|
||||
@@ -0,0 +1,4 @@
|
||||
// OK
|
||||
<test1 {...{ x: function (n) { return 0; } }}/>;
|
||||
// Error, no member 'len' on 'string'
|
||||
<test1 {...{ x: function (n) { return n.len; } }}/>;
|
||||
@@ -0,0 +1,17 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: Attribs1;
|
||||
}
|
||||
}
|
||||
interface Attribs1 {
|
||||
x(n: string): void;
|
||||
}
|
||||
|
||||
// OK
|
||||
<test1 {... {x: (n) => 0} } />;
|
||||
|
||||
// Error, no member 'len' on 'string'
|
||||
<test1 {... {x: (n) => n.len} } />;
|
||||
@@ -0,0 +1,11 @@
|
||||
function make1(obj) {
|
||||
return <test1 {...obj}/>; // OK
|
||||
}
|
||||
function make2(obj) {
|
||||
return <test1 {...obj}/>; // Error (x is number, not string)
|
||||
}
|
||||
function make3(obj) {
|
||||
return <test1 {...obj}/>; // Error, missing x
|
||||
}
|
||||
<test1 {...{}}/>; // Error, missing x
|
||||
<test2 {...{}}/>; // OK
|
||||
@@ -0,0 +1,32 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: Attribs1;
|
||||
test2: Attribs2;
|
||||
}
|
||||
}
|
||||
interface Attribs1 {
|
||||
x: string;
|
||||
}
|
||||
|
||||
interface Attribs2 {
|
||||
toString(): string;
|
||||
}
|
||||
|
||||
function make1<T extends {x: string}> (obj: T) {
|
||||
return <test1 {...obj} />; // OK
|
||||
}
|
||||
|
||||
function make2<T extends {x: number}> (obj: T) {
|
||||
return <test1 {...obj} />; // Error (x is number, not string)
|
||||
}
|
||||
|
||||
function make3<T extends {y: string}> (obj: T) {
|
||||
return <test1 {...obj} />; // Error, missing x
|
||||
}
|
||||
|
||||
|
||||
<test1 {...{}} />; // Error, missing x
|
||||
<test2 {...{}} />; // OK
|
||||
@@ -0,0 +1,19 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: { n?: boolean; s?: string};
|
||||
test2: { n: boolean; };
|
||||
}
|
||||
}
|
||||
|
||||
// Error
|
||||
<test1 s />;
|
||||
<test1 n='true' />;
|
||||
<test2 />;
|
||||
|
||||
// OK
|
||||
<test1 n />;
|
||||
<test1 n={false} />;
|
||||
<test2 n />;
|
||||
@@ -0,0 +1,16 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
test1: { "data-foo"?: string };
|
||||
}
|
||||
}
|
||||
|
||||
// Error
|
||||
<test1 data-foo={32} />;
|
||||
|
||||
// OK
|
||||
<test1 data-foo={'32'} />;
|
||||
<test1 data-bar={'32'} />;
|
||||
<test1 data-bar={32} />;
|
||||
@@ -0,0 +1,25 @@
|
||||
//@jsx: preserve
|
||||
|
||||
declare namespace JSX {
|
||||
interface IntrinsicElements {
|
||||
foundFirst: { x: string };
|
||||
'string_named';
|
||||
'var';
|
||||
}
|
||||
}
|
||||
|
||||
class foundFirst { }
|
||||
class Other {}
|
||||
|
||||
module Dotted {
|
||||
export class Name { }
|
||||
}
|
||||
|
||||
// Should find the intrinsic element, not the class element
|
||||
var a = <foundFirst x="hello" />;
|
||||
var b = <string_named />;
|
||||
// TODO: This should not be a parse error (should
|
||||
// parse a property name here, not identifier)
|
||||
// var c = <var />;
|
||||
var d = <Other />;
|
||||
var e = <Dotted.Name />;
|
||||
@@ -0,0 +1,4 @@
|
||||
// OK
|
||||
<div />;
|
||||
// Fail
|
||||
<span />;
|
||||
@@ -0,0 +1,14 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
div: any
|
||||
}
|
||||
}
|
||||
|
||||
// OK
|
||||
<div />;
|
||||
|
||||
// Fail
|
||||
<span />;
|
||||
@@ -0,0 +1,21 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface ElementClass {
|
||||
render: any;
|
||||
}
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
interface Obj1type {
|
||||
new(n: string): { x: number };
|
||||
}
|
||||
var Obj1: Obj1type;
|
||||
<Obj1 x={10} />; // Error, no render member
|
||||
|
||||
interface Obj2type {
|
||||
(n: string): { x: number; render: any; };
|
||||
}
|
||||
var Obj2: Obj2type;
|
||||
<Obj2 x={32} render={100} />; // OK
|
||||
@@ -0,0 +1,6 @@
|
||||
var Obj1;
|
||||
<Obj1 x={10}/>; // OK
|
||||
var Obj2;
|
||||
<Obj2 x={10}/>; // Error
|
||||
var Obj3;
|
||||
<Obj3 x={10}/>; // OK
|
||||
@@ -0,0 +1,25 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface ElementAttributesProperty { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
interface Obj1type {
|
||||
new(n: string): any;
|
||||
}
|
||||
var Obj1: Obj1type;
|
||||
<Obj1 x={10} />; // OK
|
||||
|
||||
interface Obj2type {
|
||||
new(n: string): { q?: number };
|
||||
}
|
||||
var Obj2: Obj2type;
|
||||
<Obj2 x={10} />; // Error
|
||||
|
||||
interface Obj3type {
|
||||
new(n: string): { x: number; };
|
||||
}
|
||||
var Obj3: Obj3type;
|
||||
<Obj3 x={10} />; // OK
|
||||
@@ -0,0 +1,9 @@
|
||||
var obj1;
|
||||
<obj1 x={10}/>; // OK
|
||||
var obj2;
|
||||
<obj2 x={10}/>; // OK
|
||||
var obj3;
|
||||
<obj3 x={10}/>; // Error
|
||||
var obj4;
|
||||
<obj4 x={10}/>; // OK
|
||||
<obj4 x={'10'}/>; // Error
|
||||
@@ -0,0 +1,32 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface ElementAttributesProperty { pr: any; }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
interface Obj1type {
|
||||
new(n: string): any;
|
||||
}
|
||||
var Obj1: Obj1type;
|
||||
<Obj1 x={10} />; // OK
|
||||
|
||||
interface Obj2type {
|
||||
new(n: string): { q?: number; pr: any };
|
||||
}
|
||||
var obj2: Obj2type;
|
||||
<Obj2 x={10} />; // OK
|
||||
|
||||
interface Obj3type {
|
||||
new(n: string): { x: number; };
|
||||
}
|
||||
var Obj3: Obj3type;
|
||||
<Obj3 x={10} />; // Error
|
||||
|
||||
interface Obj4type {
|
||||
new(n: string): { x: number; pr: { x: number; } };
|
||||
}
|
||||
var Obj4: Obj4type;
|
||||
<Obj4 x={10} />; // OK
|
||||
<Obj4 x={'10'} />; // Error
|
||||
@@ -0,0 +1,2 @@
|
||||
var obj1;
|
||||
<obj1 x={10}/>; // Error
|
||||
@@ -0,0 +1,12 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface ElementAttributesProperty { pr1: any; pr2: any; }
|
||||
}
|
||||
|
||||
interface Obj1 {
|
||||
new(n: string): any;
|
||||
}
|
||||
var obj1: Obj1;
|
||||
<obj1 x={10} />; // Error
|
||||
@@ -0,0 +1,2 @@
|
||||
var obj1;
|
||||
<obj1 x={10}/>; // OK
|
||||
@@ -0,0 +1,11 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
}
|
||||
|
||||
interface Obj1 {
|
||||
new(n: string): {};
|
||||
}
|
||||
var obj1: Obj1;
|
||||
<obj1 x={10} />; // OK
|
||||
@@ -0,0 +1,2 @@
|
||||
var obj1;
|
||||
<obj1 x={10}/>; // Error
|
||||
@@ -0,0 +1,13 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface ElementAttributesProperty { pr1: any; pr2: any; }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
interface Obj1type {
|
||||
new(n: string): {};
|
||||
}
|
||||
var Obj1: Obj1type;
|
||||
<Obj1 x={10} />; // Error
|
||||
@@ -0,0 +1,2 @@
|
||||
var obj1;
|
||||
<obj1 x={10}/>; // Error (JSX.Element is missing)
|
||||
@@ -0,0 +1,10 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
}
|
||||
|
||||
interface Obj1 {
|
||||
new(n: string): {};
|
||||
}
|
||||
var obj1: Obj1;
|
||||
<obj1 x={10} />; // Error (JSX.Element is missing)
|
||||
@@ -0,0 +1,27 @@
|
||||
//@jsx: preserve
|
||||
//@module: amd
|
||||
|
||||
//@filename: file.tsx
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
declare module 'elements1' {
|
||||
class MyElement {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
declare module 'elements2' {
|
||||
class MyElement {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//@filename: consumer.tsx
|
||||
///<reference path="file.tsx" />
|
||||
// Should keep s1 and elide s2
|
||||
import s1 = require('elements1');
|
||||
import s2 = require('elements2');
|
||||
<s1.MyElement />;
|
||||
@@ -0,0 +1,9 @@
|
||||
//@jsx: preserve
|
||||
//@filename: file1.tsx
|
||||
//@noimplicitany: true
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
}
|
||||
|
||||
// Error under implicit any
|
||||
<div n='x' />;
|
||||
@@ -0,0 +1,14 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[x: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
// OK
|
||||
<div />;
|
||||
|
||||
// OK
|
||||
<span />;
|
||||
@@ -0,0 +1,14 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[x: string]: { n: string; };
|
||||
}
|
||||
}
|
||||
|
||||
// OK
|
||||
<div n='x' />;
|
||||
|
||||
// Error
|
||||
<span w='err' />;
|
||||
@@ -0,0 +1,18 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
div: { n: string; };
|
||||
span: { m: string; };
|
||||
}
|
||||
}
|
||||
|
||||
// OK
|
||||
<div n='x' />;
|
||||
|
||||
// OK
|
||||
<span m='ok' />;
|
||||
|
||||
// Error
|
||||
<span q='' />;
|
||||
@@ -0,0 +1,8 @@
|
||||
//@jsx: preserve
|
||||
//@filename: file1.tsx
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
}
|
||||
|
||||
// OK, but implicit any
|
||||
<div n='x' />;
|
||||
@@ -0,0 +1,10 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
var div: any;
|
||||
// Still an error
|
||||
<div n='x' />;
|
||||
@@ -0,0 +1,14 @@
|
||||
var my;
|
||||
(function (my) {
|
||||
})(my || (my = {}));
|
||||
// OK
|
||||
<my.div n='x'/>;
|
||||
// Error
|
||||
<my.other />;
|
||||
var q;
|
||||
(function (q) {
|
||||
// OK
|
||||
<mine.div n='x'/>;
|
||||
// Error
|
||||
<mine.non />;
|
||||
})(q || (q = {}));
|
||||
@@ -0,0 +1,22 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
module my {
|
||||
export var div: any;
|
||||
}
|
||||
// OK
|
||||
<my.div n='x' />;
|
||||
// Error
|
||||
<my.other />;
|
||||
|
||||
module q {
|
||||
import mine = my;
|
||||
// OK
|
||||
<mine.div n='x' />;
|
||||
// Error
|
||||
<mine.non />;
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
// Error
|
||||
var div = 3;
|
||||
<div />;
|
||||
// OK
|
||||
function fact() { return null; }
|
||||
<fact />;
|
||||
// Error
|
||||
function fnum() { return 42; }
|
||||
<fnum />;
|
||||
var obj1;
|
||||
<obj1 />; // OK, prefer construct signatures
|
||||
var obj2;
|
||||
<obj2 />; // Error
|
||||
var obj3;
|
||||
<obj3 />; // Error
|
||||
@@ -0,0 +1,36 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
// Error
|
||||
var Div = 3;
|
||||
<Div />;
|
||||
|
||||
// OK
|
||||
function Fact(): any { return null; }
|
||||
<Fact />
|
||||
|
||||
// Error
|
||||
function Fnum(): number{ return 42; }
|
||||
<Fnum />
|
||||
|
||||
interface Obj1 {
|
||||
new(): {};
|
||||
(): number;
|
||||
}
|
||||
var Obj1: Obj1;
|
||||
<Obj1 />; // OK, prefer construct signatures
|
||||
|
||||
interface Obj2 {
|
||||
(): number;
|
||||
}
|
||||
var Obj2: Obj2;
|
||||
<Obj2 />; // Error
|
||||
|
||||
interface Obj3 {
|
||||
}
|
||||
var Obj3: Obj3;
|
||||
<Obj3 />; // Error
|
||||
@@ -0,0 +1,6 @@
|
||||
var obj1;
|
||||
<obj1 />; // Error, return type is not an object type
|
||||
var obj2;
|
||||
<obj2 />; // Error, return type is not an object type
|
||||
var obj3;
|
||||
<obj3 x={42}/>; // OK
|
||||
@@ -0,0 +1,27 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
interface Obj1 {
|
||||
new(n: string): { x: number };
|
||||
new(n: number): { y: string };
|
||||
}
|
||||
var Obj1: Obj1;
|
||||
<Obj1 />; // Error, return type is not an object type
|
||||
|
||||
interface Obj2 {
|
||||
(n: string): { x: number };
|
||||
(n: number): { y: string };
|
||||
}
|
||||
var Obj2: Obj2;
|
||||
<Obj2 />; // Error, return type is not an object type
|
||||
|
||||
interface Obj3 {
|
||||
(n: string): { x: number };
|
||||
(n: number): { x: number; y: string };
|
||||
}
|
||||
var Obj3: Obj3;
|
||||
<Obj3 x={42} />; // OK
|
||||
@@ -0,0 +1,34 @@
|
||||
var p;
|
||||
/*
|
||||
var selfClosed1 = <div />;
|
||||
var selfClosed2 = <div x="1" />;
|
||||
var selfClosed3 = <div x='1' />;
|
||||
var selfClosed4 = <div x="1" y='0' />;
|
||||
var selfClosed5 = <div x={0} y='0' />;
|
||||
var selfClosed6 = <div x={"1"} y='0' />;
|
||||
var selfClosed7 = <div x={p} y='p' />;
|
||||
|
||||
var openClosed1 = <div></div>;
|
||||
var openClosed2 = <div n='m'>foo</div>;
|
||||
var openClosed3 = <div n='m'>{p}</div>;
|
||||
var openClosed4 = <div n='m'>{p < p}</div>;
|
||||
var openClosed5 = <div n='m'>{p > p}</div>;
|
||||
*/
|
||||
var SomeClass = (function () {
|
||||
function SomeClass() {
|
||||
}
|
||||
SomeClass.prototype.f = function () {
|
||||
var _this = this;
|
||||
var rewrites1 = <div>{function () { return _this; }}</div>;
|
||||
var rewrites4 = <div a={function () { return _this; }}></div>;
|
||||
};
|
||||
return SomeClass;
|
||||
})();
|
||||
/*
|
||||
var q = () => this;
|
||||
var rewrites2 = <div>{[p, ...p, p]}</div>;
|
||||
var rewrites3 = <div>{{p}}</div>;
|
||||
|
||||
var rewrites5 = <div a={[p, ...p, p]}></div>;
|
||||
var rewrites6 = <div a={{p}}></div>;
|
||||
*/
|
||||
@@ -0,0 +1,41 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
var p;
|
||||
var selfClosed1 = <div />;
|
||||
var selfClosed2 = <div x="1" />;
|
||||
var selfClosed3 = <div x='1' />;
|
||||
var selfClosed4 = <div x="1" y='0' />;
|
||||
var selfClosed5 = <div x={0} y='0' />;
|
||||
var selfClosed6 = <div x={"1"} y='0' />;
|
||||
var selfClosed7 = <div x={p} y='p' />;
|
||||
|
||||
var openClosed1 = <div></div>;
|
||||
var openClosed2 = <div n='m'>foo</div>;
|
||||
var openClosed3 = <div n='m'>{p}</div>;
|
||||
var openClosed4 = <div n='m'>{p < p}</div>;
|
||||
var openClosed5 = <div n='m'>{p > p}</div>;
|
||||
|
||||
class SomeClass {
|
||||
f() {
|
||||
var rewrites1 = <div>{() => this}</div>;
|
||||
var rewrites2 = <div>{[p, ...p, p]}</div>;
|
||||
var rewrites3 = <div>{{p}}</div>;
|
||||
|
||||
var rewrites4 = <div a={() => this}></div>;
|
||||
var rewrites5 = <div a={[p, ...p, p]}></div>;
|
||||
var rewrites6 = <div a={{p}}></div>;
|
||||
}
|
||||
}
|
||||
|
||||
var whitespace1 = <div> </div>;
|
||||
var whitespace2 = <div> {p} </div>;
|
||||
var whitespace3 = <div>
|
||||
{p}
|
||||
</div>;
|
||||
@@ -0,0 +1,15 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
var p1, p2, p3;
|
||||
var spreads1 = <div {...p1}>{p2}</div>;
|
||||
var spreads2 = <div {...p1}>{p2}</div>;
|
||||
var spreads3 = <div x={p3} {...p1}>{p2}</div>;
|
||||
var spreads4 = <div {...p1} x={p3} >{p2}</div>;
|
||||
var spreads5 = <div x={p2} {...p1} y={p3}>{p2}</div>;
|
||||
@@ -0,0 +1,41 @@
|
||||
var M;
|
||||
(function (M) {
|
||||
var Foo = (function () {
|
||||
function Foo() {
|
||||
}
|
||||
return Foo;
|
||||
})();
|
||||
M.Foo = Foo;
|
||||
var S;
|
||||
(function (S) {
|
||||
var Bar = (function () {
|
||||
function Bar() {
|
||||
}
|
||||
return Bar;
|
||||
})();
|
||||
S.Bar = Bar;
|
||||
})(S = M.S || (M.S = {}));
|
||||
})(M || (M = {}));
|
||||
var M;
|
||||
(function (M) {
|
||||
// Emit M.Foo
|
||||
M.Foo, <M.Foo />;
|
||||
var S;
|
||||
(function (S) {
|
||||
// Emit M.Foo
|
||||
M.Foo, <M.Foo />;
|
||||
// Emit S.Bar
|
||||
S.Bar, <S.Bar />;
|
||||
})(S = M.S || (M.S = {}));
|
||||
})(M || (M = {}));
|
||||
var M;
|
||||
(function (M) {
|
||||
// Emit M.S.Bar
|
||||
M.S.Bar, <M.S.Bar />;
|
||||
})(M || (M = {}));
|
||||
var M;
|
||||
(function (M_1) {
|
||||
var M = 100;
|
||||
// Emit M_1.Foo
|
||||
M_1.Foo, <M_1.Foo />;
|
||||
})(M || (M = {}));
|
||||
@@ -0,0 +1,41 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { }
|
||||
}
|
||||
|
||||
module M {
|
||||
export class Foo { constructor() { } }
|
||||
export module S {
|
||||
export class Bar { }
|
||||
|
||||
// Emit Foo
|
||||
// Foo, <Foo />;
|
||||
}
|
||||
}
|
||||
|
||||
module M {
|
||||
// Emit M.Foo
|
||||
Foo, <Foo />;
|
||||
|
||||
export module S {
|
||||
// Emit M.Foo
|
||||
Foo, <Foo />;
|
||||
|
||||
// Emit S.Bar
|
||||
Bar, <Bar />;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
module M {
|
||||
// Emit M.S.Bar
|
||||
S.Bar, <S.Bar />;
|
||||
}
|
||||
|
||||
module M {
|
||||
var M = 100;
|
||||
// Emit M_1.Foo
|
||||
Foo, <Foo />;
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { isElement; }
|
||||
}
|
||||
|
||||
var T, T1, T2;
|
||||
|
||||
// This is an element
|
||||
var x1 = <T>() => {}</T>;
|
||||
x1.isElement;
|
||||
|
||||
// This is a generic function
|
||||
var x2 = <T extends {}>() => {};
|
||||
x2();
|
||||
|
||||
// This is a generic function
|
||||
var x3 = <T, T1>() => {};
|
||||
x3();
|
||||
|
||||
// This is an element
|
||||
var x4 = <T extends={true}>() => {}</T>;
|
||||
x4.isElement;
|
||||
|
||||
// This is an element
|
||||
var x5 = <T extends>() => {}</T>;
|
||||
x5.isElement;
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
//@jsx: preserve
|
||||
|
||||
<nope />;
|
||||
@@ -0,0 +1,8 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: preserve
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements { div; span; }
|
||||
}
|
||||
|
||||
var x = <div><div><span><div></div></span></div></div>;
|
||||
@@ -0,0 +1,41 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: react
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
var p;
|
||||
var selfClosed1 = <div />;
|
||||
var selfClosed2 = <div x="1" />;
|
||||
var selfClosed3 = <div x='1' />;
|
||||
var selfClosed4 = <div x="1" y='0' />;
|
||||
var selfClosed5 = <div x={0} y='0' />;
|
||||
var selfClosed6 = <div x={"1"} y='0' />;
|
||||
var selfClosed7 = <div x={p} y='p' />;
|
||||
|
||||
var openClosed1 = <div></div>;
|
||||
var openClosed2 = <div n='m'>foo</div>;
|
||||
var openClosed3 = <div n='m'>{p}</div>;
|
||||
var openClosed4 = <div n='m'>{p < p}</div>;
|
||||
var openClosed5 = <div n='m'>{p > p}</div>;
|
||||
|
||||
class SomeClass {
|
||||
f() {
|
||||
var rewrites1 = <div>{() => this}</div>;
|
||||
var rewrites2 = <div>{[p, ...p, p]}</div>;
|
||||
var rewrites3 = <div>{{p}}</div>;
|
||||
|
||||
var rewrites4 = <div a={() => this}></div>;
|
||||
var rewrites5 = <div a={[p, ...p, p]}></div>;
|
||||
var rewrites6 = <div a={{p}}></div>;
|
||||
}
|
||||
}
|
||||
|
||||
var whitespace1 = <div> </div>;
|
||||
var whitespace2 = <div> {p} </div>;
|
||||
var whitespace3 = <div>
|
||||
{p}
|
||||
</div>;
|
||||
@@ -0,0 +1,15 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: react
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
var p1, p2, p3;
|
||||
var spreads1 = <div {...p1}>{p2}</div>;
|
||||
var spreads2 = <div {...p1}>{p2}</div>;
|
||||
var spreads3 = <div x={p3} {...p1}>{p2}</div>;
|
||||
var spreads4 = <div {...p1} x={p3} >{p2}</div>;
|
||||
var spreads5 = <div x={p2} {...p1} y={p3}>{p2}</div>;
|
||||
@@ -0,0 +1,8 @@
|
||||
//@jsx: react
|
||||
//@filename: test.tsx
|
||||
|
||||
declare module JSX { interface Element { } }
|
||||
|
||||
declare var Foo, Bar, baz;
|
||||
|
||||
<Foo> <Bar> q </Bar> <Bar/> s <Bar/><Bar/></Foo>;
|
||||
@@ -0,0 +1,15 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: react
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
var p;
|
||||
var openClosed1 = <div>
|
||||
|
||||
{blah}
|
||||
|
||||
</div>;
|
||||
@@ -0,0 +1,52 @@
|
||||
//@filename: file.tsx
|
||||
//@jsx: react
|
||||
declare module JSX {
|
||||
interface Element { }
|
||||
interface IntrinsicElements {
|
||||
[s: string]: any;
|
||||
}
|
||||
}
|
||||
|
||||
// THIS FILE HAS TEST-SIGNIFICANT LEADING/TRAILING
|
||||
// WHITESPACE, DO NOT RUN 'FORMAT DOCUMENT' ON IT
|
||||
|
||||
var p = 0;
|
||||
// Emit " "
|
||||
<div> </div>;
|
||||
// Emit " ", p, " "
|
||||
<div> {p} </div>;
|
||||
// Emit only p
|
||||
<div>
|
||||
{p}
|
||||
</div>;
|
||||
|
||||
// Emit only p
|
||||
<div>
|
||||
{p}
|
||||
</div>;
|
||||
|
||||
// Emit " 3"
|
||||
<div> 3
|
||||
</div>;
|
||||
|
||||
// Emit " 3 "
|
||||
<div> 3 </div>;
|
||||
|
||||
// Emit "3"
|
||||
<div>
|
||||
3
|
||||
</div>;
|
||||
|
||||
// Emit no args
|
||||
<div>
|
||||
</div>;
|
||||
|
||||
// Emit "foo" + ' ' + "bar"
|
||||
<div>
|
||||
|
||||
foo
|
||||
|
||||
bar
|
||||
|
||||
</div>;
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
//@jsx: preserve
|
||||
|
||||
// A built-in element (OK)
|
||||
var a1 = <div id="foo" />;
|
||||
|
||||
// A built-in element with a mistyped property (error)
|
||||
var a2 = <img srce="foo.jpg" />
|
||||
|
||||
// A built-in element with a badly-typed attribute value (error)
|
||||
var thing = { oops: 100 };
|
||||
var a3 = <div id={thing} />
|
||||
|
||||
// Mistyped html name (error)
|
||||
var e1 = <imag src="bar.jpg" />
|
||||
|
||||
// A custom type
|
||||
class MyClass {
|
||||
props: {
|
||||
pt?: { x: number; y: number; };
|
||||
name?: string;
|
||||
reqd: boolean;
|
||||
}
|
||||
}
|
||||
|
||||
// Let's use it
|
||||
// TODO: Error on missing 'reqd'
|
||||
var b1 = <MyClass reqd={true} />;
|
||||
|
||||
// Mistyped attribute member
|
||||
// sample.tsx(23,22): error TS2322: Type '{ x: number; y: string; }' is not assignable to type '{ x: number; y: number; }'.
|
||||
// Types of property 'y' are incompatible.
|
||||
// Type 'string' is not assignable to type 'number'.
|
||||
var b2 = <MyClass pt={{x: 4, y: 'oops'}} />;
|
||||
|
||||
Reference in New Issue
Block a user