feat(*): aria-required date-picker and simple combo

Author: ChronosSF

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

@@ -1300,6 +1300,7 @@ export abstract class IgxComboBaseDirective implements IgxComboBase, AfterViewCh
         this.manageRequiredAsterisk();
     };
 
+    /** @hidden @internal */
     protected externalValidate(): IgxInputState {
         return this._valid;
     }

projects/igniteui-angular/src/lib/date-picker/date-picker.component.html

@@ -15,6 +15,7 @@
     }
 
     <input class="igx-date-picker__input-date" [displayValuePipe]="formatter ? displayValue : null" igxInput
+        [required]="required" [attr.aria-required]="required"
         [igxDateTimeEditor]="inputFormat" [displayFormat]="displayFormat"
         [minValue]="minValue" [maxValue]="maxValue" [spinDelta]="spinDelta" [spinLoop]="spinLoop"
         [disabled]="disabled" [placeholder]="placeholder" [readonly]="!isDropdown || readOnly"

projects/igniteui-angular/src/lib/date-picker/date-picker.component.spec.ts

@@ -231,18 +231,22 @@ describe('IgxDatePicker', () => {
 
                 expect(datePicker).toBeDefined();
                 expect(inputGroup.isRequired).toBeTruthy();
+                expect((datePicker as any).inputDirective.nativeElement.getAttribute('aria-required')).toEqual('true');
             });
 
             it('should update inputGroup isRequired correctly', () => {
                 const inputGroup = (datePicker as any).inputGroup;
+                const inputEl = (datePicker as any).inputDirective.nativeElement;
 
                 expect(datePicker).toBeDefined();
                 expect(inputGroup.isRequired).toBeTruthy();
+                expect(inputEl.getAttribute('aria-required')).toEqual('true');
 
                 (fixture.componentInstance as IgxDatePickerNgModelComponent).isRequired = false;
                 fixture.detectChanges();
 
                 expect(inputGroup.isRequired).toBeFalsy();
+                expect(inputEl.getAttribute('aria-required')).toEqual('false');
             });
 
             it('should set validity to initial when the form is reset', fakeAsync(() => {

projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.html

@@ -13,6 +13,7 @@
     </ng-container>
 
     <input #comboInput igxInput [value]="displayValue" role="combobox"
+        [required]="required" [attr.aria-required]="required" [externalValidate]="externalValidate"
         aria-haspopup="listbox" aria-autocomplete="list" aria-readonly="false"
         [attr.aria-expanded]="!this.dropdown.collapsed" [attr.aria-controls]="this.dropdown.listId"
         [attr.aria-labelledby]="this.ariaLabelledBy || this.label?.id || this.placeholder"

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

@@ -2277,6 +2277,7 @@ describe('IgxSimpleCombo', () => {
 
                 expect(combo.valid).toEqual(IgxInputState.INITIAL);
                 expect(combo.comboInput.valid).toEqual(IgxInputState.INITIAL);
+                expect(combo.comboInput.nativeElement.attributes['aria-required']).toBeDefined();
 
                 // empty string
                 combo.open();