MOBILE-3744 icon: Detect and notify empty aria labels

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.');
     }
 
     /**

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.
      */