<p dir="auto">Hopefully this is not a duplicate (couldn't find anything). Out of all the "less desirable" VS (and VS code as well) plugin behaviors I've found this to be the number one most disturbing:</p>
<p dir="auto"><strong>TypeScript Version:</strong></p>
<p dir="auto">1.8.7 (VS 2015 Community, Update 1)</p>
<p dir="auto"><strong>Screenshots</strong><br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/17719551/14063910/caa4cd04-f3f2-11e5-815f-7ae3aa215955.png"><img src="https://cloud.githubusercontent.com/assets/17719551/14063910/caa4cd04-f3f2-11e5-815f-7ae3aa215955.png" alt="clipboard02" style="max-width: 100%;"></a></p>
<p dir="auto">And after fixing the return type (only changed <code class="notranslate">PromiseX.start&lt;void&gt;</code> to <code class="notranslate">PromiseX.start&lt;any&gt;</code>):<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/17719551/14063911/d13828e6-f3f2-11e5-9313-ffedf5750fc5.png"><img src="https://cloud.githubusercontent.com/assets/17719551/14063911/d13828e6-f3f2-11e5-9313-ffedf5750fc5.png" alt="clipboard03" style="max-width: 100%;"></a></p>
<p dir="auto"><strong>Reduced test case</strong></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function func(f: () =&gt; number) {
}

func(() =&gt; {
    let x = &quot;HI&quot;; // &lt;-- Whole line highlighted in red
    return x;     // &lt;-- Whole line highlighted in red
});"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">func</span><span class="pl-kos">(</span><span class="pl-s1">f</span>: <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-smi">number</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
<span class="pl-kos">}</span>

<span class="pl-en">func</span><span class="pl-kos">(</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
    <span class="pl-k">let</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-s">"HI"</span><span class="pl-kos">;</span> <span class="pl-c">// &lt;-- Whole line highlighted in red</span>
    <span class="pl-k">return</span> <span class="pl-s1">x</span><span class="pl-kos">;</span>     <span class="pl-c">// &lt;-- Whole line highlighted in red</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">For comparison, when <code class="notranslate">function</code> is used instead, only the keyword "function" is highlighted:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function func(f: () =&gt; number) {
}

func(function() { // &lt;-- only the &quot;function&quot; keyword is highlighted in red
    let x = &quot;HI&quot;; 
    return x;
});"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">func</span><span class="pl-kos">(</span><span class="pl-s1">f</span>: <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-smi">number</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
<span class="pl-kos">}</span>

<span class="pl-en">func</span><span class="pl-kos">(</span><span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-c">// &lt;-- only the "function" keyword is highlighted in red</span>
    <span class="pl-k">let</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-s">"HI"</span><span class="pl-kos">;</span> 
    <span class="pl-k">return</span> <span class="pl-s1">x</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Suggestion</strong></p>
<p dir="auto">No need to highlight the whole function body in this case. Highlighting only the arrow (i.e. <code class="notranslate">=&gt;</code>) could also work (I tried to find a solution that would work with all variations of the arrow notation, e.g. including reduced notation like <code class="notranslate">val =&gt; val * 2</code>). This would be significantly less distracting and wouldn't mask other errors within the function scope.</p>
<p dir="auto">On a more personal note, I would be super-thankful if this would be fixed! This happens very frequently when using callback or promise heavy code (I mean sometimes up to hundreds of times per day).</p>
<p dir="auto">As an example:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// Function 'F' takes function 'a' 
// and returns a new function which has exactly the same set of args as function 'a'
interface F&lt;A extends Function&gt;{
    (a:A):A;
}

// Is there a way to say:
var Foo:F;

// Or am I forced to do : 
var HigherOrderFunction: &lt;A extends Function&gt;(a:A)=&gt;A;"><pre class="notranslate"><span class="pl-c">// Function 'F' takes function 'a' </span>
<span class="pl-c">// and returns a new function which has exactly the same set of args as function 'a'</span>
<span class="pl-k">interface</span> <span class="pl-smi">F</span><span class="pl-c1">&lt;</span><span class="pl-smi">A</span> <span class="pl-k">extends</span> <span class="pl-smi">Function</span><span class="pl-c1">&gt;</span><span class="pl-kos">{</span>
    <span class="pl-kos">(</span><span class="pl-s1">a</span>:<span class="pl-smi">A</span><span class="pl-kos">)</span>:<span class="pl-smi">A</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span>

<span class="pl-c">// Is there a way to say:</span>
<span class="pl-k">var</span> <span class="pl-smi">Foo</span>:<span class="pl-smi">F</span><span class="pl-kos">;</span>

<span class="pl-c">// Or am I forced to do : </span>
<span class="pl-k">var</span> <span class="pl-smi">HigherOrderFunction</span>: <span class="pl-c1">&lt;</span><span class="pl-smi">A</span> <span class="pl-k">extends</span> <span class="pl-smi">Function</span><span class="pl-c1">&gt;</span><span class="pl-kos">(</span><span class="pl-s1">a</span>:<span class="pl-smi">A</span><span class="pl-kos">)</span><span class="pl-c1">=&gt;</span><span class="pl-smi">A</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">I don't think there is currently a way to say what I want to say beyond duplicating the interface definition inline.</p>