feat: Set focus on SkipTo whenever the route path is changed

Author: ktquez

src/VueSkipTo.vue

@@ -1,6 +1,7 @@
 <template>
   <div
     class="vue-skip-to"
+    ref="skipTo"
     :class="{ 'focused': focused }"
   >
     <component
@@ -15,6 +16,7 @@
 <script>
 import VueSkipToSingle from './VueSkipToSingle.vue'
 import VueSkipToList from './VueSkipToList.vue'
+import { programmaticFocus } from './util'
 
 export default {
   name: 'VueSkipTo',
@@ -40,6 +42,12 @@ export default {
     }
   },
 
+  mounted () {
+    this.$route && this.$watch('this.$route.path', () => {
+      this.$nextTick(() => programmaticFocus(this.$refs.skipTo))
+    })
+  },
+
   computed: {
     isList () {
       return Array.isArray(this.to)

src/util.js

@@ -0,0 +1,5 @@
+export function programmaticFocus (el) {
+  el.setAttribute('tabindex', '-1')
+  el.focus()
+  el.removeAttribute('tabindex')
+}