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:
commit
61ac2462d5
6 changed files with 20 additions and 12 deletions
|
@ -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 }}
|
||||
|
|
|
@ -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: {
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
title: Use Tooltip component in MrWidgetAuthorTime vue comonent
|
||||
merge_request: 19635
|
||||
author: George Tsiolis
|
||||
type: performance
|
|
@ -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');
|
||||
});
|
||||
});
|
||||
|
|
|
@ -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');
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue