diff --git a/src/core/components/icon/icon.ts b/src/core/components/icon/icon.ts index 3774263f3..36dbb05b1 100644 --- a/src/core/components/icon/icon.ts +++ b/src/core/components/icon/icon.ts @@ -13,6 +13,7 @@ // limitations under the License. import { Component, Input, OnChanges, ElementRef, SimpleChange } from '@angular/core'; +import { CoreLogger } from '@singletons/logger'; /** * Core Icon is a component that enables the posibility to add fontawesome icon to the html. It @@ -47,6 +48,8 @@ export class CoreIconComponent implements OnChanges { el: ElementRef, ) { this.element = el.nativeElement; + + CoreLogger.getInstance('CoreIconComponent').error('CoreIconComponent is deprecated. Please use ion-icon instead.'); } /** diff --git a/src/core/directives/fa-icon.ts b/src/core/directives/fa-icon.ts index b85f743a8..0cd0a1e63 100644 --- a/src/core/directives/fa-icon.ts +++ b/src/core/directives/fa-icon.ts @@ -12,7 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Directive, ElementRef, Input, OnChanges, SimpleChange } from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, Input, OnChanges, SimpleChange } from '@angular/core'; import { CoreLogger } from '@singletons/logger'; import { Http } from '@singletons'; import { CoreConstants } from '@/core/constants'; @@ -28,7 +28,7 @@ import { CoreConstants } from '@/core/constants'; @Directive({ selector: 'ion-icon[name]', }) -export class CoreFaIconDirective implements OnChanges { +export class CoreFaIconDirective implements AfterViewInit, OnChanges { @Input() name = ''; @@ -82,11 +82,25 @@ export class CoreFaIconDirective implements OnChanges { } } else { this.element.removeAttribute('src'); + this.logger.warn(`Ionic icon ${this.name} detected`); } return; } + /** + * @inheritdoc + */ + ngAfterViewInit(): void { + if (!this.element.getAttribute('aria-label') && + !this.element.getAttribute('aria-labelledby') && + this.element.getAttribute('aria-hidden') != 'true') { + this.logger.warn('Aria label not set on icon ' + this.name, this.element); + + this.element.setAttribute('aria-hidden', 'true'); + } + } + /** * Detect changes on input properties. */