feat(popover): Escape key should close open popovers. (#5726)

* feat(popover): Escape key should close open popovers.

* add test

src/components/popover/PopoverManager.ts

@@ -68,12 +68,20 @@ export default class PopoverManager {
       .forEach((popover) => popover.toggle(false));
   };
 
+  private closeAllPopovers(): void {
+    Array.from(this.registeredElements.values()).forEach((popover) => popover.toggle(false));
+  }
+
   private keyHandler = (event: KeyboardEvent): void => {
-    if (event.defaultPrevented || !isActivationKey(event.key)) {
+    if (event.defaultPrevented) {
       return;
     }
 
-    this.togglePopovers(event);
+    if (event.key === "Escape") {
+      this.closeAllPopovers();
+    } else if (isActivationKey(event.key)) {
+      this.togglePopovers(event);
+    }
   };
 
   private clickHandler = (event: PointerEvent): void => {

src/components/popover/popover.e2e.ts

@@ -734,4 +734,35 @@ describe("calcite-popover", () => {
 
     expect(await popover.isVisible()).toBe(true);
   });
+
+  it("should close popovers with ESC key", async () => {
+    const page = await newE2EPage();
+
+    await page.setContent(
+      html`
+        <calcite-popover reference-element="ref">Content</calcite-popover>
+        <button id="ref">Button</button>
+      `
+    );
+
+    await page.waitForChanges();
+
+    const popover = await page.find("calcite-popover");
+
+    expect(await popover.getProperty("open")).toBe(false);
+
+    const referenceElement = await page.find("#ref");
+
+    await referenceElement.click();
+
+    await page.waitForChanges();
+
+    expect(await popover.getProperty("open")).toBe(true);
+
+    await referenceElement.press("Escape");
+
+    await page.waitForChanges();
+
+    expect(await popover.getProperty("open")).toBe(false);
+  });
 });