summaryrefslogtreecommitdiff
path: root/spec/javascripts/repo/components/repo_tab_spec.js
blob: 0d1c22a2f89ddb78704a4a250d6b4c2b2be1e00f (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
import Vue from 'vue';
import store from '~/repo/stores';
import repoTab from '~/repo/components/repo_tab.vue';
import { file, resetStore } from '../helpers';

describe('RepoTab', () => {
  function createComponent(propsData) {
    const RepoTab = Vue.extend(repoTab);

    return new RepoTab({
      store,
      propsData,
    }).$mount();
  }

  afterEach(() => {
    resetStore(vm.$store);
  });

  it('renders a close link and a name link', () => {
    const vm = createComponent({
      tab: file(),
    });
    vm.$store.state.openFiles.push(vm.tab);
    const close = vm.$el.querySelector('.close-btn');
    const name = vm.$el.querySelector(`a[title="${vm.tab.url}"]`);

    expect(close.querySelector('.fa-times')).toBeTruthy();
    expect(name.textContent.trim()).toEqual(vm.tab.name);
  });

  it('calls setFileActive when clicking tab', () => {
    const vm = createComponent({
      tab: file(),
    });

    spyOn(vm, 'setFileActive');

    vm.$el.click();

    expect(vm.setFileActive).toHaveBeenCalledWith(vm.tab);
  });

  it('calls closeFile when clicking close button', () => {
    const vm = createComponent({
      tab: file(),
    });

    spyOn(vm, 'closeFile');

    vm.$el.querySelector('.close-btn').click();

    expect(vm.closeFile).toHaveBeenCalledWith({ file: vm.tab });
  });

  it('renders an fa-circle icon if tab is changed', () => {
    const tab = file();
    tab.changed = true;
    const vm = createComponent({
      tab,
    });

    expect(vm.$el.querySelector('.close-btn .fa-circle')).toBeTruthy();
  });

  describe('methods', () => {
    describe('closeTab', () => {
      it('does not close tab if is changed', (done) => {
        const tab = file();
        tab.changed = true;
        tab.opened = true;
        const vm = createComponent({
          tab,
        });
        vm.$store.state.openFiles.push(tab);
        vm.$store.dispatch('setFileActive', tab);

        vm.$el.querySelector('.close-btn').click();

        vm.$nextTick(() => {
          expect(tab.opened).toBeTruthy();

          done();
        });
      });

      it('closes tab when clicking close btn', (done) => {
        const tab = file('lose');
        tab.opened = true;
        const vm = createComponent({
          tab,
        });
        vm.$store.state.openFiles.push(tab);
        vm.$store.dispatch('setFileActive', tab);

        vm.$el.querySelector('.close-btn').click();

        vm.$nextTick(() => {
          expect(tab.opened).toBeFalsy();

          done();
        });
      });
    });
  });
});