Commit f55206ce authored by Filipa Lacerda's avatar Filipa Lacerda

Adds missing tests for commit component

parent b210cbca
......@@ -133,7 +133,7 @@
<div v-if="hasRef" class="icon-container">
<i v-if="tag" class="fa fa-tag"></i>
<i v-else class="fa fa-code-fork"></i>
<i v-if="!tag" class="fa fa-code-fork"></i>
</div>
<a v-if="hasRef"
......
/*= require vue_common_components/commit */
/* eslint-disable */
//= require vue_common_component/commit
describe('Commit component', () => {
const getRenderedText = (Component, propsData) => {
const Constructor = Vue.extend(Component);
const vm = new Constructor({propsData}).$mount();
return vm.$el.textContent;
};
const MyComponent = window.gl.commitComponent;
let props;
let component;
it('should render a code-fork icon if it does not represent a tag', () => {
fixture.set('<div class="test-commit-container"></div>');
component = new window.gl.CommitComponent({
el: document.querySelector('.test-commit-container'),
propsData: {
tag: false,
ref: {
name: 'master',
ref_url: 'http://localhost/namespace2/gitlabhq/tree/master',
},
commit_url: 'https://gitlab.com/gitlab-org/gitlab-ce/commit/b7836eddf62d663c665769e1b0960197fd215067',
short_sha: 'b7836edd',
title: 'Commit message',
author: {
avatar_url: 'https://gitlab.com/uploads/user/avatar/300478/avatar.png',
web_url: 'https://gitlab.com/jschatz1',
username: 'jschatz1',
},
},
});
expect(component.$el.querySelector('.icon-container i').classList).toContain('fa-code-fork');
});
describe('When `ref` is provided', () => {
const props = {
describe('Given all the props', () => {
beforeEach(() => {
fixture.set('<div class="test-commit-container"></div>');
props = {
tag: true,
ref: {
name: 'master',
ref_url: 'http://localhost/namespace2/gitlabhq/tree/master'
ref_url: 'http://localhost/namespace2/gitlabhq/tree/master',
},
commit_url: 'https://gitlab.com/gitlab-org/gitlab-ce/commit/b7836eddf62d663c665769e1b0960197fd215067',
short_sha: 'b7836edd',
......@@ -23,67 +46,83 @@ describe('Commit component', () => {
author: {
avatar_url: 'https://gitlab.com/uploads/user/avatar/300478/avatar.png',
web_url: 'https://gitlab.com/jschatz1',
username: 'jschatz1'
}
username: 'jschatz1',
},
};
it('should render a tag icon if it represents a tag', () => {
const renderedText = getRenderedText(MyComponent, props);
component = new window.gl.CommitComponent({
el: document.querySelector('.test-commit-container'),
propsData: props,
});
});
it('should render a code-fork icon if it does not represent a tag', () => {
it('should render a tag icon if it represents a tag', () => {
expect(component.$el.querySelector('.icon-container i').classList).toContain('fa-tag');
});
it('should render a link to the ref url', () => {
expect(component.$el.querySelector('.branch-name').getAttribute('href')).toEqual(props.ref.ref_url);
});
it('should render the ref name', () => {
expect(component.$el.querySelector('.branch-name').textContent).toContain(props.ref.name);
});
});
});
it('should render the commit icon as an svg', () => {
});
it('should render the commit short sha with a link to the commit url', () => {
});
it('should render the commit short sha with a link to the commit url', () => {
expect(component.$el.querySelector('.commit-id').getAttribute('href')).toEqual(props.commit_url);
expect(component.$el.querySelector('.commit-id').textContent).toContain(props.short_sha);
});
describe('Given commit title and author props', () => {
describe('Given commit title and author props', () => {
it('Should render a link to the author profile', () => {
expect(
component.$el.querySelector('.commit-title .avatar-image-container').getAttribute('href')
).toEqual(props.author.web_url);
});
it('Should render the author avatar with title and alt attributes', () => {
expect(
component.$el.querySelector('.commit-title .avatar-image-container img').getAttribute('title')
).toContain(props.author.username);
expect(
component.$el.querySelector('.commit-title .avatar-image-container img').getAttribute('alt')
).toContain(`${props.author.username}'s avatar`);
});
});
describe('When commit title is not provided', () => {
it('Should render default message', () => {
});
});
describe('Given no ref prop', () => {
it('Should render without errors', () => {
it('should render the commit title', () => {
expect(
component.$el.querySelector('a.commit-row-message').getAttribute('href')
).toEqual(props.commit_url);
expect(
component.$el.querySelector('a.commit-row-message').textContent
).toContain(props.title);
});
});
});
describe('Given no title prop', () => {
it('Should render without errors', () => {
describe('When commit title is not provided', () => {
it('Should render default message', () => {
fixture.set('<div class="test-commit-container"></div>');
props = {
tag: false,
ref: {
name: 'master',
ref_url: 'http://localhost/namespace2/gitlabhq/tree/master',
},
commit_url: 'https://gitlab.com/gitlab-org/gitlab-ce/commit/b7836eddf62d663c665769e1b0960197fd215067',
short_sha: 'b7836edd',
title: null,
author: {},
};
component = new window.gl.CommitComponent({
el: document.querySelector('.test-commit-container'),
propsData: props,
});
});
describe('Given no author prop', () => {
it('Should render without errors', () => {
expect(
component.$el.querySelector('.commit-title span').textContent
).toContain('Cant find HEAD commit for this branch');
});
});
});
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