Correct flag JSX elements as being used for the purposes of module imports

Author: RyanCavanaugh

src/compiler/checker.ts

@@ -7117,6 +7117,15 @@ namespace ts {
 
             let targetAttributesType = getJsxElementAttributesType(node);
 
+            if(getNodeLinks(node).jsxFlags & JsxFlags.ClassElement) {
+                if(node.tagName.kind === SyntaxKind.Identifier) {
+                   checkIdentifier(<Identifier>node.tagName);
+                }
+                else {
+                   checkQualifiedName(<QualifiedName>node.tagName);
+                }
+            }
+
             let nameTable: Map<boolean> = {};
             // Process this array in right-to-left order so we know which
             // attributes (mostly from spreads) are being overwritten and

tests/baselines/reference/tsxExternalModuleEmit1.errors.txt

@@ -0,0 +1,35 @@
+tests/cases/conformance/jsx/button.tsx(1,1): error TS1148: Cannot compile modules unless the '--module' flag is provided.
+
+
+==== tests/cases/conformance/jsx/react.d.ts (0 errors) ====
+    
+    declare module 'react' {
+    	class Component<T, U> { }
+    }
+    
+==== tests/cases/conformance/jsx/app.tsx (0 errors) ====
+    import * as React from 'react';
+    
+    // Should see var button_1 = require('./button') here
+    import { Button } from './button';
+    
+    export class App extends React.Component<any, any> {
+    
+        render() {
+            return <Button />;
+        }
+    
+    }
+    
+==== tests/cases/conformance/jsx/button.tsx (1 errors) ====
+    import * as React from 'react';
+    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+!!! error TS1148: Cannot compile modules unless the '--module' flag is provided.
+    
+    export class Button extends React.Component<any, any> {
+    
+        render() {
+            return <button>Some button</button>;
+        }
+    
+    }

tests/baselines/reference/tsxExternalModuleEmit1.js

@@ -0,0 +1,71 @@
+//// [tests/cases/conformance/jsx/tsxExternalModuleEmit1.tsx] ////
+
+//// [react.d.ts]
+
+declare module 'react' {
+	class Component<T, U> { }
+}
+
+//// [app.tsx]
+import * as React from 'react';
+
+// Should see var button_1 = require('./button') here
+import { Button } from './button';
+
+export class App extends React.Component<any, any> {
+
+    render() {
+        return <Button />;
+    }
+
+}
+
+//// [button.tsx]
+import * as React from 'react';
+
+export class Button extends React.Component<any, any> {
+
+    render() {
+        return <button>Some button</button>;
+    }
+
+}
+
+//// [button.jsx]
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var React = require('react');
+var Button = (function (_super) {
+    __extends(Button, _super);
+    function Button() {
+        _super.apply(this, arguments);
+    }
+    Button.prototype.render = function () {
+        return <button>Some button</button>;
+    };
+    return Button;
+})(React.Component);
+exports.Button = Button;
+//// [app.jsx]
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var React = require('react');
+// Should see var button_1 = require('./button') here
+var button_1 = require('./button');
+var App = (function (_super) {
+    __extends(App, _super);
+    function App() {
+        _super.apply(this, arguments);
+    }
+    App.prototype.render = function () {
+        return <button_1.Button />;
+    };
+    return App;
+})(React.Component);
+exports.App = App;