feature(wysiwyg): adding tests

Author: k-belov

apps/codelab/src/app/admin/content/presentation-editor/side-panel/side-panel.component.ts

@@ -66,7 +66,7 @@ export class SidePanelComponent implements OnInit, OnChanges {
     if (changes.slides) {
       this.slideIds = slideIdsMapper(changes.slides.currentValue);
 
-      this.selectionModel.setValues(this.slideIds);
+      this.selectionModel.setItems(this.slideIds);
     }
   }
 

apps/codelab/src/app/multiselect/multiselect-list.directive.ts

@@ -40,7 +40,7 @@ export class MultiselectListDirective<T> {
     }
 
     if (event.key === 'a' && (event.ctrlKey || event.metaKey)) {
-      this.msModel.selectAllItems();
+      this.msModel.toggleAll();
 
       event.preventDefault();
     }

apps/codelab/src/app/multiselect/multiselect-model.spec.ts

@@ -0,0 +1,155 @@
+import { MultiselectModel } from './multiselect-model';
+
+describe('MultiselectModel', () => {
+  let model: MultiselectModel<string>;
+
+  const item1 = 'a';
+  const item2 = 'b';
+
+  const items = [item1, item2, 'c', 'd', 'e'];
+
+  beforeEach(() => {
+    model = new MultiselectModel();
+
+    model.setItems(items);
+  });
+
+  describe('single selections', () => {
+    it('has empty selection initially', () => {
+      expect(model.selected).toEqual([]);
+    });
+
+    it('allows to select single element', () => {
+      model.toggleSingle(item1);
+
+      expect(model.selected).toEqual([item1]);
+    });
+
+    it('allows to deselect single element', () => {
+      model.toggleSingle(item1);
+      model.toggleSingle(item1);
+
+      expect(model.selected).toEqual([]);
+    });
+
+    it('allows to reselect single element', () => {
+      model.toggleSingle(item1);
+      model.toggleSingle(item2);
+      model.toggleSingle('c');
+      model.toggleSingle(item2);
+
+      expect(model.selected).toEqual([item1, 'c']);
+    });
+
+    it('allows to force select single element', () => {
+      model.toggleSingle(item1);
+      model.selectSingle(item2);
+
+      expect(model.selected).toEqual([item2]);
+    });
+  });
+
+  describe('selecting with shift', () => {
+    it('allows to select multiple elements', () => {
+      model.toggleSingle(item1);
+      model.toggleContinuous('c');
+
+      expect(model.selected).toEqual([item1, item2, 'c']);
+    });
+
+    it('allows to deselect multiple elements', () => {
+      model.toggleSingle(item1);
+      model.toggleSingle(item2);
+      model.toggleSingle('c');
+      model.toggleContinuous(item1);
+
+      expect(model.selected).toEqual([]);
+    });
+
+    it('allows multiple selections and reselections', () => {
+      model.toggleSingle(item1);
+      model.toggleContinuous('e');
+
+      expect(model.selected).toEqual([item1, item2, 'c', 'd', 'e']);
+
+      model.toggleContinuous(item2);
+
+      expect(model.selected).toEqual([item1]);
+
+      model.toggleContinuous('d');
+
+      expect(model.selected).toEqual([item1, item2, 'c', 'd']);
+    });
+
+    it('allows for selections in different directions', () => {
+      model.toggleSingle('c');
+      model.toggleContinuous('e');
+
+      expect(model.selected).toEqual(['c', 'd', 'e']);
+
+      model.toggleContinuous(item1);
+
+      expect(model.selected).toEqual(['c', 'd', 'e', 'a', 'b']);
+    });
+
+    it('when handling gap selections, sets the value to the latest checked item', () => {
+      model.toggleSingle(item1);
+      model.toggleSingle('c');
+      model.toggleSingle('e');
+      model.toggleContinuous('c');
+
+      expect(model.selected).toEqual([item1]);
+    });
+  });
+
+  describe('toggleAll', () => {
+    it('when nothing selected, selects everything', () => {
+      model.toggleAll();
+
+      expect(model.selected).toEqual([item1, item2, 'c', 'd', 'e']);
+    });
+
+    it('when some thing selected, selects everything', () => {
+      model.toggleSingle(item1);
+      model.toggleAll();
+
+      expect(model.selected).toEqual([item1, item2, 'c', 'd', 'e']);
+    });
+
+    it('when everything selected, deselects everything', () => {
+      model.toggleAll();
+      model.toggleAll();
+
+      expect(model.selected).toEqual([]);
+    });
+  });
+
+  describe('clearAll', () => {
+    it('selection is empty after clear', () => {
+      model.clear();
+
+      expect(model.selected).toEqual([]);
+      expect(model.isEmpty()).toEqual(true);
+    });
+
+    it('drops the selection when some thing selected', () => {
+      model.toggleSingle(item1);
+      model.clear();
+
+      expect(model.selected).toEqual([]);
+    });
+  });
+
+  describe('emitChangeEvent', () => {
+    it('should emit change event after selection', done => {
+      const subscription = model.changed.subscribe(changes => {
+        expect(changes).toEqual([item1]);
+        done();
+      });
+
+      model.toggleSingle(item1);
+
+      subscription.unsubscribe();
+    });
+  });
+});

apps/codelab/src/app/multiselect/multiselect-model.ts

@@ -5,26 +5,26 @@ export class MultiselectModel<T> {
 
   private stack: T[] = [];
 
-  private values: T[] = [];
-
   changed = new Subject<T[]>();
 
+  constructor(private items: T[] = []) {}
+
   get selected(): T[] {
     return Array.from(this.selection.values());
   }
 
-  setValues(values: T[]): void {
-    this.values = values;
+  setItems(items: T[]): void {
+    this.items = items;
   }
 
   findBetween(item1: T, item2: T): T[] {
-    const index1 = this.values.indexOf(item1);
-    const index2 = this.values.indexOf(item2);
+    const index1 = this.items.indexOf(item1);
+    const index2 = this.items.indexOf(item2);
 
     const numberOfItems = Math.abs(index1 - index2) + 1;
     const firstIndex = index1 < index2 ? index1 : index2;
 
-    return this.values.slice(firstIndex, firstIndex + numberOfItems);
+    return this.items.slice(firstIndex, firstIndex + numberOfItems);
   }
 
   toggleAllItems(items: T[], shouldSelect: boolean): void {
@@ -57,8 +57,12 @@ export class MultiselectModel<T> {
     this.stack.push(item);
   }
 
-  selectAllItems(): void {
-    this.toggleAllItems(this.values, true);
+  toggleAll(): void {
+    if (this.selected.length === this.items.length) {
+      this.clear();
+    } else {
+      this.toggleAllItems(this.items, true);
+    }
   }
 
   selectSingle(item: T): void {