Add `autofocusonshow` directive for input elements

What does this MR do?

Adds v-autofocusonshow directive to use with input elements which require focus immediately on visibility when using el.focus() is not sufficient (which works only when input field is visible immediately on render), eg; search fields in dropdowns.

Example Usage

<script>
import autofocusonshow from '~/vue_shared/directives/autofocusonshow';

export default {
  directives: {
    autofocusonshow,
  },
};
</script>

<template>
  <div class="dropdown-input">
    <input
      v-autofocusonshow
      :placeholder="__('Search')"
      autocomplete="off"
      class="dropdown-input-field"
      type="search"
    />
  </div>
</template>

Conformity

• Code review guidelines
• Merge request performance guidelines
• Style guides

Performance and testing

• Tested in all supported browsers