summaryrefslogtreecommitdiff
path: root/spec/javascripts/diffs/components/commit_item_spec.js
blob: 627fb8c490a6f3c1a7261b35e20ed431e0f62e93 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
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);
    });
  });
});