From 76b1e95c3d89fa2ca762eda75c9bd182612ee85a Mon Sep 17 00:00:00 2001 From: Ryan Cavanaugh Date: Wed, 25 Jan 2017 10:40:59 -0800 Subject: [PATCH] Always call `checkExpression` on JSX attribute values Fixes #13676 --- src/compiler/checker.ts | 19 ++--- .../baselines/reference/reactImportDropped.js | 48 ++++++++++++ .../reference/reactImportDropped.symbols | 65 ++++++++++++++++ .../reference/reactImportDropped.types | 74 +++++++++++++++++++ tests/cases/compiler/reactImportDropped.ts | 42 +++++++++++ 5 files changed, 239 insertions(+), 9 deletions(-) create mode 100644 tests/baselines/reference/reactImportDropped.js create mode 100644 tests/baselines/reference/reactImportDropped.symbols create mode 100644 tests/baselines/reference/reactImportDropped.types create mode 100644 tests/cases/compiler/reactImportDropped.ts diff --git a/src/compiler/checker.ts b/src/compiler/checker.ts index a09b63d46fd..7c8a0b7337f 100644 --- a/src/compiler/checker.ts +++ b/src/compiler/checker.ts @@ -11879,6 +11879,16 @@ namespace ts { function checkJsxAttribute(node: JsxAttribute, elementAttributesType: Type, nameTable: Map) { let correspondingPropType: Type = undefined; + // We need to unconditionally get the expression type + let exprType: Type; + if (node.initializer) { + exprType = checkExpression(node.initializer); + } + else { + // is sugar for + exprType = booleanType; + } + // Look up the corresponding property for this attribute if (elementAttributesType === emptyObjectType && isUnhyphenatedJsxName(node.name.text)) { // If there is no 'props' property, you may not have non-"data-" attributes @@ -11902,15 +11912,6 @@ namespace ts { } } - let exprType: Type; - if (node.initializer) { - exprType = checkExpression(node.initializer); - } - else { - // is sugar for - exprType = booleanType; - } - if (correspondingPropType) { checkTypeAssignableTo(exprType, correspondingPropType, node); } diff --git a/tests/baselines/reference/reactImportDropped.js b/tests/baselines/reference/reactImportDropped.js new file mode 100644 index 00000000000..7ada76b42f4 --- /dev/null +++ b/tests/baselines/reference/reactImportDropped.js @@ -0,0 +1,48 @@ +//// [tests/cases/compiler/reactImportDropped.ts] //// + +//// [react.d.ts] + +export = React; +export as namespace React; + +declare namespace React { + + function createClass(spec: any): ClassicComponentClass; + + interface ClassicComponentClass { + new (props?: any): ClassicComponentClass; + } +} + +declare global { + namespace JSX { + interface ElementAttributesProperty { } + } +} + + +//// [TabBar.js] +export default React.createClass({ + render() { + return ( + null + ); + } +}); + +//// [NavigationView.js] +import TabBar from '../../components/TabBar'; +import {layout} from '../../utils/theme'; // <- DO NOT DROP this import +const x = ; + + +//// [TabBar.js] +export default React.createClass({ + render() { + return (null); + } +}); +//// [NavigationView.js] +import TabBar from '../../components/TabBar'; +import { layout } from '../../utils/theme'; // <- DO NOT DROP this import +const x = React.createElement(TabBar, { height: layout.footerHeight }); diff --git a/tests/baselines/reference/reactImportDropped.symbols b/tests/baselines/reference/reactImportDropped.symbols new file mode 100644 index 00000000000..d7374df044e --- /dev/null +++ b/tests/baselines/reference/reactImportDropped.symbols @@ -0,0 +1,65 @@ +=== tests/cases/compiler/react.d.ts === + +export = React; +>React : Symbol(React, Decl(react.d.ts, 2, 26)) + +export as namespace React; +>React : Symbol(React, Decl(react.d.ts, 1, 15)) + +declare namespace React { +>React : Symbol(React, Decl(react.d.ts, 2, 26)) + + function createClass(spec: any): ClassicComponentClass; +>createClass : Symbol(createClass, Decl(react.d.ts, 4, 25)) +>spec : Symbol(spec, Decl(react.d.ts, 6, 25)) +>ClassicComponentClass : Symbol(ClassicComponentClass, Decl(react.d.ts, 6, 59)) + + interface ClassicComponentClass { +>ClassicComponentClass : Symbol(ClassicComponentClass, Decl(react.d.ts, 6, 59)) + + new (props?: any): ClassicComponentClass; +>props : Symbol(props, Decl(react.d.ts, 9, 13)) +>ClassicComponentClass : Symbol(ClassicComponentClass, Decl(react.d.ts, 6, 59)) + } +} + +declare global { +>global : Symbol(global, Decl(react.d.ts, 11, 1)) + + namespace JSX { +>JSX : Symbol(JSX, Decl(react.d.ts, 13, 16)) + + interface ElementAttributesProperty { } +>ElementAttributesProperty : Symbol(ElementAttributesProperty, Decl(react.d.ts, 14, 19)) + } +} + + +=== tests/cases/compiler/src/components/TabBar.js === +export default React.createClass({ +>React.createClass : Symbol(React.createClass, Decl(react.d.ts, 4, 25)) +>React : Symbol(React, Decl(react.d.ts, 1, 15)) +>createClass : Symbol(React.createClass, Decl(react.d.ts, 4, 25)) + + render() { +>render : Symbol(render, Decl(TabBar.js, 0, 34)) + + return ( + null + ); + } +}); + +=== tests/cases/compiler/src/modules/navigation/NavigationView.js === +import TabBar from '../../components/TabBar'; +>TabBar : Symbol(TabBar, Decl(NavigationView.js, 0, 6)) + +import {layout} from '../../utils/theme'; // <- DO NOT DROP this import +>layout : Symbol(layout, Decl(NavigationView.js, 1, 8)) + +const x = ; +>x : Symbol(x, Decl(NavigationView.js, 2, 5)) +>TabBar : Symbol(TabBar, Decl(NavigationView.js, 0, 6)) +>height : Symbol(layout) +>layout : Symbol(layout, Decl(NavigationView.js, 1, 8)) + diff --git a/tests/baselines/reference/reactImportDropped.types b/tests/baselines/reference/reactImportDropped.types new file mode 100644 index 00000000000..36f1a6a4779 --- /dev/null +++ b/tests/baselines/reference/reactImportDropped.types @@ -0,0 +1,74 @@ +=== tests/cases/compiler/react.d.ts === + +export = React; +>React : typeof React + +export as namespace React; +>React : typeof React + +declare namespace React { +>React : typeof React + + function createClass(spec: any): ClassicComponentClass; +>createClass : (spec: any) => ClassicComponentClass +>spec : any +>ClassicComponentClass : ClassicComponentClass + + interface ClassicComponentClass { +>ClassicComponentClass : ClassicComponentClass + + new (props?: any): ClassicComponentClass; +>props : any +>ClassicComponentClass : ClassicComponentClass + } +} + +declare global { +>global : any + + namespace JSX { +>JSX : any + + interface ElementAttributesProperty { } +>ElementAttributesProperty : ElementAttributesProperty + } +} + + +=== tests/cases/compiler/src/components/TabBar.js === +export default React.createClass({ +>React.createClass({ render() { return ( null ); }}) : React.ClassicComponentClass +>React.createClass : (spec: any) => React.ClassicComponentClass +>React : typeof React +>createClass : (spec: any) => React.ClassicComponentClass +>{ render() { return ( null ); }} : { render(): any; } + + render() { +>render : () => any + + return ( +>( null ) : null + + null +>null : null + + ); + } +}); + +=== tests/cases/compiler/src/modules/navigation/NavigationView.js === +import TabBar from '../../components/TabBar'; +>TabBar : React.ClassicComponentClass + +import {layout} from '../../utils/theme'; // <- DO NOT DROP this import +>layout : any + +const x = ; +>x : any +> : any +>TabBar : React.ClassicComponentClass +>height : any +>layout.footerHeight : any +>layout : any +>footerHeight : any + diff --git a/tests/cases/compiler/reactImportDropped.ts b/tests/cases/compiler/reactImportDropped.ts new file mode 100644 index 00000000000..a345e7c74fd --- /dev/null +++ b/tests/cases/compiler/reactImportDropped.ts @@ -0,0 +1,42 @@ +//@module: es6 +//@moduleResolution: node +//@target: es6 +//@noImplicitAny: false +//@allowSyntheticDefaultImports: true +//@allowJs: true +//@jsx: react +//@outDir: "build" + +//@filename: react.d.ts +export = React; +export as namespace React; + +declare namespace React { + + function createClass(spec: any): ClassicComponentClass; + + interface ClassicComponentClass { + new (props?: any): ClassicComponentClass; + } +} + +declare global { + namespace JSX { + interface ElementAttributesProperty { } + } +} + + +//@filename: src/components/TabBar.js +export default React.createClass({ + render() { + return ( + null + ); + } +}); + +//@filename: src/modules/navigation/NavigationView.js +import TabBar from '../../components/TabBar'; +import {layout} from '../../utils/theme'; // <- DO NOT DROP this import +const x = ;