Merge pull request #7 from kreuzerk/feature/removeFindElement

fix(nesteddom): remove findHost of Elementhelper
nivekcode · May 6, 2019 · 1d05554 · 1d05554
2 parents 7e8cd51 + f94419e
commit 1d05554
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 119 deletions.
diff --git a/projects/ng-sortgrid/src/lib/ngsg-elements.helper.spec.ts b/projects/ng-sortgrid/src/lib/ngsg-elements.helper.spec.ts
@@ -18,42 +18,4 @@ describe('NgsgElementsHelper', () => {
     expect(index).toBe(2);
   });
 
-  it('must find the element that matches the selector', () => {
-    const selector = 'sample-selector';
-    const result = {
-      matches: (s) => s === selector,
-      name: 'parentElement'
-    };
-    const element = {
-      parentElement: {
-        matches: () => false,
-        parentElement: result
-      }
-    } as any;
-    const findHostSpy = spyOn(NgsgElementsHelper, 'findHost');
-    findHostSpy.and.callThrough();
-
-    NgsgElementsHelper.findHost(element, selector);
-    expect(findHostSpy).toHaveBeenCalledTimes(2);
-  });
-
-  it('must retunr the element that matches the selector', () => {
-    const selector = 'sample-selector';
-    const result = {
-      matches: (s) => s === selector,
-      name: 'parentElement'
-    };
-    const element = {
-      parentElement: {
-        matches: () => false,
-        parentElement: result
-      }
-    } as any;
-    const findHostSpy = spyOn(NgsgElementsHelper, 'findHost');
-    findHostSpy.and.callThrough();
-
-    const actual = NgsgElementsHelper.findHost(element, selector);
-    expect((actual as any)).toEqual(result);
-  });
-
 });
diff --git a/projects/ng-sortgrid/src/lib/ngsg-elements.helper.ts b/projects/ng-sortgrid/src/lib/ngsg-elements.helper.ts
@@ -4,12 +4,4 @@ export class NgsgElementsHelper {
     const allElements = element.parentNode.children;
     return Array.prototype.indexOf.call(allElements, element);
   }
-
-  public static findHost(element: Element, selector: string): Element {
-    const parentElement = element.parentElement;
-    if (parentElement.matches(selector)) {
-      return parentElement;
-    }
-    return this.findHost(parentElement, selector);
-  }
 }
