From cf6af2bc6c1396c38837c448aac8e38b29c7d163 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Sat, 23 Dec 2023 23:08:08 +0800
Subject: [PATCH] fix

---
 web_src/js/features/comp/TextExpander.js | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/web_src/js/features/comp/TextExpander.js b/web_src/js/features/comp/TextExpander.js
index 128a2ddff0e4d..1f6992096224d 100644
--- a/web_src/js/features/comp/TextExpander.js
+++ b/web_src/js/features/comp/TextExpander.js
@@ -1,6 +1,17 @@
 import {matchEmoji, matchMention} from '../../utils/match.js';
 import {emojiString} from '../emoji.js';
 
+function userFriendlyScrollBehavior(el) {
+  // the TextExpander uses ComboboxNav, which uses scrollIntoView to scroll to the selected item.
+  // but their default behavior uses undefined (aka "start"), which annoys the end users a lot.
+  // if upstream could fix it, our code could be removed then. https://github.com/github/text-expander-element/issues/50
+  const oldScrollIntoView = el.scrollIntoView;
+  el.scrollIntoView = function (opts) {
+    opts = opts || {block: 'nearest', inline: 'nearest'};
+    oldScrollIntoView.call(this, opts);
+  };
+}
+
 export function initTextExpander(expander) {
   expander?.addEventListener('text-expander-change', ({detail: {key, provide, text}}) => {
     if (key === ':') {
@@ -15,6 +26,7 @@ export function initTextExpander(expander) {
         li.setAttribute('role', 'option');
         li.setAttribute('data-value', emoji);
         li.textContent = `${emoji} ${name}`;
+        userFriendlyScrollBehavior(li);
         ul.append(li);
       }
 
@@ -45,6 +57,7 @@ export function initTextExpander(expander) {
           li.append(fullnameSpan);
         }
 
+        userFriendlyScrollBehavior(li);
         ul.append(li);
       }