Refactor the interestfor-invoker-descendants.tentative.html test

Just cleans it up - no functional change.

Bug: 326681249
Change-Id: I8dad148ad76743befd8725b9dfeb0a25a5e5e489
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6974990
Reviewed-by: Joey Arhar <[email protected]>
Commit-Queue: Mason Freed <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1520344}

Author: mfreed7

html/semantics/interestfor/interestfor-invoker-descendants.tentative.html

@@ -17,6 +17,8 @@
 <button id=otherbutton>Other button</button>
 <style>
   [interestfor] { interest-delay: 0s; }
+  :interest-source { background-color: lightgreen;}
+  :interest-target { background-color: lightblue;}
 </style>
 
 <script>
@@ -25,57 +27,42 @@
 const target = document.getElementById('target');
 const otherbutton = document.getElementById('otherbutton');
 
-promise_test(async function (t) {
-  t.add_cleanup(() => focusOn(otherbutton));
-  const signal = t.get_signal();
-  let interestCount = 0;
-  let loseInterestCount = 0;
-  target.addEventListener('interest',() => (++interestCount),{signal});
-  target.addEventListener('loseinterest',() => (++loseInterestCount),{signal});
-  await focusOn(invoker);
-  assert_true(invoker.matches(':interest-source'),'focusing invoker should show interest');
-  assert_equals(interestCount,1,'One interest event');
-  interestCount = 0;
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await focusOn(innerSpan);
-  assert_true(invoker.matches(':interest-source'),'focusing inner span should keep interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await focusOn(invoker);
-  assert_true(invoker.matches(':interest-source'),'focusing back to outer button should keep interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await focusOn(otherbutton);
-  assert_false(invoker.matches(':interest-source'),'focusing outside should lose interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,1,'Finally got loseinterest event');
-},'Moving focus within invoker works correctly');
+async function showInterest(el, method) {
+  if (method === 'focus') {
+    await focusOn(el);
+  } else {
+    assert_equals(method,'hover');
+    await hoverOver(el);
+  }
+}
 
-promise_test(async function (t) {
-  t.add_cleanup(() => focusOn(otherbutton));
-  const signal = t.get_signal();
-  let interestCount = 0;
-  let loseInterestCount = 0;
-  target.addEventListener('interest',() => (++interestCount),{signal});
-  target.addEventListener('loseinterest',() => (++loseInterestCount),{signal});
-  await hoverOver(invoker);
-  assert_true(invoker.matches(':interest-source'),'hovering invoker should show interest');
-  assert_equals(interestCount,1,'One interest event');
-  interestCount = 0;
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await hoverOver(innerSpan);
-  assert_true(invoker.matches(':interest-source'),'hovering inner span should keep interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await hoverOver(invoker);
-  assert_true(invoker.matches(':interest-source'),'hovering back to outer button should keep interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,0,'No loseinterest events');
-  await hoverOver(otherbutton);
-  assert_false(invoker.matches(':interest-source'),'hovering outside should lose interest');
-  assert_equals(interestCount,0,'No extra interest events');
-  assert_equals(loseInterestCount,1,'Finally got loseinterest event');
-},'Moving hover within invoker works correctly');
+['focus','hover'].forEach(method => {
+  promise_test(async function (t) {
+    t.add_cleanup(() => showInterest(otherbutton, method));
+    const signal = t.get_signal();
+    let interestCount = 0;
+    let loseInterestCount = 0;
+    target.addEventListener('interest',() => (++interestCount),{signal});
+    target.addEventListener('loseinterest',() => (++loseInterestCount),{signal});
+    await showInterest(invoker, method);
+    assert_true(invoker.matches(':interest-source'),'focusing invoker should show interest');
+    assert_equals(interestCount,1,'One interest event');
+    interestCount = 0;
+    assert_equals(loseInterestCount,0,'No loseinterest events');
+    await showInterest(innerSpan, method);
+    assert_true(invoker.matches(':interest-source'),'focusing inner span should keep interest');
+    assert_equals(interestCount,0,'No extra interest events');
+    assert_equals(loseInterestCount,0,'No loseinterest events');
+    await showInterest(invoker, method);
+    assert_true(invoker.matches(':interest-source'),'focusing back to outer button should keep interest');
+    assert_equals(interestCount,0,'No extra interest events');
+    assert_equals(loseInterestCount,0,'No loseinterest events');
+    await showInterest(otherbutton, method);
+    assert_false(invoker.matches(':interest-source'),'focusing outside should lose interest');
+    assert_equals(interestCount,0,'No extra interest events');
+    assert_equals(loseInterestCount,1,'Finally got loseinterest event');
+  },`Moving focus within invoker, ${method}`);
+});
 </script>
 
 <a id=outer href="#" interestfor="middle">Outer</a>
@@ -90,43 +77,26 @@
 const middleLink = document.getElementById('middle-link');
 const inner = document.getElementById('inner');
 const innerButton = document.getElementById('inner-button');
-promise_test(async function (t) {
-  t.add_cleanup(() => focusOn(otherbutton));
-  assert_false(middle.matches(':popover-open'),'middle starts closed');
-  await focusOn(outer);
-  assert_true(outer.matches(':interest-source'),'focusing outer should show interest');
-  assert_true(middle.matches(':popover-open'),'outer popover open');
 
-  await focusOn(middleLink);
-  assert_true(middleLink.matches(':interest-source'),'focusing middle should show interest');
-  assert_true(outer.matches(':interest-source'),'outer keeps interest');
-  assert_true(middle.matches(':popover-open'),'middle popover stays open');
-  assert_true(inner.matches(':popover-open'),'inner popover opens');
+['focus','hover'].forEach(method => {
+  promise_test(async function (t) {
+    t.add_cleanup(() => showInterest(otherbutton, method));
+    assert_false(middle.matches(':popover-open'),'middle starts closed');
+    await showInterest(outer, method);
+    assert_true(outer.matches(':interest-source'),'focusing outer should show interest');
+    assert_true(middle.matches(':popover-open'),'outer popover open');
 
-  await focusOn(innerButton);
-  assert_true(outer.matches(':interest-source'),'outer keeps interest');
-  assert_true(middleLink.matches(':interest-source'),'middle keeps interest');
-  assert_true(middle.matches(':popover-open'),'middle popover stays open');
-  assert_true(inner.matches(':popover-open'),'inner popover stays open');
-},'Nested invokers maintain interest properly (focus)');
+    await showInterest(middleLink, method);
+    assert_true(middleLink.matches(':interest-source'),'focusing middle should show interest');
+    assert_true(outer.matches(':interest-source'),'outer keeps interest');
+    assert_true(middle.matches(':popover-open'),'middle popover stays open');
+    assert_true(inner.matches(':popover-open'),'inner popover opens');
 
-promise_test(async function (t) {
-  t.add_cleanup(() => focusOn(otherbutton));
-  assert_false(middle.matches(':popover-open'),'middle starts closed');
-  await hoverOver(outer);
-  assert_true(outer.matches(':interest-source'),'hovering outer should show interest');
-  assert_true(middle.matches(':popover-open'),'outer popover open');
-
-  await hoverOver(middleLink);
-  assert_true(outer.matches(':interest-source'),'outer keeps interest');
-  assert_true(middle.matches(':popover-open'),'middle popover stays open');
-  assert_true(middleLink.matches(':interest-source'),'hovering middle should show interest');
-  assert_true(inner.matches(':popover-open'),'inner popover opens');
-
-  await hoverOver(innerButton);
-  assert_true(outer.matches(':interest-source'),'outer keeps interest');
-  assert_true(middleLink.matches(':interest-source'),'middle keeps interest');
-  assert_true(middle.matches(':popover-open'),'middle popover stays open');
-  assert_true(inner.matches(':popover-open'),'inner popover stays open');
-},'Nested invokers maintain interest properly (hover)');
+    await showInterest(innerButton, method);
+    assert_true(outer.matches(':interest-source'),'outer keeps interest');
+    assert_true(middleLink.matches(':interest-source'),'middle keeps interest');
+    assert_true(middle.matches(':popover-open'),'middle popover stays open');
+    assert_true(inner.matches(':popover-open'),'inner popover stays open');
+  },`Nested invokers, ${method}`);
+});
 </script>