Merge branch '229011-migrate-related-items-tooltip' into 'master'

Migrate tooltip in related issues

See merge request gitlab-org/gitlab!45438

app/assets/javascripts/related_issues/components/issue_token.vue

 <script>
-import { GlIcon } from '@gitlab/ui';
+import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import { __, sprintf } from '~/locale';
 import relatedIssuableMixin from '~/vue_shared/mixins/related_issuable_mixin';
 
@@ -8,6 +8,9 @@ export default {
   components: {
     GlIcon,
   },
+  directives: {
+    GlTooltip: GlTooltipDirective,
+  },
   mixins: [relatedIssuableMixin],
   props: {
     isCondensed: {
@@ -52,7 +55,7 @@ export default {
     <component
       :is="computedLinkElementType"
       ref="link"
-      v-tooltip
+      v-gl-tooltip
       :class="{
         'issue-token-link': isCondensed,
         'issuable-main-info': !isCondensed,
@@ -84,7 +87,7 @@ export default {
       >
         <gl-icon
           v-if="hasState"
-          v-tooltip
+          v-gl-tooltip
           :class="iconClass"
           :name="iconName"
           :size="12"
@@ -98,7 +101,7 @@ export default {
     <button
       v-if="canRemove"
       ref="removeButton"
-      v-tooltip
+      v-gl-tooltip
       :class="{
         'issue-token-remove-button': isCondensed,
         'btn btn-default': !isCondensed,

app/assets/javascripts/vue_shared/mixins/related_issuable_mixin.js

 import { isEmpty } from 'lodash';
 import { sprintf, __ } from '~/locale';
 import { formatDate } from '~/lib/utils/datetime_utility';
-import tooltip from '~/vue_shared/directives/tooltip';
 import timeagoMixin from '~/vue_shared/mixins/timeago';
 
 const mixins = {
@@ -99,9 +98,6 @@ const mixins = {
       default: () => ({}),
     },
   },
-  directives: {
-    tooltip,
-  },
   mixins: [timeagoMixin],
   computed: {
     hasState() {

spec/frontend/issuable/related_issues/components/issue_token_spec.js

@@ -137,9 +137,7 @@ describe('IssueToken', () => {
       });
 
       it('tooltip should not be escaped', () => {
-        expect(findRemoveBtn().attributes('data-original-title')).toBe(
-          `Remove ${displayReference}`,
-        );
+        expect(findRemoveBtn().attributes('aria-label')).toBe(`Remove ${displayReference}`);
       });
     });
   });