From cee6d444d76ca92a10305c1061dbe25ad0e293ed Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Fri, 17 Jan 2025 18:16:55 +0800
Subject: [PATCH] :art: https://github.com/siyuan-note/siyuan/issues/13826

---
 app/src/search/util.ts | 22 ++++++++++++++++------
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/app/src/search/util.ts b/app/src/search/util.ts
index 193abeccc..d4dd5e50a 100644
--- a/app/src/search/util.ts
+++ b/app/src/search/util.ts
@@ -1105,15 +1105,25 @@ export const getArticle = (options: {
                 const contentRect = options.edit.protyle.contentElement.getBoundingClientRect();
                 if (isSupportCSSHL()) {
                     searchMarkRender(options.edit.protyle, getResponse.data.keywords, options.id, () => {
-                        if (options.edit.protyle.highlight.ranges.length > 0 && options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex]) {
-                            if (!options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex].toString()) {
-                                highlightById(options.edit.protyle, options.id);
+                        const highlightKeys = () => {
+                            if (options.edit.protyle.highlight.ranges.length > 0 && options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex]) {
+                                if (!options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex].toString()) {
+                                    highlightById(options.edit.protyle, options.id);
+                                } else {
+                                    options.edit.protyle.contentElement.scrollTop = options.edit.protyle.contentElement.scrollTop + options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex].getBoundingClientRect().top - contentRect.top - contentRect.height / 2;
+                                }
                             } else {
-                                options.edit.protyle.contentElement.scrollTop = options.edit.protyle.contentElement.scrollTop + options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex].getBoundingClientRect().top - contentRect.top - contentRect.height / 2;
+                                highlightById(options.edit.protyle, options.id);
                             }
-                        } else {
-                            highlightById(options.edit.protyle, options.id);
                         }
+                        highlightKeys();
+                        const observer = new ResizeObserver(() => {
+                            highlightKeys();
+                        });
+                        observer.observe(options.edit.protyle.wysiwyg.element);
+                        setTimeout(() => {
+                            observer.disconnect();
+                        }, Constants.TIMEOUT_COUNT);
                     });
                 } else {
                     const matchElements = options.edit.protyle.wysiwyg.element.querySelectorAll('span[data-type~="search-mark"]');