<ul dir="auto">
<li>Electron version:  1.4 - 1.6 - but most likely happens on all of them</li>
<li>Operating system: Windows 7/8</li>
</ul>
<h3 dir="auto">Expected behavior</h3>
<p dir="auto">In frameless window any dom element should lose focus after mouse cursor leaves the window area.</p>
<h3 dir="auto">Actual behavior</h3>
<p dir="auto">In frameless window any dom element stays focused after mouse cursor  leaves the window area.<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/563a556d3acdd7daf8fa99ce67611021d70712d870c5b6631c0ebb89b9ddb5ae/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f6c34464774496f425033773955717276322f67697068792e676966"><img src="https://camo.githubusercontent.com/563a556d3acdd7daf8fa99ce67611021d70712d870c5b6631c0ebb89b9ddb5ae/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f6c34464774496f425033773955717276322f67697068792e676966" alt="Bug" data-animated-image="" data-canonical-src="https://media.giphy.com/media/l4FGtIoBP3w9Uqrv2/giphy.gif" style="max-width: 100%;"></a></p>
<h3 dir="auto">How to reproduce</h3>
<p dir="auto">Create div element with on :hover css state that changes its background-color. Place the div close to the frameless window border. Move mouse cursor over the div then move the cursor outside of the window.</p>
<p dir="auto">I have a simple <code class="notranslate">div</code> with a css hover effect changing the background color. When I move the mouse outside of the window area, the <code class="notranslate">div</code> keeps its hover style. It should actually go back to its normal style. Presumable the mouseleave event was "swallowed".</p>
<p dir="auto">For a demonstration video see here: <a href="https://www.screenr.com/4M0N" rel="nofollow">https://www.screenr.com/4M0N</a></p>
<p dir="auto">It happens using the frameless view <strong>and</strong> using the windows frame view. Even though the latter is more difficult to reproduce (move the mouse faster).</p>
<p dir="auto">You can reproduce it with this sample code:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;!DOCTYPE html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;mouseleave&lt;/title&gt;

        &lt;style&gt;
            .box {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 10%;
            }
            .box:hover {
                background-color: red;
            }
        &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
        &lt;div class=&quot;box&quot;&gt;&lt;/div&gt;
  &lt;/body&gt;
&lt;/html&gt;"><pre class="notranslate"><span class="pl-c1">&lt;!DOCTYPE html<span class="pl-kos">&gt;</span></span>
<span class="pl-kos">&lt;</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">head</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">title</span><span class="pl-kos">&gt;</span>mouseleave<span class="pl-kos">&lt;/</span><span class="pl-ent">title</span><span class="pl-kos">&gt;</span>

        <span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
            .<span class="pl-c1">box</span> {
                <span class="pl-c1">position</span><span class="pl-kos">:</span> absolute;
                <span class="pl-c1">top</span><span class="pl-kos">:</span> <span class="pl-c1">0</span>;
                <span class="pl-c1">right</span><span class="pl-kos">:</span> <span class="pl-c1">0</span>;
                <span class="pl-c1">bottom</span><span class="pl-kos">:</span> <span class="pl-c1">0</span>;
                <span class="pl-c1">left</span><span class="pl-kos">:</span> <span class="pl-c1">10<span class="pl-smi">%</span></span>;
            }
            .<span class="pl-c1">box</span><span class="pl-kos">:</span><span class="pl-c1">hover</span> {
                <span class="pl-c1">background-color</span><span class="pl-kos">:</span> red;
            }
        <span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">head</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
        <span class="pl-kos">&lt;</span><span class="pl-ent">div</span> <span class="pl-c1">class</span>="<span class="pl-s">box</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">div</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">My setup:<br>
Windows <del><strong>8.1</strong></del> <strong>7</strong><br>
atom-shell <strong>0.15.7</strong></p>