From 2e4fe7891ad01661ab211ededc2dff845d929093 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Tue, 7 Dec 2021 09:36:28 +0000
Subject: [PATCH] Fix input field behaviour inside context menus (#7293)
---
src/components/structures/ContextMenu.tsx | 4 ++++
src/components/structures/LoggedInView.tsx | 2 +-
2 files changed, 5 insertions(+), 1 deletion(-)
diff --git a/src/components/structures/ContextMenu.tsx b/src/components/structures/ContextMenu.tsx
index 84af76e282..6c8a56e942 100644
--- a/src/components/structures/ContextMenu.tsx
+++ b/src/components/structures/ContextMenu.tsx
@@ -25,6 +25,7 @@ import { Key } from "../../Keyboard";
import { Writeable } from "../../@types/common";
import { replaceableComponent } from "../../utils/replaceableComponent";
import UIStore from "../../stores/UIStore";
+import { getInputableElement } from "./LoggedInView";
// Shamelessly ripped off Modal.js. There's probably a better way
// of doing reusable widgets like dialog boxes & menus where we go and
@@ -248,6 +249,9 @@ export default class ContextMenu extends React.PureComponent<IProps, IState> {
return;
}
+ // only handle escape when in an input field
+ if (ev.key !== Key.ESCAPE && getInputableElement(ev.target as HTMLElement)) return;
+
let handled = true;
switch (ev.key) {
diff --git a/src/components/structures/LoggedInView.tsx b/src/components/structures/LoggedInView.tsx
index e19725ff60..9ba642c8a4 100644
--- a/src/components/structures/LoggedInView.tsx
+++ b/src/components/structures/LoggedInView.tsx
@@ -73,7 +73,7 @@ import LegacyCommunityPreview from "./LegacyCommunityPreview";
// NB. this is just for server notices rather than pinned messages in general.
const MAX_PINNED_NOTICES_PER_ROOM = 2;
-function getInputableElement(el: HTMLElement): HTMLElement | null {
+export function getInputableElement(el: HTMLElement): HTMLElement | null {
return el.closest("input, textarea, select, [contenteditable=true]");
}