Merge branch 'use-tooltip-component-in-mr-widget-author-time-component' into 'master'

Use Tooltip component in MrWidgetAuthorTime vue component

See merge request gitlab-org/gitlab-ce!19635
This commit is contained in:
Filipa Lacerda 2018-06-11 13:38:07 +00:00
commit 61ac2462d5
6 changed files with 20 additions and 12 deletions

View file

@ -1,11 +1,15 @@
<script>
import tooltip from '~/vue_shared/directives/tooltip';
import MrWidgetAuthor from './mr_widget_author.vue';
export default {
name: 'MRWidgetAuthorTime',
name: 'MrWidgetAuthorTime',
components: {
MrWidgetAuthor,
},
directives: {
tooltip,
},
props: {
actionText: {
type: String,
@ -32,8 +36,7 @@
<mr-widget-author :author="author" />
<time
:title="dateTitle"
data-toggle="tooltip"
data-placement="top"
v-tooltip
data-container="body"
>
{{ dateReadable }}

View file

@ -1,11 +1,11 @@
<script>
import mrWidgetAuthorTime from '../../components/mr_widget_author_time.vue';
import MrWidgetAuthorTime from '../../components/mr_widget_author_time.vue';
import statusIcon from '../mr_widget_status_icon.vue';
export default {
name: 'MRWidgetClosed',
components: {
mrWidgetAuthorTime,
MrWidgetAuthorTime,
statusIcon,
},
props: {

View file

@ -4,7 +4,7 @@
import loadingIcon from '~/vue_shared/components/loading_icon.vue';
import { s__, __ } from '~/locale';
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
import mrWidgetAuthorTime from '../../components/mr_widget_author_time.vue';
import MrWidgetAuthorTime from '../../components/mr_widget_author_time.vue';
import statusIcon from '../mr_widget_status_icon.vue';
import eventHub from '../../event_hub';
@ -14,7 +14,7 @@
tooltip,
},
components: {
mrWidgetAuthorTime,
MrWidgetAuthorTime,
loadingIcon,
statusIcon,
ClipboardButton,

View file

@ -0,0 +1,5 @@
---
title: Use Tooltip component in MrWidgetAuthorTime vue comonent
merge_request: 19635
author: George Tsiolis
type: performance

View file

@ -1,12 +1,12 @@
import Vue from 'vue';
import authorTimeComponent from '~/vue_merge_request_widget/components/mr_widget_author_time.vue';
import MrWidgetAuthorTime from '~/vue_merge_request_widget/components/mr_widget_author_time.vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
describe('MRWidgetAuthorTime', () => {
describe('MrWidgetAuthorTime', () => {
let vm;
beforeEach(() => {
const Component = Vue.extend(authorTimeComponent);
const Component = Vue.extend(MrWidgetAuthorTime);
vm = mountComponent(Component, {
actionText: 'Merged by',
@ -34,7 +34,7 @@ describe('MRWidgetAuthorTime', () => {
});
it('renders provided time', () => {
expect(vm.$el.querySelector('time').getAttribute('title')).toEqual('2017-03-23T23:02:00.807Z');
expect(vm.$el.querySelector('time').getAttribute('data-original-title')).toEqual('2017-03-23T23:02:00.807Z');
expect(vm.$el.querySelector('time').textContent.trim()).toEqual('12 hours ago');
});
});

View file

@ -186,7 +186,7 @@ describe('MRWidgetMerged', () => {
it('should use mergedEvent mergedAt as tooltip title', () => {
expect(
vm.$el.querySelector('time').getAttribute('title'),
vm.$el.querySelector('time').getAttribute('data-original-title'),
).toBe('Jan 24, 2018 1:02pm GMT+0000');
});
});