board_new_issue_spec.js 4.4 KB
Newer Older
Phil Hughes's avatar
Phil Hughes committed
1 2 3 4
/* global boardsMockInterceptor */
/* global BoardService */
/* global List */
/* global listObj */
5

Phil Hughes's avatar
Phil Hughes committed
6
import Vue from 'vue';
7 8
import boardNewIssue from '~/boards/components/board_new_issue';

9 10
import '~/boards/models/list';
import './mock_data';
11

Phil Hughes's avatar
Phil Hughes committed
12
describe('Issue boards new issue form', () => {
13 14 15 16 17 18 19 20 21
  let vm;
  let list;
  const promiseReturn = {
    json() {
      return {
        iid: 100,
      };
    },
  };
22

23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
  const submitIssue = () => {
    vm.$el.querySelector('.btn-success').click();
  };

  beforeEach((done) => {
    const BoardNewIssueComp = Vue.extend(boardNewIssue);

    Vue.http.interceptors.push(boardsMockInterceptor);
    gl.boardService = new BoardService('/test/issue-boards/board', '', '1');
    gl.issueBoards.BoardsStore.create();
    gl.IssueBoardsApp = new Vue();

    setTimeout(() => {
      list = new List(listObj);

Phil Hughes's avatar
Phil Hughes committed
38 39 40 41 42 43 44
      spyOn(gl.boardService, 'newIssue').and.callFake(() => new Promise((resolve, reject) => {
        if (vm.title === 'error') {
          reject();
        } else {
          resolve(promiseReturn);
        }
      }));
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

      vm = new BoardNewIssueComp({
        propsData: {
          list,
        },
      }).$mount();

      done();
    }, 0);
  });

  afterEach(() => {
    Vue.http.interceptors = _.without(Vue.http.interceptors, boardsMockInterceptor);
  });

  it('disables submit button if title is empty', () => {
    expect(vm.$el.querySelector('.btn-success').disabled).toBe(true);
  });

  it('enables submit button if title is not empty', (done) => {
    vm.title = 'Testing Title';

    setTimeout(() => {
      expect(vm.$el.querySelector('.form-control').value).toBe('Testing Title');
      expect(vm.$el.querySelector('.btn-success').disabled).not.toBe(true);

      done();
    }, 0);
  });

  it('clears title after clicking cancel', (done) => {
    vm.$el.querySelector('.btn-default').click();

    setTimeout(() => {
      expect(vm.title).toBe('');
      done();
    }, 0);
  });

  it('does not create new issue if title is empty', (done) => {
    submitIssue();

    setTimeout(() => {
      expect(gl.boardService.newIssue).not.toHaveBeenCalled();
      done();
    }, 0);
  });

  describe('submit success', () => {
    it('creates new issue', (done) => {
      vm.title = 'submit title';

      setTimeout(() => {
        submitIssue();

        expect(gl.boardService.newIssue).toHaveBeenCalled();
        done();
      }, 0);
    });

    it('enables button after submit', (done) => {
Phil Hughes's avatar
Phil Hughes committed
106
      vm.title = 'submit issue';
107 108 109 110

      setTimeout(() => {
        submitIssue();

111
        expect(vm.$el.querySelector('.btn-success').disabled).toBe(false);
112 113 114 115 116 117 118
        done();
      }, 0);
    });

    it('clears title after submit', (done) => {
      vm.title = 'submit issue';

119
      Vue.nextTick(() => {
120 121
        submitIssue();

122 123 124 125 126
        setTimeout(() => {
          expect(vm.title).toBe('');
          done();
        }, 0);
      });
127 128
    });

129
    it('adds new issue to top of list after submit request', (done) => {
130 131 132 133 134
      vm.title = 'submit issue';

      setTimeout(() => {
        submitIssue();

135 136 137 138 139 140
        setTimeout(() => {
          expect(list.issues.length).toBe(2);
          expect(list.issues[0].title).toBe('submit issue');
          expect(list.issues[0].subscribed).toBe(true);
          done();
        }, 0);
141 142 143 144
      }, 0);
    });

    it('sets detail issue after submit', (done) => {
145
      expect(gl.issueBoards.BoardsStore.detail.issue.title).toBe(undefined);
146 147 148 149 150
      vm.title = 'submit issue';

      setTimeout(() => {
        submitIssue();

151 152 153 154 155
        setTimeout(() => {
          expect(gl.issueBoards.BoardsStore.detail.issue.title).toBe('submit issue');
          done();
        }, 0);
      }, 0);
156 157 158 159 160 161 162 163
    });

    it('sets detail list after submit', (done) => {
      vm.title = 'submit issue';

      setTimeout(() => {
        submitIssue();

164 165 166 167
        setTimeout(() => {
          expect(gl.issueBoards.BoardsStore.detail.list.id).toBe(list.id);
          done();
        }, 0);
168 169 170 171 172 173 174 175 176 177 178 179 180 181
      }, 0);
    });
  });

  describe('submit error', () => {
    it('removes issue', (done) => {
      vm.title = 'error';

      setTimeout(() => {
        submitIssue();

        setTimeout(() => {
          expect(list.issues.length).toBe(1);
          done();
182
        }, 0);
183 184 185 186 187 188 189 190 191 192 193 194
      }, 0);
    });

    it('shows error', (done) => {
      vm.title = 'error';

      setTimeout(() => {
        submitIssue();

        setTimeout(() => {
          expect(vm.error).toBe(true);
          done();
195
        }, 0);
196 197 198 199
      }, 0);
    });
  });
});