Add karma specs

spec/javascripts/issue_show/components/app_spec.js

@@ -38,8 +38,8 @@ describe('Issuable output', () => {
         issuableRef: '#1',
         initialTitleHtml: '',
         initialTitleText: '',
-        initialDescriptionHtml: '',
-        initialDescriptionText: '',
+        initialDescriptionHtml: 'test',
+        initialDescriptionText: 'test',
         markdownPreviewPath: '/',
         markdownDocsPath: '/',
         projectNamespace: '/',
@@ -366,4 +366,15 @@ describe('Issuable output', () => {
       expect(vm.$el.querySelector('.title-container .note-action-button')).toBeDefined();
     });
   });
+
+  describe('update url', () => {
+    it('sets update url in description textarea', (done) => {
+      vm.showForm = true;
+      vm.canUpdate = false;
+      Vue.nextTick(() => {
+        expect(vm.$el.querySelector('.js-task-list-field').dataset.updateUrl).toEqual(`${vm.endpoint}.json`);
+        done();
+      });
+    });
+  });
 });

spec/javascripts/issue_show/components/description_spec.js

 import Vue from 'vue';
 import descriptionComponent from '~/issue_show/components/description.vue';
+import * as taskList from '~/task_list';
+import mountComponent from '../../helpers/vue_mount_component_helper';
 
 describe('Description component', () => {
   let vm;
+  let DescriptionComponent;
+  const props = {
+    canUpdate: true,
+    descriptionHtml: 'test',
+    descriptionText: 'test',
+    updatedAt: new Date().toString(),
+    taskStatus: '',
+    updateUrl: gl.TEST_HOST,
+  };
 
   beforeEach(() => {
-    const Component = Vue.extend(descriptionComponent);
+    DescriptionComponent = Vue.extend(descriptionComponent);
 
     if (!document.querySelector('.issuable-meta')) {
       const metaData = document.createElement('div');
@@ -15,15 +26,11 @@ describe('Description component', () => {
       document.body.appendChild(metaData);
     }
 
-    vm = new Component({
-      propsData: {
-        canUpdate: true,
-        descriptionHtml: 'test',
-        descriptionText: 'test',
-        updatedAt: new Date().toString(),
-        taskStatus: '',
-      },
-    }).$mount();
+    vm = mountComponent(DescriptionComponent, props);
+  });
+
+  afterEach(() => {
+    vm.$destroy;
   });
 
   it('animates description changes', (done) => {
@@ -44,34 +51,46 @@ describe('Description component', () => {
     });
   });
 
-  // TODO: gl.TaskList no longer exists. rewrite these tests once we have a way to rewire ES modules
-
-  // it('re-inits the TaskList when description changed', (done) => {
-  //   spyOn(gl, 'TaskList');
-  //   vm.descriptionHtml = 'changed';
-  //
-  //   setTimeout(() => {
-  //     expect(
-  //       gl.TaskList,
-  //     ).toHaveBeenCalled();
-  //
-  //     done();
-  //   });
-  // });
-
-  // it('does not re-init the TaskList when canUpdate is false', (done) => {
-  //   spyOn(gl, 'TaskList');
-  //   vm.canUpdate = false;
-  //   vm.descriptionHtml = 'changed';
-  //
-  //   setTimeout(() => {
-  //     expect(
-  //       gl.TaskList,
-  //     ).not.toHaveBeenCalled();
-  //
-  //     done();
-  //   });
-  // });
+  describe('TaskList', () => {
+    beforeEach(() => {
+      vm = mountComponent(DescriptionComponent, Object.assign({}, props, {
+        issuableType: 'issuableType',
+      }));
+      spyOn(taskList, 'default');
+    });
+
+    it('re-inits the TaskList when description changed', (done) => {
+      vm.descriptionHtml = 'changed';
+
+      setTimeout(() => {
+        expect(taskList.default).toHaveBeenCalled();
+        done();
+      });
+    });
+
+    it('does not re-init the TaskList when canUpdate is false', (done) => {
+      vm.canUpdate = false;
+      vm.descriptionHtml = 'changed';
+
+      setTimeout(() => {
+        expect(taskList.default).not.toHaveBeenCalled();
+        done();
+      });
+    });
+
+    it('calls with issuableType dataType', (done) => {
+      vm.descriptionHtml = 'changed';
+
+      setTimeout(() => {
+        expect(taskList.default).toHaveBeenCalledWith({
+          dataType: 'issuableType',
+          fieldName: 'description',
+          selector: '.detail-page-description',
+        });
+        done();
+      });
+    });
+  });
 
   describe('taskStatus', () => {
     it('adds full taskStatus', (done) => {
@@ -126,4 +145,8 @@ describe('Description component', () => {
       });
     });
   });
+
+  it('sets data-update-url', () => {
+    expect(vm.$el.querySelector('textarea').dataset.updateUrl).toEqual(gl.TEST_HOST);
+  });
 });