From c7d671a97d414b4679525e3cd9c177e31178754b Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Wed, 27 Jun 2018 15:10:50 +0100
Subject: [PATCH] Uses tooltip vue directive in issue card component
---
.../javascripts/boards/components/issue_card_inner.vue | 10 ++++++++--
spec/javascripts/boards/issue_card_spec.js | 4 ++--
2 files changed, 10 insertions(+), 4 deletions(-)
diff --git a/app/assets/javascripts/boards/components/issue_card_inner.vue b/app/assets/javascripts/boards/components/issue_card_inner.vue
index a0b7fe81a4a..d50641dc3a9 100644
--- a/app/assets/javascripts/boards/components/issue_card_inner.vue
+++ b/app/assets/javascripts/boards/components/issue_card_inner.vue
@@ -2,6 +2,7 @@
import $ from 'jquery';
import UserAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
import eventHub from '../eventhub';
+ import tooltip from '../../vue_shared/directives/tooltip';
const Store = gl.issueBoards.BoardsStore;
@@ -9,6 +10,9 @@
components: {
UserAvatarLink,
},
+ directives: {
+ tooltip,
+ },
props: {
issue: {
type: Object,
@@ -166,9 +170,10 @@
tooltip-placement="bottom"
/>
<span
+ v-tooltip
v-if="shouldRenderCounter"
:title="assigneeCounterTooltip"
- class="avatar-counter has-tooltip"
+ class="avatar-counter"
>
{{ assigneeCounterLabel }}
</span>
@@ -179,12 +184,13 @@
class="board-card-footer"
>
<button
+ v-tooltip
v-for="label in issue.labels"
v-if="showLabel(label)"
:key="label.id"
:style="labelStyle(label)"
:title="label.description"
- class="badge color-label has-tooltip"
+ class="badge color-label"
type="button"
data-container="body"
@click="filterByLabel(label, $event)"
diff --git a/spec/javascripts/boards/issue_card_spec.js b/spec/javascripts/boards/issue_card_spec.js
index 72e961c8a10..7a32e84bced 100644
--- a/spec/javascripts/boards/issue_card_spec.js
+++ b/spec/javascripts/boards/issue_card_spec.js
@@ -255,7 +255,7 @@ describe('Issue card component', () => {
it('renders label', () => {
const nodes = [];
component.$el.querySelectorAll('.badge').forEach((label) => {
- nodes.push(label.title);
+ nodes.push(label.getAttribute('data-original-title'));
});
expect(
@@ -265,7 +265,7 @@ describe('Issue card component', () => {
it('sets label description as title', () => {
expect(
- component.$el.querySelector('.badge').getAttribute('title'),
+ component.$el.querySelector('.badge').getAttribute('data-original-title'),
).toContain(label1.description);
});
--
GitLab