Fix unit tests for new context menu behaviors

src/app/board/board.component.ts

@@ -30,6 +30,7 @@ export class BoardDisplay implements OnInit, OnDestroy, AfterContentInit {
   private subs: Array<any>;
 
   private hideFiltered: boolean;
+  private everyOtherDrop: boolean;
 
   public categoryFilter: number;
   public userFilter: number;
@@ -132,46 +133,31 @@ export class BoardDisplay implements OnInit, OnDestroy, AfterContentInit {
       }
     });
 
-    let makeCall = false;
-    this.dragula.dropModel.subscribe(async (value: any) => {
-      makeCall = !makeCall;
-
-      if (!makeCall) {
-        return;
-      }
-
+    this.dragula.dropModel.subscribe((value: any) => {
       let taskId = +value[1].id,
         toColumnId = +value[2].parentNode.id,
         fromColumnId = +value[3].parentNode.id;
 
-      if (toColumnId === fromColumnId) {
-        fromColumnId = -1;
+      if (toColumnId !== fromColumnId) {
+        this.changeTaskColumn(taskId, toColumnId);
+        return;
       }
 
-      let updateList = [];
+      this.everyOtherDrop = !this.everyOtherDrop;
+      if (this.everyOtherDrop) {
+        for (var i = 0, len = this.activeBoard.columns.length; i < len; ++i) {
+          let column = this.activeBoard.columns[i];
 
-      this.activeBoard.columns.forEach(column => {
-        if (column.id === toColumnId || column.id === fromColumnId) {
-          let position = 1,
-            taskToUpdate: Task;
-
-          column.tasks.forEach(task => {
-            task.column_id = column.id;
-            task.position = position;
-
-            position++;
-          });
-
-          updateList.push(column);
+          if (column.id === toColumnId) {
+            let pos = 0;
+            this.activeBoard.columns[i].tasks.forEach(task => {
+              task.position = pos;
+              pos++;
+            });
+            this.boardService.updateColumn(column).subscribe();
+            break;
+          }
         }
-      });
-
-      const update = async (column) => {
-        this.boardService.updateColumn(column).subscribe();
-      }
-
-      for (let i = 0, len = updateList.length; i < len; ++i) {
-        await update(updateList[i]);
       }
     });
   }
@@ -321,5 +307,18 @@ export class BoardDisplay implements OnInit, OnDestroy, AfterContentInit {
       this.noBoardsMessage = this.strings.boards_noBoardsMessageAdmin;
     }
   }
+
+  private changeTaskColumn(taskId: number, toColumnId: number) {
+    let column = this.activeBoard.columns
+      .find(col => col.id === toColumnId);
+    let task = column.tasks.find(ta => ta.id === taskId);
+
+    if (task) {
+      task.column_id = toColumnId;
+
+      this.boardService.updateTask(task).subscribe();
+    }
+  }
+
 }
 

src/app/board/task/task.component.ts

@@ -79,6 +79,10 @@ export class TaskDisplay implements OnInit {
   }
 
   private convertTaskDescription() {
+    if (!this.taskData || !this.taskData.description) {
+      return;
+    }
+
     let data = this.boardService.convertMarkdown(
       this.taskData.description, this.markedCallback, true
     );
@@ -241,6 +245,10 @@ export class TaskDisplay implements OnInit {
 
   // Needs anonymous function for proper `this` context.
   private markedCallback = (error: any, text: string) => {
+    if (!this.activeBoard.issue_trackers) {
+      return;
+    }
+
     this.activeBoard.issue_trackers.forEach(tracker => {
       let re = new RegExp(tracker.regex, 'ig');
       let replacements = new Array<any>();

src/app/shared/context-menu/context-menu-item.component.ts

@@ -21,7 +21,7 @@ export class ContextMenuItem {
   @Input()
   isCustomEvent: boolean;
 
-  constructor(private el: ElementRef) {
+  constructor(public el: ElementRef) {
     const elem = el.nativeElement;
 
     elem.onclick = (event) => {

test/app/board/board.component.spec.ts

@@ -100,7 +100,6 @@ describe('BoardDisplay', () => {
     component.ngAfterContentInit();
 
     expect((<any>component.dragula).opts.moves).toEqual(jasmine.any(Function));
-    expect(component.activeBoard.columns[0].tasks[0].position).toEqual(1);
 
     const test = (<any>component.dragula).opts.moves(null, null, {
       classList: { contains: () => false }
@@ -182,7 +181,7 @@ describe('BoardDisplay', () => {
 
     component.boards = <any>[{}];
     expect(component.noBoards()).toEqual(false);
-  })
+  });
 
   it('updates the active board from a service', () => {
     component.boardService.updateActiveBoard(null);
@@ -195,7 +194,7 @@ describe('BoardDisplay', () => {
     component.auth.updateUser(<any>{ security_level: 1 });
 
     expect(component.activeUser).toEqual(jasmine.any(Object));
-  })
+  });
 
 });
 

test/app/board/task/task.component.spec.ts

@@ -1,4 +1,4 @@
-import { TestBed, ComponentFixture } from '@angular/core/testing'
+import { TestBed, ComponentFixture } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ElementRef } from '@angular/core';
@@ -10,7 +10,6 @@ import {
   AuthService,
   StringsService,
   Constants,
-  ContextMenuService,
   ModalService,
   NotificationsService
 } from '../../../../src/app/shared/services';
@@ -21,6 +20,15 @@ describe('TaskDisplay', () => {
   let component: TaskDisplay,
     fixture: ComponentFixture<TaskDisplay>;
 
+  const eventMock = {
+    target: {
+      tagName: 'SELECT',
+      parentElement: {
+        parentElement: { click: () => {} }
+      }
+    }
+  };
+
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [
@@ -52,8 +60,6 @@ describe('TaskDisplay', () => {
   });
 
   it('implements OnInit', () => {
-    component.ngOnInit();
-
     component.taskData = <any>{ id: 1, description: '' };
     component.activeBoard = <any>{ id: 1, columns: [{ id: 1, name: 'test' }] };
     component.ngOnInit();
@@ -83,9 +89,8 @@ describe('TaskDisplay', () => {
     ];
     component.ngOnInit();
 
-    const actual = component.getTaskDescription();
-
-    expect(actual).toEqual('<h1 id="make-this-html">Make this HTML</h1>\n');
+    expect(component.taskData.html['changingThisBreaksApplicationSecurity'])
+      .toEqual('<h1 id="make-this-html">Make this HTML</h1>\n');
   });
 
   it('handles checklists in markdown', () => {
@@ -93,9 +98,9 @@ describe('TaskDisplay', () => {
     component.taskData.description = ' - [x] One\n - [ ] Two';
     component.ngOnInit();
 
-    const actual = component.getTaskDescription();
-    expect(actual).toEqual('<ul>\n<li><i class="icon icon-check"></i>' +
-      'One</li>\n<li><i class="icon icon-check-empty"></i>Two</li>\n</ul>\n');
+    expect(component.taskData.html['changingThisBreaksApplicationSecurity'])
+      .toEqual('<ul>\n<li><i class="icon icon-check"></i>One</li>\n' +
+        '<li><i class="icon icon-check-empty"></i>Two</li>\n</ul>\n');
   });
 
   it('adds attributes to links in markdown', () => {
@@ -103,8 +108,8 @@ describe('TaskDisplay', () => {
     component.taskData.description = '[link](google.com)';
     component.ngOnInit();
 
-    const actual = component.getTaskDescription();
-    expect(actual).toContain('target="tb_external" rel="noreferrer"');
+    expect(component.taskData.html['changingThisBreaksApplicationSecurity'])
+      .toContain('target="tb_external" rel="noreferrer"');
   });
 
   it('provides a custom style for percentage of task completed', () => {
@@ -112,7 +117,7 @@ describe('TaskDisplay', () => {
 
     const actual = component.getPercentStyle();
 
-    expect((<any>actual).changingThisBreaksApplicationSecurity)
+    expect((<any>actual)['changingThisBreaksApplicationSecurity'])
       .toContain('width: 50%;');
   });
 
@@ -150,7 +155,7 @@ describe('TaskDisplay', () => {
     document.body.appendChild(select);
 
     component.taskData = <any>{ id: 1 };
-    component.changeTaskColumn();
+    component.changeTaskColumn(eventMock);
 
     const secondOpt = document.createElement('option');
 
@@ -166,23 +171,10 @@ describe('TaskDisplay', () => {
       }) };
     };
 
-    component.changeTaskColumn();
+    component.changeTaskColumn(eventMock);
     expect(component.taskData.column_id).toEqual(1);
   });
 
-  it('updates context menu on boards changes', () => {
-    component.activeBoard = <any>{ name: 'test', columns: [] };
-    component.strings = <any>{
-      boards_copyTaskTo: 'Copy To',
-      boards_moveTaskTo: 'Move To'
-    };
-    component.taskData = <any>{ id: 1, description: '', due_date: '1/1/2018' };
-
-    component.boards = <any>[{ id: 1, name: 'one' }, { id: 2, name: 'test' }];
-
-    // expect(component.contextMenuItems.length).toEqual(10);
-  });
-
   it('calls a service to copy a task to another board', () => {
     const sel = document.createElement('select'),
       opt = document.createElement('option');
@@ -209,13 +201,13 @@ describe('TaskDisplay', () => {
       return { subscribe: fn =>  fn(<any>{ status: 'success' }) };
     };
 
-    component.copyTaskToBoard();
+    component.copyTaskToBoard(eventMock);
 
     (<any>component.boardService.addTask) = () => {
       return { subscribe: fn =>  fn(<any>{ status: 'asdf', alerts: [{}] }) };
     };
 
-    component.copyTaskToBoard();
+    component.copyTaskToBoard(eventMock);
 
     expect(emitted).toEqual(true);
   });
@@ -246,13 +238,13 @@ describe('TaskDisplay', () => {
       return { subscribe: fn =>  fn(<any>{ status: 'success' }) };
     };
 
-    component.moveTaskToBoard();
+    component.moveTaskToBoard(eventMock);
 
     (<any>component.boardService.updateTask) = () => {
       return { subscribe: fn =>  fn(<any>{ status: 'asdf', alerts: [{}] }) };
     };
 
-    component.moveTaskToBoard();
+    component.moveTaskToBoard(eventMock);
 
     expect(emitted).toEqual(true);
   });

test/app/settings/user-admin/user-admin.component.spec.ts

@@ -145,6 +145,7 @@ describe('UserAdmin', () => {
         called = true;
       } };
     };
+    (<any>component.modal).isOpen = () => true;
 
     component.modalProps = <any>{
       prefix: true,

test/app/shared/context-menu/context-menu-item.spec.ts

@@ -0,0 +1,76 @@
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { Component, ViewChild } from '@angular/core';
+
+import {
+  ContextMenuItem
+} from '../../../../src/app/shared/context-menu/context-menu-item.component';
+
+@Component({
+  selector: 'host-component',
+  template: `<tb-context-menu-item [isSeparator]="true"></tb-context-menu-item>`
+})
+class TestHostComponent {
+  @ViewChild(ContextMenuItem)
+  public menuItem: ContextMenuItem;
+}
+
+describe('ContextMenuItem', () => {
+  let hostComponent: TestHostComponent,
+    hostFixture: ComponentFixture<TestHostComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ContextMenuItem, TestHostComponent ]
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    hostFixture = TestBed.createComponent(TestHostComponent);
+    hostComponent = hostFixture.componentInstance;
+    hostFixture.detectChanges();
+  });
+
+  it('can be constructed', () => {
+    expect(hostComponent).toBeTruthy();
+  });
+
+  it('handles clicks on the element', () => {
+    let pdCalled = false,
+      spCalled = false;
+
+    const evt = {
+      preventDefault: () => {
+        pdCalled = true;
+      },
+      stopPropagation: () => {
+        spCalled = true;
+      }
+    };
+
+    hostComponent.menuItem.el.nativeElement.onclick(evt);
+
+    expect(pdCalled).toEqual(true);
+    expect(spCalled).toEqual(true);
+  });
+
+  it('handles context menu clicks on the element', () => {
+    let pdCalled = false,
+      spCalled = false;
+
+    const evt = {
+      preventDefault: () => {
+        pdCalled = true;
+      },
+      stopPropagation: () => {
+        spCalled = true;
+      }
+    };
+
+    hostComponent.menuItem.el.nativeElement.oncontextmenu(evt);
+
+    expect(pdCalled).toEqual(true);
+    expect(spCalled).toEqual(true);
+  });
+
+});
+