Bug 1578494 - ignore images inside anchors for semantic check as they get a propagated jump action. r=nchevobbe

Depends on D45216

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

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

devtools/server/actors/accessibility/audit/keyboard.js

@@ -376,7 +376,10 @@ function semanticsRule(accessible) {
     // they are clickable.
     (accessible.role === Ci.nsIAccessibleRole.ROLE_LABEL &&
       accessible.getRelationByType(Ci.nsIAccessibleRelation.RELATION_LABEL_FOR)
-        .targetsCount > 0)
+        .targetsCount > 0) ||
+    // Ignore images that are inside an anchor (have linked state).
+    (accessible.role === Ci.nsIAccessibleRole.ROLE_GRAPHIC &&
+      state.value & Ci.nsIAccessibleStates.STATE_LINKED)
   ) {
     return null;
   }

devtools/server/tests/browser/browser_accessibility_keyboard_audit.js

@@ -176,6 +176,10 @@ add_task(async function() {
       "#label-4",
       null,
     ],
+    ["Image inside an anchor (href)", "#img-5", null],
+    ["Image inside an anchor (onmousedown)", "#img-6", null],
+    ["Image inside an anchor (onclick)", "#img-7", null],
+    ["Image inside an anchor (onmouseup)", "#img-8", null],
   ];
 
   for (const [description, selector, expected] of tests) {

devtools/server/tests/browser/doc_accessibility_keyboard_audit.html

@@ -69,5 +69,17 @@
   <label id="label-2" for="checkbox-1">hello</label>
   <label id="label-3">hello</label>
   <label id="label-4">hello</label><input type="checkbox" name="world" />
+  <a href="about:mozilla" target="_blank" rel="opener">
+    <img id="img-5" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAJklEQVRIie3NMREAAAgAoe9fWls4eAzMVM0xoVAoFAqFQqFQ+C9chp4NHvu+4Q4AAAAASUVORK5CYII=" alt="alt text">
+  </a>
+  <a onmousedown="">
+    <img id="img-6" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAJklEQVRIie3NMREAAAgAoe9fWls4eAzMVM0xoVAoFAqFQqFQ+C9chp4NHvu+4Q4AAAAASUVORK5CYII=" alt="alt text">
+  </a>
+  <a onclick="">
+    <img id="img-7" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAJklEQVRIie3NMREAAAgAoe9fWls4eAzMVM0xoVAoFAqFQqFQ+C9chp4NHvu+4Q4AAAAASUVORK5CYII=" alt="alt text">
+  </a>
+  <a onmouseup="">
+    <img id="img-8" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAJklEQVRIie3NMREAAAgAoe9fWls4eAzMVM0xoVAoFAqFQqFQ+C9chp4NHvu+4Q4AAAAASUVORK5CYII=" alt="alt text">
+  </a>
 </body>
 </html>