From a7bd0d2f0c022705e712b03c8fe0a993f0ae4ebd Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Fri, 15 Mar 2019 10:00:05 +0100
Subject: [PATCH 1/2] MOBILE-2819 tabs: Fix wrong aria-hidden in core-tabs

---
 src/components/tabs/core-tabs.html |  4 ++--
 src/components/tabs/tab.ts         | 24 +++++++++++++++++-------
 src/components/tabs/tabs.ts        | 19 +++++++++++++++++++
 3 files changed, 38 insertions(+), 9 deletions(-)

diff --git a/src/components/tabs/core-tabs.html b/src/components/tabs/core-tabs.html
index 977b8899e..ec8a460a4 100644
--- a/src/components/tabs/core-tabs.html
+++ b/src/components/tabs/core-tabs.html
@@ -1,7 +1,7 @@
 <core-loading [hideUntil]="hideUntil" class="core-loading-center">
     <div class="core-tabs-bar" #topTabs [hidden]="!tabs || numTabsShown < 2" id="core-tabs-bar">
         <ion-row>
-            <ion-col class="col-with-arrow" (click)="slidePrev()" no-padding col-1 aria-hidden="true">
+            <ion-col class="col-with-arrow" (click)="slidePrev()" no-padding col-1>
                 <ion-icon *ngIf="showPrevButton" name="arrow-back" md="ios-arrow-back"></ion-icon>
             </ion-col>
             <ion-col no-padding col-10>
@@ -15,7 +15,7 @@
                     </ng-container>
                 </ion-slides>
             </ion-col>
-            <ion-col class="col-with-arrow" (click)="slideNext()" no-padding col-1 aria-hidden="true">
+            <ion-col class="col-with-arrow" (click)="slideNext()" no-padding col-1>
                 <ion-icon *ngIf="showNextButton" name="arrow-forward" md="ios-arrow-forward"></ion-icon>
             </ion-col>
         </ion-row>
diff --git a/src/components/tabs/tab.ts b/src/components/tabs/tab.ts
index e65068f8f..e47563acc 100644
--- a/src/components/tabs/tab.ts
+++ b/src/components/tabs/tab.ts
@@ -55,9 +55,7 @@ export class CoreTabComponent implements OnInit, OnDestroy {
 
             if (this.initialized && hasChanged) {
                 this.tabs.tabVisibilityChanged();
-
-                this.tabElement = document.getElementById(this.id + '-tab');
-                this.tabElement && this.tabElement.setAttribute('aria-hidden', !this._show);
+                this.updateAriaHidden();
             }
         }
     }
@@ -96,8 +94,7 @@ export class CoreTabComponent implements OnInit, OnDestroy {
         this.initialized = true;
 
         setTimeout(() => {
-            this.tabElement = document.getElementById(this.id + '-tab');
-            this.tabElement && this.tabElement.setAttribute('aria-hidden', !this._show);
+            this.updateAriaHidden();
         }, 1000);
     }
 
@@ -116,8 +113,8 @@ export class CoreTabComponent implements OnInit, OnDestroy {
 
         this.tabElement = this.tabElement || document.getElementById(this.id + '-tab');
 
+        this.updateAriaHidden();
         this.tabElement && this.tabElement.setAttribute('aria-selected', true);
-        this.tabElement && this.tabElement.setAttribute('aria-hidden', !this._show);
 
         this.loaded = true;
         this.ionSelect.emit(this);
@@ -137,8 +134,8 @@ export class CoreTabComponent implements OnInit, OnDestroy {
      * Unselect tab.
      */
     unselectTab(): void {
+        this.updateAriaHidden();
         this.tabElement && this.tabElement.setAttribute('aria-selected', false);
-        this.tabElement && this.tabElement.setAttribute('aria-hidden', true);
 
         this.element.classList.remove('selected');
         this.showHideNavBarButtons(false);
@@ -176,4 +173,17 @@ export class CoreTabComponent implements OnInit, OnDestroy {
             instances[i].forceHide(!show);
         }
     }
+
+    /**
+     * Update aria hidden attribute.
+     */
+    updateAriaHidden(): void {
+        if (!this.tabElement) {
+            this.tabElement = document.getElementById(this.id + '-tab');
+        }
+
+        if (this.tabElement) {
+            this.tabElement && this.tabElement.setAttribute('aria-hidden', !this._show);
+        }
+    }
 }
diff --git a/src/components/tabs/tabs.ts b/src/components/tabs/tabs.ts
index 042f727fd..d15eec81a 100644
--- a/src/components/tabs/tabs.ts
+++ b/src/components/tabs/tabs.ts
@@ -327,6 +327,8 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
             // Current tab has changed, don't slide to initial anymore.
             this.shouldSlideToInitial = false;
         }
