<p dir="auto">Hello folks, I have a really irritating bug in Visual Studio 2015 Update 2 using TypeScript. The auto complete dialog in combination with generics works a little bit fuzzy. It treats it like a greater than comparison. Look at the code below.</p>
<p dir="auto"><strong>TypeScript Version:</strong></p>
<p dir="auto">1.8.30.0</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="// Function declaration
function invoke&lt;T&gt;(methodName: string, ...args: any[]) {
}
// Call the function, Type first letter of the generic T.
invoke&lt;M
// Auto complete window pops up, which is expected.
// I choose Model from the auto complete window using &quot;enter&quot;.
invoke &lt; Model
// Notice the inserted spaces, the compiler thinks its a greater than comparison. While its actually a generic."><pre class="notranslate"><span class="pl-c">// Function declaration</span>
<span class="pl-k">function</span> <span class="pl-en">invoke</span><span class="pl-c1">&lt;</span><span class="pl-smi">T</span><span class="pl-c1">&gt;</span><span class="pl-kos">(</span><span class="pl-s1">methodName</span>: <span class="pl-smi">string</span><span class="pl-kos">,</span> ...<span class="pl-s1">args</span>: <span class="pl-smi">any</span><span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
<span class="pl-kos">}</span>
<span class="pl-c">// Call the function, Type first letter of the generic T.</span>
<span class="pl-s1">invoke</span><span class="pl-c1">&lt;</span><span class="pl-smi">M</span>
<span class="pl-c">// Auto complete window pops up, which is expected.</span>
<span class="pl-c">// I choose Model from the auto complete window using "enter".</span>
<span class="pl-s1">invoke</span> <span class="pl-c1">&lt;</span> <span class="pl-smi">Model</span>
<span class="pl-c">// Notice the inserted spaces, the compiler thinks its a greater than comparison. While its actually a generic.</span></pre></div>
<p dir="auto"><strong>Expected behavior:</strong></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// I expect Model to be inserted without spaces.
this.invoke&lt;Model"><pre class="notranslate"><span class="pl-c">// I expect Model to be inserted without spaces.</span>
<span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">invoke</span><span class="pl-c1">&lt;</span><span class="pl-smi">Model</span></pre></div>
<p dir="auto"><strong>Actual behavior:</strong></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// I actually inserts it with spaces.
this.invoke &lt; Model"><pre class="notranslate"><span class="pl-c">// I actually inserts it with spaces.</span>
<span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">invoke</span> <span class="pl-c1">&lt;</span> <span class="pl-smi">Model</span></pre></div>
<p dir="auto">Input <code class="notranslate">&gt;</code> key on a following code.</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;T"><pre class="notranslate"><span class="pl-c1">&lt;</span><span class="pl-smi">T</span></pre></div>
<p dir="auto">expected:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;T&gt;"><pre class="notranslate"><span class="pl-c1">&lt;</span><span class="pl-smi">T</span><span class="pl-c1">&gt;</span></pre></div>
<p dir="auto">actual:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;TemplateStringsArray&gt;"><pre class="notranslate"><span class="pl-c1">&lt;</span><span class="pl-smi">TemplateStringsArray</span><span class="pl-c1">&gt;</span></pre></div>
<p dir="auto">experience:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// writing an arrow function with generics
let f = &lt;TemplateStringsArray&gt;"><pre class="notranslate"><span class="pl-c">// writing an arrow function with generics</span>
<span class="pl-k">let</span> <span class="pl-s1">f</span> <span class="pl-c1">=</span> <span class="pl-c1">&lt;</span><span class="pl-smi">TemplateStringsArray</span><span class="pl-c1">&gt;</span></pre></div>