chore: added units for KbqHovered directive

packages/components/core/common-behaviors/hovered.spec.ts

@@ -0,0 +1,66 @@
+import { ChangeDetectionStrategy, Component, Provider, Type } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { KbqHovered } from './hovered';
+
+const createComponent = <T>(component: Type<T>, providers: Provider[] = []): ComponentFixture<T> => {
+    TestBed.configureTestingModule({
+        imports: [component],
+        providers
+    });
+    const fixture = TestBed.createComponent<T>(component);
+
+    fixture.autoDetectChanges();
+
+    return fixture;
+};
+
+@Component({
+    standalone: true,
+    selector: 'test-by-attr-directive',
+    template: '<div kbqHovered>test</div>',
+    imports: [KbqHovered],
+    changeDetection: ChangeDetectionStrategy.OnPush
+})
+class TestByAttrDirective {}
+
+@Component({
+    standalone: true,
+    selector: 'test-by-host-directive',
+    hostDirectives: [KbqHovered],
+    template: '<div>test</div>',
+    changeDetection: ChangeDetectionStrategy.OnPush
+})
+class TestByHostDirective {}
+
+describe(KbqHovered.name, () => {
+    it('should toggle selector by attribute directive', () => {
+        const { debugElement } = createComponent(TestByAttrDirective);
+        const element = debugElement.query(By.css('div')).nativeElement as HTMLElement;
+
+        expect(element.classList).not.toContain('kbq-hovered');
+
+        element.dispatchEvent(new MouseEvent('mouseenter'));
+
+        expect(element.classList).toContain('kbq-hovered');
+
+        element.dispatchEvent(new MouseEvent('mouseleave'));
+
+        expect(element.classList).not.toContain('kbq-hovered');
+    });
+
+    it('should toggle selector by host directive', () => {
+        const { debugElement } = createComponent(TestByHostDirective);
+        const element = debugElement.nativeElement as HTMLElement;
+
+        expect(element.classList).not.toContain('kbq-hovered');
+
+        element.dispatchEvent(new MouseEvent('mouseenter'));
+
+        expect(element.classList).toContain('kbq-hovered');
+
+        element.dispatchEvent(new MouseEvent('mouseleave'));
+
+        expect(element.classList).not.toContain('kbq-hovered');
+    });
+});

packages/components/core/common-behaviors/hovered.ts

@@ -4,7 +4,7 @@ import { fromEvent, map, merge } from 'rxjs';
 import { kbqInjectNativeElement } from '../utils';
 
 /**
- * Directive that adds a `kbq-hover` class to an element, based on its hover state.
+ * Directive that adds a `kbq-hovered` class to an element, based on its hover state.
  */
 @Directive({
     standalone: true,