Skip to content

Commit 8c3fb53

Browse files
Ivan KitanovIvan Kitanov
authored andcommitted
fix(combo): Sync aria required with required state
1 parent 0825a92 commit 8c3fb53

File tree

2 files changed

+6
-0
lines changed

2 files changed

+6
-0
lines changed

projects/igniteui-angular/src/lib/combo/combo.common.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1322,6 +1322,7 @@ export abstract class IgxComboBaseDirective implements IgxComboBase, AfterViewCh
13221322
protected manageRequiredAsterisk(): void {
13231323
if (this.ngControl) {
13241324
this.inputGroup.isRequired = this.required;
1325+
this.comboInput.nativeElement.setAttribute('aria-required', this.required.toString());
13251326
}
13261327
}
13271328

projects/igniteui-angular/src/lib/combo/combo.component.spec.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3390,8 +3390,11 @@ describe('igxCombo', () => {
33903390
it('should add/remove asterisk when setting validators dynamically', () => {
33913391
let inputGroupIsRequiredClass = fixture.debugElement.query(By.css('.' + CSS_CLASS_INPUTGROUP_REQUIRED));
33923392
let asterisk = window.getComputedStyle(fixture.debugElement.query(By.css('.' + CSS_CLASS_INPUTGROUP_LABEL)).nativeElement, ':after').content;
3393+
input = fixture.debugElement.query(By.css(`.${CSS_CLASS_COMBO_INPUTGROUP}`));
33933394
expect(asterisk).toBe('"*"');
33943395
expect(inputGroupIsRequiredClass).toBeDefined();
3396+
console.log(input.nativeElement);
3397+
expect(input.nativeElement.getAttribute('aria-required')).toMatch('true');
33953398

33963399
fixture.componentInstance.reactiveForm.controls.townCombo.clearValidators();
33973400
fixture.componentInstance.reactiveForm.controls.townCombo.updateValueAndValidity();
@@ -3400,6 +3403,7 @@ describe('igxCombo', () => {
34003403
asterisk = window.getComputedStyle(fixture.debugElement.query(By.css('.' + CSS_CLASS_INPUTGROUP_LABEL)).nativeElement, ':after').content;
34013404
expect(asterisk).toBe('none');
34023405
expect(inputGroupIsRequiredClass).toBeNull();
3406+
expect(input.nativeElement.getAttribute('aria-required')).toMatch('false');
34033407

34043408
fixture.componentInstance.reactiveForm.controls.townCombo.setValidators(Validators.required);
34053409
fixture.componentInstance.reactiveForm.controls.townCombo.updateValueAndValidity();
@@ -3408,6 +3412,7 @@ describe('igxCombo', () => {
34083412
asterisk = window.getComputedStyle(fixture.debugElement.query(By.css('.' + CSS_CLASS_INPUTGROUP_LABEL)).nativeElement, ':after').content;
34093413
expect(asterisk).toBe('"*"');
34103414
expect(inputGroupIsRequiredClass).toBeDefined();
3415+
expect(input.nativeElement.getAttribute('aria-required')).toMatch('true');
34113416
});
34123417

34133418
it('Should update validity state when programmatically setting errors on reactive form controls', fakeAsync(() => {

0 commit comments

Comments
 (0)