<p dir="auto"><strong>TypeScript Version:</strong></p>
<p dir="auto">1.7.5 / 1.8.0-beta / nightly (1.9.0-dev.20160217)</p>
<p dir="auto"><strong>Code</strong></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// A self-contained demonstration of the problem follows...
"><pre class="notranslate"><span class="pl-c">// A self-contained demonstration of the problem follows...</span></pre></div>
<p dir="auto"><strong>Expected behavior:</strong></p>
<p dir="auto"><strong>Actual behavior:</strong></p>
<p dir="auto">I'm trying to follow the instructions <a href="https://github.com/Microsoft/TypeScript/wiki/Using-the-Compiler-API#transpiling-single-file">here</a>, specifically this part:</p>
<blockquote>
<p dir="auto">If file name is omitted then compiler will check if jsx options is specified - if it is set and is not JsxEmit.None then source text will be interpreted as '.tsx'.</p>
</blockquote>
<p dir="auto">However, I'm not getting the expected result.</p>
<p dir="auto"><strong>TypeScript Version:</strong></p>
<p dir="auto">1.8.10</p>
<p dir="auto"><strong>Code</strong></p>
<h2 dir="auto">index.js</h2>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const ts = require('typescript');
const fs = require('fs');

const str = fs.readFileSync(__dirname + '/test.tsx', 'utf8');
const result = ts.transpileModule(str, { fileName: 'test.tsx', compilerOptions: { 'jsx': 'React' });

console.log(result.outputText);"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-s1">ts</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'typescript'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-k">const</span> <span class="pl-s1">fs</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'fs'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-k">const</span> <span class="pl-s1">str</span> <span class="pl-c1">=</span> <span class="pl-s1">fs</span><span class="pl-kos">.</span><span class="pl-en">readFileSync</span><span class="pl-kos">(</span><span class="pl-s1">__dirname</span> <span class="pl-c1">+</span> <span class="pl-s">'/test.tsx'</span><span class="pl-kos">,</span> <span class="pl-s">'utf8'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-k">const</span> <span class="pl-s1">result</span> <span class="pl-c1">=</span> <span class="pl-s1">ts</span><span class="pl-kos">.</span><span class="pl-en">transpileModule</span><span class="pl-kos">(</span><span class="pl-s1">str</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">fileName</span>: <span class="pl-s">'test.tsx'</span><span class="pl-kos">,</span> <span class="pl-c1">compilerOptions</span>: <span class="pl-kos">{</span> <span class="pl-s">'jsx'</span>: <span class="pl-s">'React'</span> <span class="pl-kos">}</span><span class="pl-kos"></span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s1">result</span><span class="pl-kos">.</span><span class="pl-c1">outputText</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<h2 dir="auto">test.tsx</h2>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="/// &lt;reference path=&quot;./typings/react/react-global.d.ts&quot; /&gt;
interface HelloProps {
  name: string;
};

const Hello = (props: HelloProps) =&gt; (
  &lt;div&gt;Hello, {props.name}&lt;/div&gt;
);"><pre class="notranslate"><span class="pl-c">/// &lt;reference path="./typings/react/react-global.d.ts" /&gt;</span>
<span class="pl-k">interface</span> <span class="pl-smi">HelloProps</span> <span class="pl-kos">{</span>
  <span class="pl-c1">name</span>: <span class="pl-smi">string</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">;</span>

<span class="pl-k">const</span> <span class="pl-smi">Hello</span> <span class="pl-c1">=</span> <span class="pl-kos">(</span><span class="pl-s1">props</span>: <span class="pl-smi">HelloProps</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">(</span>
  <span class="pl-kos">&lt;</span><span class="pl-smi">div</span><span class="pl-kos">&gt;</span><span class="pl-smi">Hello</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-s1">props</span><span class="pl-kos">.</span>name<span class="pl-kos">}</span><span class="pl-c1">&lt;</span><span class="pl-pds"><span class="pl-c1">/</span>div&gt;</span><span class="pl-c1"></span>
<span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Expected behavior:</strong></p>
<p dir="auto">The output I'm looking for is the same as what I get if I use <code class="notranslate">tsc</code>:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&gt; tsc --jsx react test.tsx
&gt; cat test.js
/// &lt;reference path=&quot;./typings/react/react-global.d.ts&quot; /&gt;
;
var Hello = function (props) { return (React.createElement(&quot;div&quot;, null, &quot;Hello, &quot;, props.name)); };"><pre class="notranslate"><code class="notranslate">&gt; tsc --jsx react test.tsx
&gt; cat test.js
/// &lt;reference path="./typings/react/react-global.d.ts" /&gt;
;
var Hello = function (props) { return (React.createElement("div", null, "Hello, ", props.name)); };
</code></pre></div>
<p dir="auto"><strong>Actual behavior:</strong></p>
<p dir="auto">However, the output I get is instead:</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&gt; node index.js
&quot;use strict&quot;;
/// &lt;reference path=&quot;./typings/react/react-global.d.ts&quot; /&gt;
;
var Hello = function (props) { return (&lt;div&gt;Hello, {props.name}&lt;/div&gt;); };"><pre class="notranslate"><span class="pl-k">&gt;</span> node index.js
<span class="pl-s"><span class="pl-pds">"</span>use strict<span class="pl-pds">"</span></span><span class="pl-k">;</span>
/// <span class="pl-k">&lt;</span>reference path=<span class="pl-s"><span class="pl-pds">"</span>./typings/react/react-global.d.ts<span class="pl-pds">"</span></span> /<span class="pl-k">&gt;</span>
<span class="pl-k">;</span>
var Hello = <span class="pl-k">function</span> <span class="pl-en">(props)</span> { <span class="pl-k">return</span> (<span class="pl-k">&lt;</span>div<span class="pl-k">&gt;</span>Hello, {props.name}<span class="pl-k">&lt;</span>/div<span class="pl-k">&gt;</span>)<span class="pl-k">;</span> };</pre></div>