Only support interesttarget on valid links (with hrefs) [8/N]

Since links (<a>, <area>, SVG <a>) aren't interactive/focusable unless they have an href attribute, interesttarget should also not work on links without hrefs. Bug: 326681249 Change-Id: I3063d8e3654807da069731c66d1899e0e8ba06c9 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6199080 Commit-Queue: Mason Freed <[email protected]> Reviewed-by: David Baron <[email protected]> Cr-Commit-Position: refs/heads/main@{#1411799}
jessejay-ch · Jan 27, 2025 · 5bafdb6 · 5bafdb6
1 parent d0063b0
commit 5bafdb6
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 10 deletions.
diff --git a/...cs/the-button-element/interest-target/interesttarget-anchor-event-dispatch.tentative.html b/...cs/the-button-element/interest-target/interesttarget-anchor-event-dispatch.tentative.html
@@ -12,6 +12,7 @@
 <script src="resources/invoker-utils.js"></script>
 
 <div id="interestee"></div>
+<a id="nohref" interesttarget="interestee">Anchor</a>
 <a href="/" id="interestanchor" interesttarget="interestee">Anchor</a>
 <button id="otherbutton">Other Button</button>
 <style>
@@ -22,6 +23,25 @@
 
 <script>
   promise_test(async function (t) {
+    t.add_cleanup(async () => {
+      await hoverOver(otherbutton);
+    });
+    let gotEvent = false;
+    interestee.addEventListener("interest", () => (gotEvent = true));
+    await hoverOver(nohref);
+    assert_false(gotEvent, "InterestEvent should not get fired");
+    nohref.setAttribute('href','foo');
+    await hoverOver(nohref);
+    assert_false(gotEvent, "adding href while the element is already hovered should not fire interest");
+    await hoverOver(otherbutton);
+    await hoverOver(nohref);
+    assert_true(gotEvent, "interest should now be fired");
+  }, "InterestEvent is not dispatched unless the anchor has an href");
+
+  promise_test(async function (t) {
+    t.add_cleanup(async () => {
+      await hoverOver(otherbutton);
+    });
     let event = null;
     interestee.addEventListener("interest", (e) => (event = e), { once: true });
     await hoverOver(interestanchor);

diff --git a/...tics/the-button-element/interest-target/interesttarget-area-event-dispatch.tentative.html b/...tics/the-button-element/interest-target/interesttarget-area-event-dispatch.tentative.html
@@ -12,10 +12,10 @@
 <script src="resources/invoker-utils.js"></script>
 
 <div id="interestee"></div>
-<map id="map">
-  <area href="/" shape="default" id="interestarea" interesttarget="interestee">
-</map>
-<img src="/images/blue.png" usemap="#map">
+<map id="map1"><area shape="default" id="nohref" interesttarget="interestee"></map>
+<img id=nohref_img src="/images/blue.png" usemap="#map1">
+<map id="map2"><area href="/" shape="default" id="interestarea" interesttarget="interestee"></map>
+<img id=interestarea_img src="/images/blue.png" usemap="#map2">
 <button id="otherbutton">Other Button</button>
 <style>
   [interesttarget] {
@@ -25,10 +25,28 @@
 
 <script>
   promise_test(async function (t) {
-    t.add_cleanup(() => otherbutton.focus());
+    t.add_cleanup(async () => {
+      await hoverOver(otherbutton);
+    });
+    let gotEvent = false;
+    interestee.addEventListener("interest", () => (gotEvent = true), { once: true });
+    await hoverOver(nohref_img);
+    assert_false(gotEvent, "InterestEvent should not get fired");
+    nohref.setAttribute('href','foo');
+    await hoverOver(nohref_img);
+    assert_false(gotEvent, "adding href while the element is already hovered should not fire interest");
+    await hoverOver(otherbutton);
+    await hoverOver(nohref_img);
+    assert_true(gotEvent, "interest should now be fired");
+  }, "InterestEvent is not dispatched unless the area has an href");
+
+  promise_test(async function (t) {
+    t.add_cleanup(async () => {
+      await hoverOver(otherbutton);
+    });
     let event = null;
     interestee.addEventListener("interest", (e) => (event = e), { once: true });
-    await hoverOver(interestarea);
+    await hoverOver(interestarea_img);
     assert_true(!!event, "InterestEvent is fired");
     assert_true(event instanceof InterestEvent, "event is InterestEvent");
     assert_equals(event.type, "interest", "type");

diff --git a/...ics/the-button-element/interest-target/interesttarget-svg-a-event-dispatch.tentative.html b/...ics/the-button-element/interest-target/interesttarget-svg-a-event-dispatch.tentative.html
@@ -13,9 +13,10 @@
 
 <div id="interestee"></div>
 <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
-  <a href="/" id="interestsvga" interesttarget="interestee">
-    <text x="50" y="90">SVG A</text>
-  </a>
+  <a id="nohref" interesttarget="interestee"><text x="50" y="90">SVG A</text></a>
+</svg>
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <a href="/" id="interestsvga" interesttarget="interestee"><text x="50" y="90">SVG A</text></a>
 </svg>
 <button id="otherbutton">Other Button</button>
 <style>
@@ -25,6 +26,22 @@
 </style>
 
 <script>
+  promise_test(async function (t) {
+    t.add_cleanup(async () => {
+      await hoverOver(otherbutton);
+    });
+    let gotEvent = false;
+    interestee.addEventListener("interest", () => (gotEvent = true));
+    await hoverOver(nohref);
+    assert_false(gotEvent, "InterestEvent should not get fired");
+    nohref.setAttribute('href','foo');
+    await hoverOver(nohref);
+    assert_false(gotEvent, "adding href while the element is already hovered should not fire interest");
+    await hoverOver(otherbutton);
+    await hoverOver(nohref);
+    assert_true(gotEvent, "interest should now be fired");
+  }, "InterestEvent is not dispatched unless the svg <a> has an href");
+
   promise_test(async function (t) {
     t.add_cleanup(async () => {
       await hoverOver(otherbutton);
@@ -40,5 +57,5 @@
     assert_equals(event.isTrusted, true, "isTrusted");
     assert_equals(event.target, interestee, "target");
     assert_equals(event.source, interestsvga, "source");
-  }, "InterestEvent dispatches on svg a hover");
+  }, "InterestEvent dispatches on svg <a> hover");
 </script>