title: vuejs: @keyup.esc on div element is not working
body: <p>I'm expecting that 'close' event is fired when I'm 
  clicking ESC button being on "shadow-modal" div, but it's not happening</p>
  
  <p><strong>vue 2.5.13, any ideas why?</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>    &lt;template&gt;
        &lt;div class="shadow-modal"
           @keyup.esc="$emit('close')"&gt;
          &lt;transition name="modal"&gt;
            &lt;div class="modal-mask"&gt;
              &lt;div class="modal-wrapper"&gt;
                &lt;div class="modal-container"&gt;
                  &lt;div class="modal-header"&gt;
                    &lt;slot name="header"&gt;
                      default header
                    &lt;/slot&gt;
                  &lt;/div&gt;
                  &lt;div class="modal-body"&gt;
                    &lt;slot name="body"&gt;
                      default body
                    &lt;/slot&gt;
                  &lt;/div&gt;
                  &lt;div class="modal-footer"&gt;
                    &lt;slot name="footer"&gt;
                      &lt;a href="#"
                         class="btn btn--diagonal btn--blue"
                         @click="$emit('close')"&gt;Cancel&lt;/a&gt;
                    &lt;/slot&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/transition&gt;
        &lt;/div&gt;
      &lt;/template&gt;
  
  </code></pre>