diff options
Diffstat (limited to 'spec/javascripts/diffs')
4 files changed, 171 insertions, 1 deletions
diff --git a/spec/javascripts/diffs/components/app_spec.js b/spec/javascripts/diffs/components/app_spec.js index 7be44a26ded..cf7d8df5405 100644 --- a/spec/javascripts/diffs/components/app_spec.js +++ b/spec/javascripts/diffs/components/app_spec.js @@ -3,6 +3,7 @@ import { mountComponentWithStore } from 'spec/helpers/vue_mount_component_helper import { TEST_HOST } from 'spec/test_constants'; import App from '~/diffs/components/app.vue'; import createDiffsStore from '../create_diffs_store'; +import getDiffWithCommit from '../mock_data/diff_with_commit'; describe('diffs/components/app', () => { const oldMrTabs = window.mrTabs; @@ -36,12 +37,17 @@ describe('diffs/components/app', () => { vm.$destroy(); }); + it('does not show commit info', () => { + expect(vm.$el).not.toContainElement('.blob-commit-info'); + }); + it('shows comments message, with commit', done => { - vm.$store.state.diffs.commit = {}; + vm.$store.state.diffs.commit = getDiffWithCommit().commit; vm.$nextTick() .then(() => { expect(vm.$el).toContainText('Only comments from the following commit are shown below'); + expect(vm.$el).toContainElement('.blob-commit-info'); }) .then(done) .catch(done.fail); diff --git a/spec/javascripts/diffs/components/commit_item_spec.js b/spec/javascripts/diffs/components/commit_item_spec.js new file mode 100644 index 00000000000..627fb8c490a --- /dev/null +++ b/spec/javascripts/diffs/components/commit_item_spec.js @@ -0,0 +1,128 @@ +import Vue from 'vue'; +import { TEST_HOST } from 'spec/test_constants'; +import mountComponent from 'spec/helpers/vue_mount_component_helper'; +import { trimText } from 'spec/helpers/vue_component_helper'; +import { getTimeago } from '~/lib/utils/datetime_utility'; +import CommitItem from '~/diffs/components/commit_item.vue'; +import getDiffWithCommit from '../mock_data/diff_with_commit'; + +const TEST_AUTHOR_NAME = 'test'; +const TEST_AUTHOR_EMAIL = 'test+test@gitlab.com'; +const TEST_AUTHOR_GRAVATAR = `${TEST_HOST}/avatar/test?s=36`; + +const getTitleElement = vm => vm.$el.querySelector('.commit-row-message.item-title'); +const getDescElement = vm => vm.$el.querySelector('pre.commit-row-description'); +const getDescExpandElement = vm => vm.$el.querySelector('.commit-content .text-expander.js-toggle-button'); +const getShaElement = vm => vm.$el.querySelector('.commit-sha-group'); +const getAvatarElement = vm => vm.$el.querySelector('.user-avatar-link'); +const getCommitterElement = vm => vm.$el.querySelector('.commiter'); + +describe('diffs/components/commit_widget', () => { + const Component = Vue.extend(CommitItem); + const timeago = getTimeago(); + const { commit } = getDiffWithCommit(); + + let vm; + + beforeEach(() => { + vm = mountComponent(Component, { + commit: getDiffWithCommit().commit, + }); + }); + + it('renders commit title', () => { + const titleElement = getTitleElement(vm); + + expect(titleElement).toHaveAttr('href', commit.commitUrl); + expect(titleElement).toHaveText(commit.titleHtml); + }); + + it('renders commit description', () => { + const descElement = getDescElement(vm); + const descExpandElement = getDescExpandElement(vm); + + const expected = commit.descriptionHtml.replace(/
/g, ''); + + expect(trimText(descElement.innerHTML)).toEqual(trimText(expected)); + expect(descExpandElement).not.toBeNull(); + }); + + it('renders commit sha', () => { + const shaElement = getShaElement(vm); + const labelElement = shaElement.querySelector('.label'); + const buttonElement = shaElement.querySelector('button'); + + expect(labelElement.textContent).toEqual(commit.shortId); + expect(buttonElement).toHaveData('clipboard-text', commit.id); + }); + + it('renders author avatar', () => { + const avatarElement = getAvatarElement(vm); + const imgElement = avatarElement.querySelector('img'); + + expect(avatarElement).toHaveAttr('href', commit.author.webUrl); + expect(imgElement).toHaveClass('s36'); + expect(imgElement).toHaveAttr('alt', commit.author.name); + expect(imgElement).toHaveAttr('src', commit.author.avatarUrl); + }); + + it('renders committer text', () => { + const committerElement = getCommitterElement(vm); + const nameElement = committerElement.querySelector('a'); + + const expectTimeText = timeago.format(commit.authoredDate); + const expectedText = `${commit.author.name} authored ${expectTimeText}`; + + expect(trimText(committerElement.textContent)).toEqual(expectedText); + expect(nameElement).toHaveAttr('href', commit.author.webUrl); + expect(nameElement).toHaveText(commit.author.name); + }); + + describe('without commit description', () => { + beforeEach(done => { + vm.commit.descriptionHtml = ''; + + vm.$nextTick() + .then(done) + .catch(done.fail); + }); + + it('hides description', () => { + const descElement = getDescElement(vm); + const descExpandElement = getDescExpandElement(vm); + + expect(descElement).toBeNull(); + expect(descExpandElement).toBeNull(); + }); + }); + + describe('with no matching user', () => { + beforeEach(done => { + vm.commit.author = null; + vm.commit.authorEmail = TEST_AUTHOR_EMAIL; + vm.commit.authorName = TEST_AUTHOR_NAME; + vm.commit.authorGravatarUrl = TEST_AUTHOR_GRAVATAR; + + vm.$nextTick() + .then(done) + .catch(done.fail); + }); + + it('renders author avatar', () => { + const avatarElement = getAvatarElement(vm); + const imgElement = avatarElement.querySelector('img'); + + expect(avatarElement).toHaveAttr('href', `mailto:${TEST_AUTHOR_EMAIL}`); + expect(imgElement).toHaveAttr('alt', TEST_AUTHOR_NAME); + expect(imgElement).toHaveAttr('src', TEST_AUTHOR_GRAVATAR); + }); + + it('renders committer text', () => { + const committerElement = getCommitterElement(vm); + const nameElement = committerElement.querySelector('a'); + + expect(nameElement).toHaveAttr('href', `mailto:${TEST_AUTHOR_EMAIL}`); + expect(nameElement).toHaveText(TEST_AUTHOR_NAME); + }); + }); +}); diff --git a/spec/javascripts/diffs/components/commit_widget_spec.js b/spec/javascripts/diffs/components/commit_widget_spec.js new file mode 100644 index 00000000000..951eb57255d --- /dev/null +++ b/spec/javascripts/diffs/components/commit_widget_spec.js @@ -0,0 +1,24 @@ +import Vue from 'vue'; +import mountComponent from 'spec/helpers/vue_mount_component_helper'; +import CommitWidget from '~/diffs/components/commit_widget.vue'; +import getDiffWithCommit from '../mock_data/diff_with_commit'; + +describe('diffs/components/commit_widget', () => { + const Component = Vue.extend(CommitWidget); + const { commit } = getDiffWithCommit(); + + let vm; + + beforeEach(() => { + vm = mountComponent(Component, { + commit: getDiffWithCommit().commit, + }); + }); + + it('renders commit item', () => { + const commitElement = vm.$el.querySelector('li.commit'); + + expect(commitElement).not.toBeNull(); + expect(commitElement).toContainText(commit.shortId); + }); +}); diff --git a/spec/javascripts/diffs/mock_data/diff_with_commit.js b/spec/javascripts/diffs/mock_data/diff_with_commit.js new file mode 100644 index 00000000000..98393a20583 --- /dev/null +++ b/spec/javascripts/diffs/mock_data/diff_with_commit.js @@ -0,0 +1,12 @@ +import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils'; + +const FIXTURE = 'merge_request_diffs/with_commit.json'; + +preloadFixtures(FIXTURE); + +export default function getDiffWithCommit() { + return convertObjectPropsToCamelCase( + getJSONFixture(FIXTURE), + { deep: true }, + ); +} |