Bug 1712425 - Implement tests to cover Delete and Backspace key event in the compose addressing fields. r=darktrojan
authorAlessandro Castellani <alessandro@thunderbird.net>
Sat, 12 Jun 2021 13:50:30 +0300
changeset 32803 53d788748ed6ae01e275e8b20c5e10fe751f2181
parent 32802 c21e0f6e875db7a236778599b65ac80254ee2231
child 32804 cb7f881249d4404b67e9802e89e768c8207faca7
push id18869
push usermkmelin@iki.fi
push dateSat, 12 Jun 2021 10:53:49 +0000
treeherdercomm-central@9a5cb3c312a4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdarktrojan
bugs1712425
Bug 1712425 - Implement tests to cover Delete and Backspace key event in the compose addressing fields. r=darktrojan Differential Revision: https://phabricator.services.mozilla.com/D117463
mail/test/browser/composition/browser_addressWidgets.js
--- a/mail/test/browser/composition/browser_addressWidgets.js
+++ b/mail/test/browser/composition/browser_addressWidgets.js
@@ -161,17 +161,17 @@ add_task(async function test_address_typ
     { identitykey: POP3identity },
   ]);
   check_nntp_address_types();
 
   close_compose_window(cwc);
 
   remove_NNTP_account();
 
-  // Now the NNTP account is lost, so we should be back to mail only addressees.
+  // Now the NNTP account is lost, so we should be back to mail only addresses.
   be_in_folder(accountPOP3.incomingServer.rootFolder);
   cwc = open_compose_new_mail();
   check_mail_address_types();
   close_compose_window(cwc);
 });
 
 add_task(async function test_address_suppress_leading_comma_space() {
   be_in_folder(accountPOP3.incomingServer.rootFolder);
@@ -403,19 +403,18 @@ add_task(async function test_pill_creati
         .querySelectorAll("mail-address-pill")[3].emailAddress,
       addresses[3]
     );
   }
 
   // The To field is visible and focused by default when the compose window is
   // first opened.
   // Test pill creation for the To input field.
-  await assertPillsCreationInField(
-    cwc.window.document.getElementById("toAddrInput")
-  );
+  let toInput = cwc.window.document.getElementById("toAddrInput");
+  await assertPillsCreationInField(toInput);
 
   // Click on the Cc recipient label.
   let ccInput = cwc.window.document.getElementById("ccAddrInput");
   EventUtils.synthesizeMouseAtCenter(
     cwc.window.document.getElementById("addr_cc"),
     {},
     cwc.window
   );
@@ -461,17 +460,17 @@ add_task(async function test_pill_creati
   // Press and hold Backspace again.
   EventUtils.synthesizeKey("KEY_Backspace", { repeat: 2 }, cwc.window);
 
   // Confirm the Bcc field is closed and the focus moved to the Cc field.
   Assert.ok(
     bccInput.closest(".addressingWidgetItem").classList.contains("hidden"),
     "The Bcc field was closed"
   );
-  Assert.equal(ccInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, ccInput);
 
   // Now we're on the Cc field. Press and hold Backspace to delete all pills.
   EventUtils.synthesizeKey("KEY_Backspace", { repeat: 5 }, cwc.window);
 
   // All pills should be deleted, but the focus should remain on the Cc field.
   Assert.equal(
     ccInput.closest(".address-container").querySelectorAll("mail-address-pill")
       .length,
@@ -486,71 +485,222 @@ add_task(async function test_pill_creati
   // Press and hold Backspace again.
   EventUtils.synthesizeKey("KEY_Backspace", { repeat: 2 }, cwc.window);
 
   // Confirm the Cc field is closed and the focus moved to the To field.
   Assert.ok(
     ccInput.closest(".addressingWidgetItem").classList.contains("hidden"),
     "The Cc field was closed"
   );
+  Assert.equal(cwc.window.document.activeElement, toInput);
+
+  // Now we're on the To field. Press and hold Backspace to delete all pills.
+  EventUtils.synthesizeKey("KEY_Backspace", { repeat: 5 }, cwc.window);
+
+  // All pills should be deleted, but the focus should remain on the To field.
   Assert.equal(
-    cwc.window.document.getElementById("toAddrInput"),
-    cwc.window.document.activeElement
+    toInput.closest(".address-container").querySelectorAll("mail-address-pill")
+      .length,
+    0,
+    "All pills in the To field have been removed."
+  );
+  Assert.ok(
+    !toInput.closest(".addressingWidgetItem").classList.contains("hidden"),
+    "The To field is still visible"
   );
 
+  // Press and hold Backspace again.
+  EventUtils.synthesizeKey("KEY_Backspace", { repeat: 2 }, cwc.window);
+
+  // Long backspace keypress on the To field shouldn't do anything if the field
+  // is empty. Confirm the To field is still visible and the focus stays on the
+  // To field.
+  Assert.ok(
+    !toInput.closest(".addressingWidgetItem").classList.contains("hidden"),
+    "The To field is still visible"
+  );
+  Assert.equal(cwc.window.document.activeElement, toInput);
+
   close_compose_window(cwc);
 });
 
 add_task(async function test_addressing_fields_shortcuts() {
   be_in_folder(accountPOP3.incomingServer.rootFolder);
   let cwc = open_compose_new_mail();
 
   let addrToInput = cwc.window.document.getElementById("toAddrInput");
   // The To input field should be empty.
   Assert.equal(addrToInput.value, "");
   // The To input field should be the currently focused element.
-  Assert.equal(addrToInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrToInput);
 
   const modifiers =
     AppConstants.platform == "macosx"
       ? { accelKey: true, shiftKey: true }
       : { ctrlKey: true, shiftKey: true };
 
   let addrCcInput = cwc.window.document.getElementById("ccAddrInput");
   let ccRowShownPromise = BrowserTestUtils.waitForCondition(
     () => !addrCcInput.closest(".address-row").classList.contains("hidden"),
     "The Cc addressing row is not visible."
   );
   // Press the Ctrl/Cmd+Shift+C.
   EventUtils.synthesizeKey("C", modifiers, cwc.window);
   // The Cc addressing row should be visible.
   await ccRowShownPromise;
   // The Cc input field should be currently focused.
-  Assert.equal(addrCcInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrCcInput);
 
   let addrBccInput = cwc.window.document.getElementById("bccAddrInput");
   let bccRowShownPromise = BrowserTestUtils.waitForCondition(
     () => !addrBccInput.closest(".address-row").classList.contains("hidden"),
     "The Bcc addressing row is not visible."
   );
   // Press the Ctrl/Cmd+Shift+B.
   EventUtils.synthesizeKey("B", modifiers, cwc.window);
   await bccRowShownPromise;
   // The Bcc input field should be currently focused.
-  Assert.equal(addrBccInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrBccInput);
 
   // Press the Ctrl/Cmd+Shift+T.
   EventUtils.synthesizeKey("T", modifiers, cwc.window);
   // The To input field should be the currently focused element.
-  Assert.equal(addrToInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrToInput);
 
   // Press the Ctrl/Cmd+Shift+C.
   EventUtils.synthesizeKey("C", modifiers, cwc.window);
   // The Cc input field should be currently focused.
-  Assert.equal(addrCcInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrCcInput);
 
   // Press the Ctrl/Cmd+Shift+B.
   EventUtils.synthesizeKey("B", modifiers, cwc.window);
   // The Bcc input field should be currently focused.
-  Assert.equal(addrBccInput, cwc.window.document.activeElement);
+  Assert.equal(cwc.window.document.activeElement, addrBccInput);
+
+  close_compose_window(cwc);
+});
+
+add_task(async function test_pill_deletion_and_focus() {
+  be_in_folder(accountPOP3.incomingServer.rootFolder);
+  let cwc = open_compose_new_mail();
+
+  // When the compose window is opened, the focus should be on the To field.
+  let toInput = cwc.window.document.getElementById("toAddrInput");
+  Assert.equal(cwc.window.document.activeElement, toInput);
+
+  const modifiers =
+    AppConstants.platform == "macosx" ? { accelKey: true } : { ctrlKey: true };
+  const addresses = "person@org, foo@address.valid, invalid, foo@address";
+
+  // Test the To field.
+  test_deletion_and_focus_on_input(cwc, toInput, addresses, modifiers);
+
+  // Reveal and test the Cc field.
+  EventUtils.synthesizeMouseAtCenter(
+    cwc.window.document.getElementById("addr_cc"),
+    {},
+    cwc.window
+  );
+  test_deletion_and_focus_on_input(
+    cwc,
+    cwc.window.document.getElementById("ccAddrInput"),
+    addresses,
+    modifiers
+  );
+
+  // Reveal and test the Bcc field.
+  EventUtils.synthesizeMouseAtCenter(
+    cwc.window.document.getElementById("addr_bcc"),
+    {},
+    cwc.window
+  );
+  test_deletion_and_focus_on_input(
+    cwc,
+    cwc.window.document.getElementById("bccAddrInput"),
+    addresses,
+    modifiers
+  );
 
   close_compose_window(cwc);
 });
+
+function test_deletion_and_focus_on_input(cwc, input, addresses, modifiers) {
+  // Focus on the input before adding anything to be sure keyboard shortcut are
+  // triggered from the right element.
+  input.focus();
+
+  // Fill the input field with a long of string of comma separated addresses.
+  input.value = addresses;
+
+  // Enter triggers the pill creation.
+  EventUtils.synthesizeKey("VK_RETURN", {}, cwc.window);
+
+  let container = input.closest(".address-container");
+  // We should now have 4 pills.
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill").length,
+    4,
+    "All pills in the field have been created."
+  );
+
+  // One pill should be flagged as invalid.
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill.invalid-address").length,
+    1,
+    "One created pill is invalid."
+  );
+
+  // After pills creation, the same field should be still focused.
+  Assert.equal(cwc.window.document.activeElement, input);
+
+  // Keypress left arrow should focus and select the last created pill.
+  EventUtils.synthesizeKey("KEY_ArrowLeft", {}, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill[selected]").length,
+    1,
+    "One pill is currently selected."
+  );
+
+  // Pressing delete should delete the selected pill and move the focus back to
+  // the input.
+  EventUtils.synthesizeKey("KEY_Delete", {}, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill").length,
+    3,
+    "One pill correctly deleted."
+  );
+  Assert.equal(cwc.window.document.activeElement, input);
+
+  // Keypress left arrow to select the last available pill.
+  EventUtils.synthesizeKey("KEY_ArrowLeft", {}, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill[selected]").length,
+    1,
+    "One pill is currently selected."
+  );
+
+  // BackSpace should delete the pill and focus on the previous adjacent pill.
+  EventUtils.synthesizeKey("KEY_Backspace", {}, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill").length,
+    2,
+    "One pill correctly deleted."
+  );
+  let selectedPill = container.querySelector("mail-address-pill[selected]");
+  Assert.equal(cwc.window.document.activeElement, selectedPill);
+
+  // Pressing CTRL+A should select all pills.
+  EventUtils.synthesizeKey("a", modifiers, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill[selected]").length,
+    2,
+    "All remaining 2 pills are currently selected."
+  );
+
+  // BackSpace should delete all pills and focus on empty inptu field.
+  EventUtils.synthesizeKey("KEY_Backspace", {}, cwc.window);
+  Assert.equal(
+    container.querySelectorAll("mail-address-pill").length,
+    0,
+    "All pills have been deleted."
+  );
+  Assert.equal(cwc.window.document.activeElement, input);
+}