117544: add spec for directive

Author: Jens Vannerum

src/app/shared/disabled-directive.spec.ts

@@ -0,0 +1,89 @@
+import { Component, DebugElement } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DisabledDirective } from './disabled-directive';
+
+@Component({
+    template: `
+    <button [dsDisabled]="isDisabled">Test Button</button>
+  `
+})
+class TestComponent {
+    isDisabled = false;
+}
+
+describe('DisabledDirective', () => {
+    let component: TestComponent;
+    let fixture: ComponentFixture<TestComponent>;
+    let button: DebugElement;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            declarations: [TestComponent, DisabledDirective]
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        component = fixture.componentInstance;
+        button = fixture.debugElement.query(By.css('button'));
+        fixture.detectChanges();
+    });
+
+    it('should bind aria-disabled to false initially', () => {
+        expect(button.nativeElement.getAttribute('aria-disabled')).toBe('false');
+        expect(button.nativeElement.classList.contains('disabled')).toBeFalse();
+    });
+
+    it('should bind aria-disabled to true and add disabled class when isDisabled is true', () => {
+        component.isDisabled = true;
+        fixture.detectChanges();
+
+        expect(button.nativeElement.getAttribute('aria-disabled')).toBe('true');
+        expect(button.nativeElement.classList.contains('disabled')).toBeTrue();
+    });
+
+    it('should prevent click events when disabled', () => {
+        component.isDisabled = true;
+        fixture.detectChanges();
+
+        let clickHandled = false;
+        button.nativeElement.addEventListener('click', () => clickHandled = true);
+
+        button.nativeElement.click();
+
+        expect(clickHandled).toBeFalse();
+    });
+
+    it('should prevent Enter or Space keydown events when disabled', () => {
+        component.isDisabled = true;
+        fixture.detectChanges();
+
+        let keydownHandled = false;
+        button.nativeElement.addEventListener('keydown', () => keydownHandled = true);
+
+        const enterEvent = new KeyboardEvent('keydown', { key: 'Enter' });
+        const spaceEvent = new KeyboardEvent('keydown', { key: 'Space' });
+
+        button.nativeElement.dispatchEvent(enterEvent);
+        button.nativeElement.dispatchEvent(spaceEvent);
+
+        expect(keydownHandled).toBeFalse();
+    });
+
+    it('should allow click and keydown events when not disabled', () => {
+        let clickHandled = false;
+        let keydownHandled = false;
+
+        button.nativeElement.addEventListener('click', () => clickHandled = true);
+        button.nativeElement.addEventListener('keydown', () => keydownHandled = true);
+
+        button.nativeElement.click();
+
+        const enterEvent = new KeyboardEvent('keydown', { key: 'Enter' });
+        const spaceEvent = new KeyboardEvent('keydown', { key: 'Space' });
+
+        button.nativeElement.dispatchEvent(enterEvent);
+        button.nativeElement.dispatchEvent(spaceEvent);
+
+        expect(clickHandled).toBeTrue();
+        expect(keydownHandled).toBeTrue();
+    });
+});