diff --git a/ts/components/stickers/StickerButton.tsx b/ts/components/stickers/StickerButton.tsx index 242494b82c..353a93131f 100644 --- a/ts/components/stickers/StickerButton.tsx +++ b/ts/components/stickers/StickerButton.tsx @@ -116,7 +116,18 @@ export const StickerButton = React.memo( setPopperRoot(root); document.body.appendChild(root); const handleOutsideClick = ({ target }: MouseEvent) => { - if (!root.contains(target as Node)) { + const targetElement = target as HTMLElement; + const className = targetElement + ? targetElement.className || '' + : ''; + + // We need to special-case sticker picker header buttons, because they can + // disappear after being clicked, which breaks the .contains() check below. + const isMissingButtonClass = + !className || + className.indexOf('module-sticker-picker__header__button') < 0; + + if (!root.contains(targetElement) && isMissingButtonClass) { setOpen(false); } };