Bug 1823168 - Modernize toolkit/components/satchel/test/test_datalist…

…_shadow_dom.html r=credential-management-reviewers,dimi Differential Revision: https://phabricator.services.mozilla.com/D172921
dothq · Mar 20, 2023 · 5638e26 · 5638e26
1 parent f41714f
commit 5638e26
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 92 deletions.
diff --git a/toolkit/components/satchel/test/satchel_common.js b/toolkit/components/satchel/test/satchel_common.js
@@ -337,10 +337,13 @@ function deleteSelectedAutocompleteItem() {
 }
 
 async function openPopupOn(
-  inputSelector,
+  inputOrSelector,
   { inputValue = "", expectPopup = true } = {}
 ) {
-  const input = document.querySelector(inputSelector);
+  const input =
+    typeof inputOrSelector == "string"
+      ? document.querySelector(inputOrSelector)
+      : inputOrSelector;
   input.value = inputValue;
   input.focus();
   await (expectPopup ? popupAfterArrowDown() : noPopupAfterArrowDown());

diff --git a/toolkit/components/satchel/test/test_datalist_shadow_dom.html b/toolkit/components/satchel/test/test_datalist_shadow_dom.html
@@ -13,8 +13,8 @@
   <div id="host"></div>
 </div>
 
-<pre id="test">
-<script class="testbody" type="text/javascript">
+<script>
+
 const host = document.getElementById("host");
 host.attachShadow({ mode: "open" }).innerHTML = `
   <form id="form1" onsubmit="return false;">
@@ -25,99 +25,31 @@
     <option value="First"></option>
     <option value="Second"></option>
     <option value="Secomundo"></option>
-  </datalist><Paste>
+  </datalist>
 `;
 
-let input = host.shadowRoot.querySelector("input");
-
-function setForm(value) {
-  input.value = value;
-  input.focus();
-}
-
-// Restore the form to the default state.
-function restoreForm() {
-  setForm("");
-}
-
-// Check for expected form data.
-function checkForm(expectedValue) {
-  let formID = input.parentNode.id;
-  is(input.value, expectedValue, "Checking " + formID + " input");
-}
-
-SimpleTest.waitForExplicitFinish();
-
-var expectingPopup = null;
-
-function expectPopup() {
-  info("expecting a popup");
-  return new Promise(resolve => {
-    expectingPopup = resolve;
-  });
-}
-
-var testNum = 0;
-
-function popupShownListener() {
-  info("popup shown for test " + testNum);
-  if (expectingPopup) {
-    expectingPopup();
-    expectingPopup = null;
-  } else {
-    ok(false, "Autocomplete popup not expected during test " + testNum);
-  }
-}
-
-function waitForMenuChange(expectedCount) {
-  return new Promise(resolve => {
-    notifyMenuChanged(expectedCount, null, resolve);
-  });
-}
-
-registerPopupShownListener(popupShownListener);
-
-function checkMenuEntries(expectedValues) {
-  let actualValues = getMenuEntries();
-  is(actualValues.length, expectedValues.length, testNum + " Checking length of expected menu");
-  for (let i = 0; i < expectedValues.length; i++) {
-    is(actualValues[i], expectedValues[i], testNum + " Checking menu entry #" + i);
-  }
-}
-
-async function runTests() {
-  testNum++;
-  restoreForm();
-  synthesizeKey("KEY_ArrowDown");
-  await expectPopup();
-
-  checkMenuEntries(["First", "Second", "Secomundo"]);
-  synthesizeKey("KEY_ArrowDown");
-  synthesizeKey("KEY_Enter");
-  checkForm("First");
-
-  testNum++;
-  restoreForm();
+add_task(async function fill_in_shadow() {
+  const input = await openPopupOn(host.shadowRoot.querySelector("input"));
+  assertAutocompleteItems("First", "Second", "Secomundo");
+  assertValueAfterKeys(
+    input,
+    ["KEY_ArrowDown", "KEY_Enter"],
+    "First");
+});
+
+add_task(async function filter_and_fill_in_shadow() {
+  const input = await openPopupOn(host.shadowRoot.querySelector("input"));
   sendString("Sec");
-  synthesizeKey("KEY_ArrowDown");
-  await expectPopup();
-
-  testNum++;
-  checkMenuEntries(["Second", "Secomundo"]);
+  await notifyMenuChanged(2);
+  assertAutocompleteItems("Second", "Secomundo");
   sendString("o");
-  await waitForMenuChange(2);
-
-  testNum++;
-  checkMenuEntries(["Second", "Secomundo"]);
-  synthesizeKey("KEY_ArrowDown");
-  synthesizeKey("KEY_Enter");
-  checkForm("Second");
-  SimpleTest.finish();
-}
-
-window.onpageshow = runTests;
+  await notifyMenuChanged(2);
+  assertValueAfterKeys(
+    input,
+    ["KEY_ArrowDown", "KEY_Enter"],
+    "Second");
+});
 
 </script>
-</pre>
 </body>
 </html>