From 2e650110c9980261e08e0b34a689282888218a58 Mon Sep 17 00:00:00 2001
From: adeelehsan <adeel.ehsan@arbisoft.com>
Date: Tue, 22 Jun 2021 21:08:27 +0500
Subject: [PATCH] activation a11y issue fixed

---
 lms/static/js/dashboard/legacy.js | 28 ++++++++++++++++------------
 lms/templates/dashboard.html      |  2 +-
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/lms/static/js/dashboard/legacy.js b/lms/static/js/dashboard/legacy.js
index 2ad6ac76c2..f75131e74b 100644
--- a/lms/static/js/dashboard/legacy.js
+++ b/lms/static/js/dashboard/legacy.js
@@ -234,17 +234,20 @@
                  url: urls.sendAccountActivationEmail,
                  data: $(this).serializeArray(),
                  success: function() {
-                     $('#activate-account-modal p svg').remove();
-                      // xss-lint: disable=javascript-jquery-append
-                     $('#activate-account-modal p').append(
-                       // xss-lint: disable=javascript-concat-html
-                       '<svg  style="vertical-align:bottom" width="20" height="20"' +
-                       // xss-lint: disable=javascript-concat-html
-                       'viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n' +
-                       // xss-lint: disable=javascript-concat-html
-                       '<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" fill="#178253"/>\n' +
-                       '</svg>'
-                     );
+                     setTimeout(
+                       function(){
+                         $('#activate-account-modal p svg').remove();
+                         // xss-lint: disable=javascript-jquery-append
+                         $('#activate-account-modal p').append(
+                         // xss-lint: disable=javascript-concat-html
+                         '<svg  style="vertical-align:bottom" width="20" height="20"' +
+                         // xss-lint: disable=javascript-concat-html
+                         'viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n' +
+                         // xss-lint: disable=javascript-concat-html
+                         '<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" fill="#178253"/>\n' +
+                         '</svg>'
+                         );
+                       }, 500); // adding timeout to make spinner animation longer
                  }
              });
              e.preventDefault();
@@ -252,7 +255,7 @@
              // xss-lint: disable=javascript-jquery-append
              $('#activate-account-modal p').append(
                // xss-lint: disable=javascript-concat-html
-               '<svg  class="fa-pulse" style="vertical-align:bottom" width="24" height="24"' +
+               '<svg  class="fa-pulse" style="vertical-align:bottom" width="20" height="20"' +
                // xss-lint: disable=javascript-concat-html
                'viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n' +
                // xss-lint: disable=javascript-concat-html
@@ -270,6 +273,7 @@
                  display: 'block',
                  'z-index': 0
              });
+             $('#activate-account-modal').focus()
          }
 
          $('.action-email-settings').each(function(index) {
diff --git a/lms/templates/dashboard.html b/lms/templates/dashboard.html
index f9943bc142..4f8a262721 100644
--- a/lms/templates/dashboard.html
+++ b/lms/templates/dashboard.html
@@ -319,7 +319,7 @@ from common.djangoapps.student.models import CourseEnrollment
 </main>
 
 %if show_account_activation_popup:
-    <div id="activate-account-modal" class="modal activate-account-modal" aria-hidden="true">
+    <div id="activate-account-modal" class="modal activate-account-modal" aria-hidden="true" tabindex=0 >
       <div class="inner-wrapper" role="dialog" aria-labelledby="activate-account-modal-title" aria-live="polite">
           <h3>
              ${_("Activate your account so you can log back in")}