+
+        this.updateAriaHidden(); // Sliding resets the aria-hidden, update it.
     }
 
     /**
@@ -354,11 +356,18 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
                     if (this.shouldSlideToInitial) {
                         this.slides.slideTo(this.selected, 0);
                         this.shouldSlideToInitial = false;
+                        this.updateAriaHidden(); // Slide's slideTo() sets aria-hidden to true, update it.
                     }
                 }, 400);
+
+                return;
             } else if (this.selected) {
                 this.hasSliddenToInitial = true;
             }
+
+            setTimeout(() => {
+                this.updateAriaHidden(); // Slide's update() sets aria-hidden to true, update it.
+            }, 400);
         });
     }
 
@@ -458,6 +467,7 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
 
         if (this.selected) {
             this.slides.slideTo(index);
+            this.updateAriaHidden(); // Slide's slideTo() sets aria-hidden to true, update it.
         }
 
         this.selectHistory.push(index);
@@ -491,6 +501,15 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
         this.calculateSlides();
     }
 
+    /**
+     * Update aria-hidden of all tabs.
+     */
+    protected updateAriaHidden(): void {
+        this.tabs.forEach((tab, index) => {
+            tab.updateAriaHidden();
+        });
+    }
+
     /**
      * Component destroyed.
      */

From 88a0a2851ff46084cc42440bb6e788d722bcbdd9 Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Fri, 15 Mar 2019 11:36:32 +0100
Subject: [PATCH 2/2] MOBILE-2819 a11y: Fix image description read twice

---
 .../picture/component/addon-mod-data-field-picture.html       | 4 ++--
 .../module-completion/core-course-module-completion.html      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/addon/mod/data/fields/picture/component/addon-mod-data-field-picture.html b/src/addon/mod/data/fields/picture/component/addon-mod-data-field-picture.html
index d0bbb6885..c5a4a560e 100644
--- a/src/addon/mod/data/fields/picture/component/addon-mod-data-field-picture.html
+++ b/src/addon/mod/data/fields/picture/component/addon-mod-data-field-picture.html
@@ -11,6 +11,6 @@
     <ion-input type="text" [formControlName]="'f_'+field.id" [placeholder]="field.name"></ion-input>
 </span>
 
-<span *ngIf="mode == 'list' && imageUrl" (click)="gotoEntry.emit(entryId)"><img [src]="imageUrl" [alt]="title" [title]="title" class="core-media-adapt-width list_picture" core-external-content/></span>
+<span *ngIf="mode == 'list' && imageUrl" (click)="gotoEntry.emit(entryId)"><img [src]="imageUrl" [alt]="title" class="core-media-adapt-width list_picture" core-external-content/></span>
 
-<img *ngIf="mode == 'show' && imageUrl" [src]="imageUrl" [alt]="title" [title]="title" class="core-media-adapt-width list_picture" [attr.width]="width" [attr.height]="height" core-external-content/>
+<img *ngIf="mode == 'show' && imageUrl" [src]="imageUrl" [alt]="title" class="core-media-adapt-width list_picture" [attr.width]="width" [attr.height]="height" core-external-content/>
diff --git a/src/core/course/components/module-completion/core-course-module-completion.html b/src/core/course/components/module-completion/core-course-module-completion.html
index 7de6d78d5..9238f78ba 100644
--- a/src/core/course/components/module-completion/core-course-module-completion.html
+++ b/src/core/course/components/module-completion/core-course-module-completion.html
@@ -1,3 +1,3 @@
 <a *ngIf="completion" (click)="completionClicked($event)">
-    <img [src]="completionImage" [alt]="completionDescription" [title]="completionDescription">
+    <img [src]="completionImage" [alt]="completionDescription">
 </a>
\ No newline at end of file