Commit 37e15342 authored by Phil Hughes's avatar Phil Hughes

Merge branch '225295-fix-missing-avatar' into 'master'

Fix missing avatar in MR widget

Closes #225295

See merge request gitlab-org/gitlab!36034
parents 49b1e3ec dec4000f
...@@ -27,7 +27,7 @@ export default { ...@@ -27,7 +27,7 @@ export default {
return this.author.webUrl || this.author.web_url; return this.author.webUrl || this.author.web_url;
}, },
avatarUrl() { avatarUrl() {
return this.author.avatarUrl || this.author.avatar_url; return this.author.avatarUrl || this.author.avatar_url || gl.mrWidgetData.defaultAvatarUrl;
}, },
}, },
}; };
...@@ -40,6 +40,6 @@ export default { ...@@ -40,6 +40,6 @@ export default {
class="author-link inline" class="author-link inline"
> >
<img :src="avatarUrl" class="avatar avatar-inline s16" /> <img :src="avatarUrl" class="avatar avatar-inline s16" />
<span v-if="showAuthorName" class="author"> {{ author.name }} </span> <span v-if="showAuthorName" class="author">{{ author.name }}</span>
</a> </a>
</template> </template>
...@@ -8,6 +8,7 @@ export default () => { ...@@ -8,6 +8,7 @@ export default () => {
if (gl.mrWidget) return; if (gl.mrWidget) return;
gl.mrWidgetData.gitlabLogo = gon.gitlab_logo; gl.mrWidgetData.gitlabLogo = gon.gitlab_logo;
gl.mrWidgetData.defaultAvatarUrl = gon.default_avatar_url;
const vm = new Vue(MrWidgetOptions); const vm = new Vue(MrWidgetOptions);
......
---
title: Fix missing avatar in MR widget
merge_request: 36034
author:
type: fixed
import Vue from 'vue'; import { shallowMount } from '@vue/test-utils';
import mountComponent from 'helpers/vue_mount_component_helper';
import MrWidgetAuthor from '~/vue_merge_request_widget/components/mr_widget_author.vue'; import MrWidgetAuthor from '~/vue_merge_request_widget/components/mr_widget_author.vue';
describe('MrWidgetAuthor', () => { window.gl = window.gl || {};
let vm;
beforeEach(() => {
const Component = Vue.extend(MrWidgetAuthor);
vm = mountComponent(Component, { describe('MrWidgetAuthor', () => {
author: { let wrapper;
let oldWindowGl;
const mockAuthor = {
name: 'Administrator', name: 'Administrator',
username: 'root', username: 'root',
webUrl: 'http://localhost:3000/root', webUrl: 'http://localhost:3000/root',
avatarUrl: avatarUrl: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon', };
beforeEach(() => {
oldWindowGl = window.gl;
window.gl = {
mrWidgetData: {
defaultAvatarUrl: 'no_avatar.png',
},
};
wrapper = shallowMount(MrWidgetAuthor, {
propsData: {
author: mockAuthor,
}, },
}); });
}); });
afterEach(() => { afterEach(() => {
vm.$destroy(); wrapper.destroy();
window.gl = oldWindowGl;
}); });
it('renders link with the author web url', () => { it('renders link with the author web url', () => {
expect(vm.$el.getAttribute('href')).toEqual('http://localhost:3000/root'); expect(wrapper.attributes('href')).toBe('http://localhost:3000/root');
}); });
it('renders image with avatar url', () => { it('renders image with avatar url', () => {
expect(vm.$el.querySelector('img').getAttribute('src')).toEqual( expect(wrapper.find('img').attributes('src')).toBe(
'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon', 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
); );
}); });
it('renders image with default avatar url when no avatarUrl is present in author', async () => {
wrapper.setProps({
author: {
...mockAuthor,
avatarUrl: null,
},
});
await wrapper.vm.$nextTick();
expect(wrapper.find('img').attributes('src')).toBe('no_avatar.png');
});
it('renders author name', () => { it('renders author name', () => {
expect(vm.$el.textContent.trim()).toEqual('Administrator'); expect(wrapper.find('span').text()).toBe('Administrator');
}); });
}); });
...@@ -8,6 +8,7 @@ import { MWPS_MERGE_STRATEGY } from '~/vue_merge_request_widget/constants'; ...@@ -8,6 +8,7 @@ import { MWPS_MERGE_STRATEGY } from '~/vue_merge_request_widget/constants';
describe('MRWidgetAutoMergeEnabled', () => { describe('MRWidgetAutoMergeEnabled', () => {
let vm; let vm;
let oldWindowGl;
const targetBranchPath = '/foo/bar'; const targetBranchPath = '/foo/bar';
const targetBranch = 'foo'; const targetBranch = 'foo';
const sha = '1EA2EZ34'; const sha = '1EA2EZ34';
...@@ -16,6 +17,13 @@ describe('MRWidgetAutoMergeEnabled', () => { ...@@ -16,6 +17,13 @@ describe('MRWidgetAutoMergeEnabled', () => {
const Component = Vue.extend(autoMergeEnabledComponent); const Component = Vue.extend(autoMergeEnabledComponent);
jest.spyOn(eventHub, '$emit').mockImplementation(() => {}); jest.spyOn(eventHub, '$emit').mockImplementation(() => {});
oldWindowGl = window.gl;
window.gl = {
mrWidgetData: {
defaultAvatarUrl: 'no_avatar.png',
},
};
vm = mountComponent(Component, { vm = mountComponent(Component, {
mr: { mr: {
shouldRemoveSourceBranch: false, shouldRemoveSourceBranch: false,
...@@ -35,6 +43,7 @@ describe('MRWidgetAutoMergeEnabled', () => { ...@@ -35,6 +43,7 @@ describe('MRWidgetAutoMergeEnabled', () => {
afterEach(() => { afterEach(() => {
vm.$destroy(); vm.$destroy();
window.gl = oldWindowGl;
}); });
describe('computed', () => { describe('computed', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment