summaryrefslogtreecommitdiff
path: root/spec/javascripts/diffs/components/parallel_diff_table_row_spec.js
blob: 4e69382ba03296158777d559f9290e0001e9fd24 (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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
import Vue from 'vue';
import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
import { createStore } from '~/mr_notes/stores';
import ParallelDiffTableRow from '~/diffs/components/parallel_diff_table_row.vue';
import diffFileMockData from '../mock_data/diff_file';

describe('ParallelDiffTableRow', () => {
  describe('when one side is empty', () => {
    let vm;
    const thisLine = diffFileMockData.parallel_diff_lines[0];
    const rightLine = diffFileMockData.parallel_diff_lines[0].right;

    beforeEach(() => {
      vm = createComponentWithStore(Vue.extend(ParallelDiffTableRow), createStore(), {
        line: thisLine,
        fileHash: diffFileMockData.file_hash,
        filePath: diffFileMockData.file_path,
        contextLinesPath: 'contextLinesPath',
        isHighlighted: false,
      }).$mount();
    });

    it('does not highlight non empty line content when line does not match highlighted row', done => {
      vm.$nextTick()
        .then(() => {
          expect(vm.$el.querySelector('.line_content.right-side').classList).not.toContain('hll');
        })
        .then(done)
        .catch(done.fail);
    });

    it('highlights nonempty line content when line is the highlighted row', done => {
      vm.$nextTick()
        .then(() => {
          vm.$store.state.diffs.highlightedRow = rightLine.line_code;

          return vm.$nextTick();
        })
        .then(() => {
          expect(vm.$el.querySelector('.line_content.right-side').classList).toContain('hll');
        })
        .then(done)
        .catch(done.fail);
    });
  });

  describe('when both sides have content', () => {
    let vm;
    const thisLine = diffFileMockData.parallel_diff_lines[2];
    const rightLine = diffFileMockData.parallel_diff_lines[2].right;

    beforeEach(() => {
      vm = createComponentWithStore(Vue.extend(ParallelDiffTableRow), createStore(), {
        line: thisLine,
        fileHash: diffFileMockData.file_hash,
        filePath: diffFileMockData.file_path,
        contextLinesPath: 'contextLinesPath',
        isHighlighted: false,
      }).$mount();
    });

    it('does not highlight  either line when line does not match highlighted row', done => {
      vm.$nextTick()
        .then(() => {
          expect(vm.$el.querySelector('.line_content.right-side').classList).not.toContain('hll');
          expect(vm.$el.querySelector('.line_content.left-side').classList).not.toContain('hll');
        })
        .then(done)
        .catch(done.fail);
    });

    it('adds hll class to lineContent when line is the highlighted row', done => {
      vm.$nextTick()
        .then(() => {
          vm.$store.state.diffs.highlightedRow = rightLine.line_code;

          return vm.$nextTick();
        })
        .then(() => {
          expect(vm.$el.querySelector('.line_content.right-side').classList).toContain('hll');
          expect(vm.$el.querySelector('.line_content.left-side').classList).toContain('hll');
        })
        .then(done)
        .catch(done.fail);
    });

    describe('sets coverage title and class', () => {
      it('for lines with coverage', done => {
        vm.$nextTick()
          .then(() => {
            const name = diffFileMockData.file_path;
            const line = rightLine.new_line;

            vm.$store.state.diffs.coverageFiles = { files: { [name]: { [line]: 5 } } };

            return vm.$nextTick();
          })
          .then(() => {
            const coverage = vm.$el.querySelector('.line-coverage.right-side');

            expect(coverage.title).toContain('Test coverage: 5 hits');
            expect(coverage.classList).toContain('coverage');
          })
          .then(done)
          .catch(done.fail);
      });

      it('for lines without coverage', done => {
        vm.$nextTick()
          .then(() => {
            const name = diffFileMockData.file_path;
            const line = rightLine.new_line;

            vm.$store.state.diffs.coverageFiles = { files: { [name]: { [line]: 0 } } };

            return vm.$nextTick();
          })
          .then(() => {
            const coverage = vm.$el.querySelector('.line-coverage.right-side');

            expect(coverage.title).toContain('No test coverage');
            expect(coverage.classList).toContain('no-coverage');
          })
          .then(done)
          .catch(done.fail);
      });

      it('for unknown lines', done => {
        vm.$nextTick()
          .then(() => {
            vm.$store.state.diffs.coverageFiles = {};

            return vm.$nextTick();
          })
          .then(() => {
            const coverage = vm.$el.querySelector('.line-coverage.right-side');

            expect(coverage.title).not.toContain('Coverage');
            expect(coverage.classList).not.toContain('coverage');
            expect(coverage.classList).not.toContain('no-coverage');
          })
          .then(done)
          .catch(done.fail);
      });
    });
  });
});