diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts index a6cf5594aee..dc71c40f863 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts @@ -161,9 +161,19 @@ describe('IgxAutocomplete', () => { expect(dropDownAny.scrollContainer.getBoundingClientRect().width) .toEqual(group.element.nativeElement.getBoundingClientRect().width); })); - it('Aria', fakeAsync(() => {})); + it('Aria and attributes', fakeAsync(() => { + expect(input.nativeElement.attributes['autocomplete'].value).toMatch('off'); + expect(input.nativeElement.attributes['role'].value).toMatch('combobox'); + expect(input.nativeElement.attributes['aria-haspopup'].value).toMatch('listbox'); + expect(input.nativeElement.attributes['aria-owns'].value).toMatch(dropDown.id); + expect(input.nativeElement.attributes['aria-expanded'].value).toMatch('false'); + UIInteractions.sendInput(input, 's', fixture); + fixture.detectChanges(); + tick(); + expect(input.nativeElement.attributes['aria-expanded'].value).toMatch('true'); + this.dropDown.close(); + })); it('ReactiveForm', fakeAsync(() => {})); - it('On HTML input', fakeAsync(() => {})); it('On textarea', fakeAsync(() => {})); }); diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts index eb5302530f4..cce066cf6d5 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts @@ -146,7 +146,7 @@ export class IgxAutocompleteDirective extends IgxDropDownItemNavigationDirective */ @HostBinding('attr.aria-owns') public get ariaOwns() { - return this.id; + return this.dropDown.id; } @HostListener('input', ['$event'])