Bug 1574949 - Use event.currentTarget to get the reference to the button when acting on the click event so it will work regardless of what inner content is clicked or if the button itself is clicked. r=MattN

I didn't switch to using an A element with href= since the link target depends on the value of a preference, which is set at runtime in browser_dismissFooter.js and would necessitate refactoring of the test.

Differential Revision: https://phabricator.services.mozilla.com/D43124

--HG--
extra : moz-landing-system : lando

browser/components/aboutlogins/content/aboutLogins.html

@@ -227,11 +227,11 @@
             <strong data-l10n-id="login-app-promo-title"></strong><br>
             <span data-l10n-id="login-app-promo-subtitle"></span>
           </p>
-          <button class="app-store">
+          <button class="app-store" data-event-name="AboutLoginsOpenMobileIos">
-            <img class="image-app-store" data-event-name="AboutLoginsOpenMobileIos" data-l10n-id="login-app-promo-apple" src="" alt=""/>
+            <img class="image-app-store" data-l10n-id="login-app-promo-apple" src="" alt=""/>
           </button>
-          <button class="play-store" >
+          <button class="play-store" data-event-name="AboutLoginsOpenMobileAndroid">
-            <img class="image-play-store" data-event-name="AboutLoginsOpenMobileAndroid" data-l10n-id="login-app-promo-android" src="" alt=""/>
+            <img class="image-play-store" data-l10n-id="login-app-promo-android" src="" alt=""/>
           </button>
           <button class="close" data-event-name="AboutLoginsHideFooter"></button>
         </div>

browser/components/aboutlogins/content/components/login-footer.js

@@ -25,14 +25,15 @@ export default class LoginFooter extends HTMLElement {
   handleEvent(event) {
     switch (event.type) {
       case "click": {
-        let classList = event.originalTarget.classList;
+        let target = event.currentTarget;
+        let classList = target.classList;
 
         if (
-          classList.contains("image-play-store") ||
+          classList.contains("play-store") ||
-          classList.contains("image-app-store") ||
+          classList.contains("app-store") ||
           classList.contains("close")
         ) {
-          let eventName = event.originalTarget.dataset.eventName;
+          let eventName = target.dataset.eventName;
           const linkTrackingSource = "Footer_Menu";
           document.dispatchEvent(
             new CustomEvent(eventName, {