[Editor] Unselect highlight editor when pressing Escape when the focus is on the color picker without a dropdown menu

src/display/editor/color_picker.js

@@ -34,6 +34,8 @@ class ColorPicker {
 
   #isMainColorPicker = false;
 
+  #editor = null;
+
   #eventBus;
 
   #uiManager = null;
@@ -68,6 +70,7 @@ class ColorPicker {
     if (editor) {
       this.#isMainColorPicker = false;
       this.#type = AnnotationEditorParamsType.HIGHLIGHT_COLOR;
+      this.#editor = editor;
     } else {
       this.#isMainColorPicker = true;
       this.#type = AnnotationEditorParamsType.HIGHLIGHT_DEFAULT_COLOR;
@@ -233,7 +236,13 @@ class ColorPicker {
   }
 
   _hideDropdownFromKeyboard() {
-    if (this.#isMainColorPicker || !this.#isDropdownVisible) {
+    if (this.#isMainColorPicker) {
+      return;
+    }
+    if (!this.#isDropdownVisible) {
+      // The user pressed Escape with no dropdown visible, so we must
+      // unselect it.
+      this.#editor?.unselect();
       return;
     }
     this.hideDropdown();

test/integration/highlight_editor_spec.mjs

@@ -1366,4 +1366,36 @@ describe("Highlight Editor", () => {
       );
     });
   });
+
+  describe("Editor must be unselected when the color picker is Escaped", () => {
+    let pages;
+
+    beforeAll(async () => {
+      pages = await loadAndWait("tracemonkey.pdf", ".annotationEditorLayer");
+    });
+
+    afterAll(async () => {
+      await closePages(pages);
+    });
+
+    it("must check that the highlight editor is unselected", async () => {
+      await Promise.all(
+        pages.map(async ([browserName, page]) => {
+          await page.click("#editorHighlight");
+          await page.waitForSelector(".annotationEditorLayer.highlightEditing");
+
+          const rect = await getSpanRectFromText(page, 1, "Abstract");
+          const x = rect.x + rect.width / 2;
+          const y = rect.y + rect.height / 2;
+          await page.mouse.click(x, y, { count: 2, delay: 100 });
+
+          await page.waitForSelector(getEditorSelector(0));
+          await page.focus(`${getEditorSelector(0)} button.colorPicker`);
+
+          await page.keyboard.press("Escape");
+          await page.focus(`${getEditorSelector(0)}:not(selectedEditor)`);
+        })
+      );
+    });
+  });
 });