Catches errors when generating lists

2 files changed, 99 insertions, 0 deletions

diff --git a/app/assets/javascripts/boards/components/board_blank_state.js b/app/assets/javascripts/boards/components/board_blank_state.js
index 32c5be0a5fc..be9e3d35fa6 100644
--- a/app/assets/javascripts/boards/components/board_blank_state.js
+++ b/app/assets/javascripts/boards/components/board_blank_state.js
@@ -69,6 +69,13 @@ export default {
             list.label.id = listObj.label.id;
             list.getIssues();
           });
+        })
+        .catch(() => {
+          Store.removeList(undefined, 'label');
+          Cookies.remove('issue_board_welcome_hidden', {
+            path: '',
+          });
+          Store.addBlankState();
         });
     },
     clearBlankState: Store.removeBlankState.bind(Store),
diff --git a/spec/javascripts/boards/board_blank_state_spec.js b/spec/javascripts/boards/board_blank_state_spec.js
new file mode 100644
index 00000000000..0401ad0ab85
--- /dev/null
+++ b/spec/javascripts/boards/board_blank_state_spec.js
@@ -0,0 +1,92 @@
+import Vue from 'vue';
+import store from '~/boards/stores/boards_store';
+import boardBlankState from '~/boards/components/board_blank_state';
+import mockData from './mock_data';
+
+describe('Boards blank state', () => {
+  let vm;
+  let fail = false;
+
+  beforeEach((done) => {
+    const Comp = Vue.extend(boardBlankState);
+
+    gl.issueBoards.BoardsStore.create();
+    gl.boardService = new BoardService('/test/issue-boards/board', '', '1');
+
+    spyOn(gl.boardService, 'generateDefaultLists').and.callFake(() => new Promise((resolve, reject) => {
+      if (fail) {
+        reject();
+      } else {
+        resolve({
+          json() {
+            return [{
+              id: 1,
+              title: 'To Do',
+              label: { id: 1 },
+            }, {
+              id: 2,
+              title: 'Doing',
+              label: { id: 2 },
+            }]
+          },
+        });
+      }
+    }));
+
+    vm = new Comp();
+
+    setTimeout(() => {
+      vm.$mount();
+      done();
+    });
+  });
+
+  it('renders pre-defined labels', () => {
+    expect(
+      vm.$el.querySelectorAll('.board-blank-state-list li').length
+    ).toBe(2);
+
+    expect(
+      vm.$el.querySelectorAll('.board-blank-state-list li')[0].textContent.trim()
+    ).toEqual('To Do');
+
+    expect(
+      vm.$el.querySelectorAll('.board-blank-state-list li')[1].textContent.trim()
+    ).toEqual('Doing');
+  });
+
+  it('clears blank state', (done) => {
+    vm.$el.querySelector('.btn-default').click();
+
+    setTimeout(() => {
+      expect(gl.issueBoards.BoardsStore.welcomeIsHidden()).toBeTruthy();
+
+      done();
+    });
+  });
+
+  it('creates pre-defined labels', (done) => {
+    vm.$el.querySelector('.btn-create').click();
+
+    setTimeout(() => {
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
+      expect(gl.issueBoards.BoardsStore.state.lists[0].title).toEqual('To Do');
+      expect(gl.issueBoards.BoardsStore.state.lists[1].title).toEqual('Doing');
+
+      done();
+    });
+  });
+
+  it('resets the store if request fails', (done) => {
+    fail = true;
+
+    vm.$el.querySelector('.btn-create').click();
+
+    setTimeout(() => {
+      expect(gl.issueBoards.BoardsStore.welcomeIsHidden()).toBeFalsy();
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
+
+      done();
+    });
+  });
+});