fix($core): vuejs#2627 Dup ID violates HTML5-3

adico1 · Oct 8, 2020 · 235a4aa · 235a4aa
1 parent fa3d481
commit 235a4aa
Showing 1 changed file with 25 additions and 26 deletions.
diff --git a/packages/@vuepress/core/lib/client/components/OutboundLink.vue b/packages/@vuepress/core/lib/client/components/OutboundLink.vue
@@ -1,35 +1,34 @@
 <template>
-  <svg
-    class="icon outbound"
-    xmlns="http://www.w3.org/2000/svg"
-    :aria-labelledby="rIdx"
-    role="img"
-    focusable="false"
-    x="0px"
-    y="0px"
-    viewBox="0 0 100 100"
-    width="15"
-    height="15"
+  <span
+    :title="openInNewWindowTitle"
+    class="sr-only"
   >
-    <title :id="rIdx">{{ openInNewWindowTitle }}</title>
-    <path
-      fill="currentColor"
-      d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
-    />
-    <polygon
-      fill="currentColor"
-      points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
-    />
-  </svg>
+    <svg
+      class="icon outbound"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden="true"
+      role="img"
+      focusable="false"
+      x="0px"
+      y="0px"
+      viewBox="0 0 100 100"
+      width="15"
+      height="15"
+    >
+      <path
+        fill="currentColor"
+        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
+      />
+      <polygon
+        fill="currentColor"
+        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
+      />
+    </svg>
+  </span>
 </template>
 
 <script>
 export default {
-  data: function () {
-    return {
-      rIdx: 'outbound-link-title-' + Math.floor(Math.random() * 1000000)
-    }
-  },
   computed: {
     openInNewWindowTitle () {
       return this.$themeLocaleConfig.openNewWindowText || '(opens new window)'