diff --git a/projects/ng-sortgrid/src/lib/ngsg-item.directive.spec.ts b/projects/ng-sortgrid/src/lib/ngsg-item.directive.spec.ts
@@ -80,32 +80,16 @@ describe('NgsgItemDirective', () => {
   });
 
   it('should call sort with the host if the event occured on the host', () => {
-    const event = {target: {matches: () => true}};
     ngsgStore.hasSelectedItems.and.returnValue(true);
 
-    sut.dragEnter(event);
-    expect(ngsgSortService.sort).toHaveBeenCalledWith(event.target);
-  });
-
-  it('should call sort with the host, even if the event did not occure on it', () => {
-    const event = {target: {matches: () => false}};
-    const host = 'Some element' as any;
-    ngsgStore.hasSelectedItems.and.returnValue(true);
-    NgsgElementsHelper.findHost = () => host;
-
-    sut.dragEnter(event);
-    expect(ngsgSortService.sort).toHaveBeenCalledWith(host);
+    sut.dragEnter();
+    expect(ngsgSortService.sort).toHaveBeenCalledWith(elementRef.nativeElement);
   });
 
   it('should sort the items if the event occured on the host and on the correct group', () => {
     ngsgStore.hasSelectedItems.and.returnValue(true);
-    const event = {
-      target: {
-        matches: () => true
-      }
-    };
-    sut.dragEnter(event);
-    expect(ngsgSortService.sort).toHaveBeenCalledWith(event.target);
+    sut.dragEnter();
+    expect(ngsgSortService.sort).toHaveBeenCalledWith(elementRef.nativeElement);
   });
 
   it('must call event preventDefault', () => {
@@ -122,46 +106,28 @@ describe('NgsgItemDirective', () => {
 
   it('should not call endSort if the group does not contain selectedItems', () => {
     ngsgStore.hasSelectedItems.and.returnValue(false);
-    sut.drop({});
+    sut.drop();
     expect(ngsgSortService.endSort).not.toHaveBeenCalled();
   });
 
   it('should sort if the group contains selectedItems', () => {
     ngsgStore.hasSelectedItems.and.returnValue(true);
     ngsgStore.hasItems.and.returnValue(true);
-    sut.drop({target: {matches: () => true}});
+    sut.drop();
     expect(ngsgSortService.endSort).toHaveBeenCalled();
   });
 
   it('should call the reflection service with the host if the event occured on it', () => {
     const group = 'test-group';
-    const event = {target: {matches: () => true}};
     sut.ngSortGridGroup = group;
     ngsgStore.hasSelectedItems.and.returnValue(true);
 
-    sut.drop(event);
-    expect(ngsgReflectService.reflectChanges).toHaveBeenCalledWith(group, event.target);
-  });
-
-  it('should call the reflection service with the host even if the event did not occured on it', () => {
-    const group = 'test-group';
-    const event = {target: {matches: () => false}};
-    const host = 'Some element' as any;
-    NgsgElementsHelper.findHost = () => host;
-    sut.ngSortGridGroup = group;
-    ngsgStore.hasSelectedItems.and.returnValue(true);
-
-    sut.drop(event);
-    expect(ngsgReflectService.reflectChanges).toHaveBeenCalledWith(group, host);
+    sut.drop();
+    expect(ngsgReflectService.reflectChanges).toHaveBeenCalledWith(group, elementRef.nativeElement);
   });
 
   it('should get the reflected changes from the reflection service and emit them', done => {
     const group = 'test-group';
-    const event = {
-      target: {
-        matches: () => true
-      }
-    };
     const reflectedChanges = ['item two', 'item one', 'item three'];
 
     ngsgStore.hasSelectedItems.and.returnValue(true);
@@ -173,40 +139,26 @@ describe('NgsgItemDirective', () => {
       expect(reflectedChanges).toEqual(changes);
       done();
     });
-    sut.drop(event);
-    expect(ngsgReflectService.reflectChanges).toHaveBeenCalledWith(group, event.target);
+    sut.drop();
+    expect(ngsgReflectService.reflectChanges).toHaveBeenCalledWith(group, elementRef.nativeElement);
   });
 
   it('should reset the selected items on drop', () => {
-    const event = {target: {matches: () => true}};
-    sut.drop(event);
+    sut.drop();
     expect(ngsgStore.resetSelectedItems).toHaveBeenCalled();
   });
 
   it('should stream the dropped event on the eventservice', done => {
-    const event = {target: {matches: () => true}};
     ngsgEventService.dropped$.subscribe(() => done());
-    sut.drop(event);
+    sut.drop();
   });
 
   it('should call the selctionservice with the host if the event occured on the host', () => {
     const group = 'test-group';
-    const event = {target: {matches: () => true}};
-    sut.ngSortGridGroup = group;
-
-    sut.clicked(event);
-    expect(ngsgSelectionService.updateSelectedDragItem).toHaveBeenCalledWith(group, event.target, true);
-  });
-
-  it('should call the selctionservice with the host, even if the event did not occure on it', () => {
-    const group = 'test-group';
-    const event = {target: {matches: () => false}};
-    const host = 'Some element' as any;
-    NgsgElementsHelper.findHost = () => host;
     sut.ngSortGridGroup = group;
 
-    sut.clicked(event);
-    expect(ngsgSelectionService.updateSelectedDragItem).toHaveBeenCalledWith(group, host, true);
+    sut.clicked();
+    expect(ngsgSelectionService.updateSelectedDragItem).toHaveBeenCalledWith(group, elementRef.nativeElement, true);
   });
 
   it(`should init the state with empty items if group has yet not been
@@ -260,7 +212,7 @@ describe('NgsgItemDirective', () => {
     const consoleWarnSpy = spyOn(console, 'warn');
     ngsgStore.hasItems.and.returnValue(false);
 
-    sut.drop(event);
+    sut.drop();
     expect(consoleWarnSpy).toHaveBeenCalledWith(expectedWarniningMessage);
   });
 });
diff --git a/projects/ng-sortgrid/src/lib/ngsg-item.directive.ts b/projects/ng-sortgrid/src/lib/ngsg-item.directive.ts
@@ -78,13 +78,12 @@ export class NgsgItemDirective implements OnInit, OnChanges, AfterViewInit, OnDe
     this.sortService.initSort(this.ngSortGridGroup);
   }
 
-  @HostListener('dragenter', ['$event'])
-  dragEnter(event): void {
+  @HostListener('dragenter')
+  dragEnter(): void {
     if (!this.ngsgStore.hasSelectedItems(this.ngSortGridGroup)) {
       return;
     }
-    const element = !this.occuredOnHost(event) ? NgsgElementsHelper.findHost(event.target, selector) : event.target;
-    this.sortService.sort(element);
+    this.sortService.sort(this.el.nativeElement);
   }
 
   @HostListener('dragover', ['$event'])
@@ -97,7 +96,7 @@ export class NgsgItemDirective implements OnInit, OnChanges, AfterViewInit, OnDe
   }
 
   @HostListener('drop', ['$event'])
-  drop(event): void {
+  drop(): void {
     if (!this.ngsgStore.hasSelectedItems(this.ngSortGridGroup)) {
       return;
     }
@@ -109,18 +108,16 @@ export class NgsgItemDirective implements OnInit, OnChanges, AfterViewInit, OnDe
     }
 
     this.sortService.endSort();
-    const element = !this.occuredOnHost(event) ? NgsgElementsHelper.findHost(event.target, selector) : event.target;
-    const reflectedChanges = this.reflectService.reflectChanges(this.ngSortGridGroup, element);
+    const reflectedChanges = this.reflectService.reflectChanges(this.ngSortGridGroup, this.el.nativeElement);
     this.sorted.next(reflectedChanges);
     this.ngsgStore.resetSelectedItems(this.ngSortGridGroup);
     this.ngsgEventService.dropped$.next();
   }
 
   @HostListener('click', ['$event'])
-  clicked(event): void {
-    const element = !this.occuredOnHost(event) ? NgsgElementsHelper.findHost(event.target, selector) : event.target;
+  clicked(): void {
     this.selected = !this.selected;
-    this.selectionService.updateSelectedDragItem(this.ngSortGridGroup, element, this.selected);
+    this.selectionService.updateSelectedDragItem(this.ngSortGridGroup, this.el.nativeElement, this.selected);
   }
 
   private occuredOnHost(event): boolean {