diff --git a/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/org-unit/org-unit-sidebar-search-list-element.component.ts b/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/org-unit/org-unit-sidebar-search-list-element.component.ts index 642c13f562..17e9790593 100644 --- a/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/org-unit/org-unit-sidebar-search-list-element.component.ts +++ b/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/org-unit/org-unit-sidebar-search-list-element.component.ts @@ -5,7 +5,6 @@ import { ItemSearchResult } from '../../../../../shared/object-collection/shared import { Component } from '@angular/core'; import { SidebarSearchListElementComponent } from '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component'; import { Item } from '../../../../../core/shared/item.model'; -import { isNotEmpty } from '../../../../../shared/empty.util'; @listableObjectComponent('OrgUnitSearchResult', ViewMode.ListElement, Context.SideBarSearchModal) @listableObjectComponent('OrgUnitSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent) diff --git a/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component.ts b/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component.ts index 0d109c55f0..6fbb9d26fc 100644 --- a/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component.ts +++ b/src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component.ts @@ -5,7 +5,6 @@ import { ItemSearchResult } from '../../../../../shared/object-collection/shared import { Component } from '@angular/core'; import { SidebarSearchListElementComponent } from '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component'; import { Item } from '../../../../../core/shared/item.model'; -import { isNotEmpty } from '../../../../../shared/empty.util'; @listableObjectComponent('ProjectSearchResult', ViewMode.ListElement, Context.SideBarSearchModal) @listableObjectComponent('ProjectSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent) diff --git a/src/app/shared/hover-class.directive.spec.ts b/src/app/shared/hover-class.directive.spec.ts new file mode 100644 index 0000000000..9c593f27c8 --- /dev/null +++ b/src/app/shared/hover-class.directive.spec.ts @@ -0,0 +1,35 @@ +import { Component, DebugElement } from '@angular/core'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { HoverClassDirective } from './hover-class.directive'; +import { By } from '@angular/platform-browser'; + +@Component({ + template: `
` +}) +class TestComponent { } + +describe('HoverClassDirective', () => { + let component: TestComponent; + let fixture: ComponentFixture; + let el: DebugElement; + + beforeEach(() => { + fixture = TestBed.configureTestingModule({ + declarations: [TestComponent, HoverClassDirective] + }).createComponent(TestComponent); + + fixture.detectChanges(); + component = fixture.componentInstance; + el = fixture.debugElement.query(By.css('div')); + }); + + it('should add the class on mouseenter and remove on mouseleave', () => { + el.triggerEventHandler('mouseenter', null); + fixture.detectChanges(); + expect(el.nativeElement.classList).toContain('ds-hover'); + + el.triggerEventHandler('mouseleave', null); + fixture.detectChanges(); + expect(el.nativeElement.classList).not.toContain('ds-hover'); + }); +}); diff --git a/src/app/shared/hover-class.directive.ts b/src/app/shared/hover-class.directive.ts index e5c4ad200e..551e81a463 100644 --- a/src/app/shared/hover-class.directive.ts +++ b/src/app/shared/hover-class.directive.ts @@ -3,15 +3,27 @@ import { Directive, ElementRef, HostListener, Input } from '@angular/core'; @Directive({ selector: '[dsHoverClass]' }) +/** + * A directive adding a class to an element when hovered over + */ export class HoverClassDirective { -​ - constructor(public elementRef: ElementRef) { } + /** + * The name of the class to add on hover + */ @Input('dsHoverClass') hoverClass: string; ​ + constructor(public elementRef: ElementRef) { } +​ + /** + * On mouse enter, add the class to the element's class list + */ @HostListener('mouseenter') onMouseEnter() { this.elementRef.nativeElement.classList.add(this.hoverClass); } ​ + /** + * On mouse leave, remove the class from the element's class list + */ @HostListener('mouseleave') onMouseLeave() { this.elementRef.nativeElement.classList.remove(this.hoverClass); }