Implement interesttarget support for `<area>` element
See: https://github.com/openui/open-ui/issues/1003
Bug: 326681249
Change-Id: Id53787ab5a417139384359537360b1d90f629a3f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5426204
Commit-Queue: Luke <lwarlow@igalia.com>
Reviewed-by: Mason Freed <masonf@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1284573}
diff --git a/html/semantics/invokers/interesttarget-anchor-event-dispatch.tentative.html b/html/semantics/invokers/interesttarget-anchor-event-dispatch.tentative.html
new file mode 100644
index 0000000..b5a481a
--- /dev/null
+++ b/html/semantics/invokers/interesttarget-anchor-event-dispatch.tentative.html
@@ -0,0 +1,47 @@
+<!doctype html>
+<meta charset="utf-8" />
+<meta name="author" title="Keith Cirkel" href="mailto:keithamus@github.com" />
+<meta name="author" title="Luke Warlow" href="mailto:lwarlow@igalia.com" />
+<link rel="help" href="https://open-ui.org/components/invokers.explainer/" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="resources/invoker-utils.js"></script>
+
+<div id="interestee"></div>
+<a href="/" id="interestanchor" interesttarget="interestee">Anchor</a>
+<button id="otherbutton">Other Button</button>
+
+<script>
+ promise_test(async function (t) {
+ t.add_cleanup(() => otherbutton.focus());
+ let event = null;
+ interestee.addEventListener("interest", (e) => (event = e), { once: true });
+ interestanchor.focus();
+ assert_true(event instanceof InterestEvent, "event is InterestEvent");
+ assert_equals(event.type, "interest", "type");
+ assert_equals(event.bubbles, false, "bubbles");
+ assert_equals(event.composed, true, "composed");
+ assert_equals(event.isTrusted, true, "isTrusted");
+ assert_equals(event.action, "", "action");
+ assert_equals(event.target, interestee, "target");
+ assert_equals(event.invoker, interestanchor, "invoker");
+ }, "InterestEvent dispatches on anchor focus");
+
+ promise_test(async function (t) {
+ t.add_cleanup(() => otherbutton.focus());
+ let event = null;
+ interestee.addEventListener("interest", (e) => (event = e), { once: true });
+ await hoverOver(interestanchor);
+ assert_true(event instanceof InterestEvent, "event is InterestEvent");
+ assert_equals(event.type, "interest", "type");
+ assert_equals(event.bubbles, false, "bubbles");
+ assert_equals(event.composed, true, "composed");
+ assert_equals(event.isTrusted, true, "isTrusted");
+ assert_equals(event.action, "", "action");
+ assert_equals(event.target, interestee, "target");
+ assert_equals(event.invoker, interestanchor, "invoker");
+ }, "InterestEvent dispatches on anchor hover");
+</script>
diff --git a/html/semantics/invokers/interesttarget-area-event-dispatch.tentative.html b/html/semantics/invokers/interesttarget-area-event-dispatch.tentative.html
new file mode 100644
index 0000000..358acbb
--- /dev/null
+++ b/html/semantics/invokers/interesttarget-area-event-dispatch.tentative.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<meta charset="utf-8" />
+<meta name="author" title="Keith Cirkel" href="mailto:keithamus@github.com" />
+<meta name="author" title="Luke Warlow" href="mailto:lwarlow@igalia.com" />
+<link rel="help" href="https://open-ui.org/components/invokers.explainer/" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<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">
+<button id="otherbutton">Other Button</button>
+
+<script>
+ promise_test(async function (t) {
+ t.add_cleanup(() => otherbutton.focus());
+ let event = null;
+ interestee.addEventListener("interest", (e) => (event = e), { once: true });
+ interestarea.focus();
+ assert_true(event instanceof InterestEvent, "event is InterestEvent");
+ assert_equals(event.type, "interest", "type");
+ assert_equals(event.bubbles, false, "bubbles");
+ assert_equals(event.composed, true, "composed");
+ assert_equals(event.isTrusted, true, "isTrusted");
+ assert_equals(event.action, "", "action");
+ assert_equals(event.target, interestee, "target");
+ assert_equals(event.invoker, interestarea, "invoker");
+ }, "InterestEvent dispatches on area focus");
+
+ promise_test(async function (t) {
+ t.add_cleanup(() => otherbutton.focus());
+ let event = null;
+ interestee.addEventListener("interest", (e) => (event = e), { once: true });
+ await hoverOver(interestarea);
+ assert_true(event instanceof InterestEvent, "event is InterestEvent");
+ assert_equals(event.type, "interest", "type");
+ assert_equals(event.bubbles, false, "bubbles");
+ assert_equals(event.composed, true, "composed");
+ assert_equals(event.isTrusted, true, "isTrusted");
+ assert_equals(event.action, "", "action");
+ assert_equals(event.target, interestee, "target");
+ assert_equals(event.invoker, interestarea, "invoker");
+ }, "InterestEvent dispatches on area hover");
+</script>
diff --git a/html/semantics/invokers/interesttarget-button-event-dispatch.tentative.html b/html/semantics/invokers/interesttarget-button-event-dispatch.tentative.html
index 7fdfdfa..69126db 100644
--- a/html/semantics/invokers/interesttarget-button-event-dispatch.tentative.html
+++ b/html/semantics/invokers/interesttarget-button-event-dispatch.tentative.html
@@ -12,7 +12,6 @@
<div id="interestee"></div>
<button id="interestbutton" interesttarget="interestee">Button</button>
-<a href="/" id="interestanchor" interesttarget="interestee">Anchor</a>
<button id="otherbutton">Other Button</button>
<script>
@@ -50,36 +49,6 @@
t.add_cleanup(() => otherbutton.focus());
let event = null;
interestee.addEventListener("interest", (e) => (event = e), { once: true });
- interestanchor.focus();
- assert_true(event instanceof InterestEvent, "event is InterestEvent");
- assert_equals(event.type, "interest", "type");
- assert_equals(event.bubbles, false, "bubbles");
- assert_equals(event.composed, true, "composed");
- assert_equals(event.isTrusted, true, "isTrusted");
- assert_equals(event.action, "", "action");
- assert_equals(event.target, interestee, "target");
- assert_equals(event.invoker, interestanchor, "invoker");
- }, "InterestEvent dispatches on anchor focus");
-
- promise_test(async function (t) {
- t.add_cleanup(() => otherbutton.focus());
- let event = null;
- interestee.addEventListener("interest", (e) => (event = e), { once: true });
- await hoverOver(interestanchor);
- assert_true(event instanceof InterestEvent, "event is InterestEvent");
- assert_equals(event.type, "interest", "type");
- assert_equals(event.bubbles, false, "bubbles");
- assert_equals(event.composed, true, "composed");
- assert_equals(event.isTrusted, true, "isTrusted");
- assert_equals(event.action, "", "action");
- assert_equals(event.target, interestee, "target");
- assert_equals(event.invoker, interestanchor, "invoker");
- }, "InterestEvent dispatches on anchor hover");
-
- promise_test(async function (t) {
- t.add_cleanup(() => otherbutton.focus());
- let event = null;
- interestee.addEventListener("interest", (e) => (event = e), { once: true });
interestbutton.interestAction = "fooBar";
interestbutton.focus();
assert_true(event instanceof InterestEvent, "event is InterestEvent");
