🎨 fix https://github.com/siyuan-note/siyuan/issues/7538

app/src/editor/util.ts

@@ -19,7 +19,6 @@ import {pushBack} from "../util/backForward";
 import {Asset} from "../asset";
 import {Layout} from "../layout";
 import {hasClosestBlock, hasClosestByAttribute, hasClosestByClassName,} from "../protyle/util/hasClosest";
-import {getPreviousHeading} from "../protyle/wysiwyg/getBlock";
 import {lockFile, setTitle} from "../dialog/processSystem";
 import {zoomOut} from "../menus/protyle";
 import {countBlockWord, countSelectWord} from "../layout/status";
@@ -417,14 +416,7 @@ const updateOutline = (models: IModels, protyle: IProtyle, reload = false) => {
                         if (protyle.wysiwyg.element.contains(startContainer)) {
                             const currentElement = hasClosestByAttribute(startContainer, "data-node-id", null);
                             if (currentElement) {
-                                if (currentElement.getAttribute("data-type") === "NodeHeading") {
+                                item.setCurrent(currentElement);
-                                    item.setCurrent(currentElement.getAttribute("data-node-id"));
-                                } else {
-                                    const headingElement = getPreviousHeading(currentElement);
-                                    if (headingElement) {
-                                        item.setCurrent(headingElement.getAttribute("data-node-id"));
-                                    }
-                                }
                             }
                         }
                     }

app/src/layout/dock/Outline.ts

@@ -11,6 +11,7 @@ import {Constants} from "../../constants";
 import {escapeHtml} from "../../util/escape";
 import {unicode2Emoji} from "../../emoji";
 import {onGet} from "../../protyle/util/onGet";
+import {getPreviousBlock} from "../../protyle/wysiwyg/getBlock";
 
 export class Outline extends Model {
     public tree: Tree;
@@ -110,7 +111,9 @@ export class Outline extends Model {
         options.tab.panelElement.querySelector('[data-type="collapse"]').addEventListener("click", () => {
             this.tree.collapseAll();
         });
-        options.tab.panelElement.querySelector('[data-type="expand"]').addEventListener("click", (event: MouseEvent & { target: Element }) => {
+        options.tab.panelElement.querySelector('[data-type="expand"]').addEventListener("click", (event: MouseEvent & {
+            target: Element
+        }) => {
             const iconElement = hasClosestByClassName(event.target, "block__icon");
             if (!iconElement) {
                 return;
@@ -215,7 +218,37 @@ export class Outline extends Model {
         }
     }
 
-    public setCurrent(id: string) {
+    public setCurrent(nodeElement: HTMLElement) {
+        if (nodeElement.getAttribute("data-type") === "NodeHeading") {
+            this.setCurrentById(nodeElement.getAttribute("data-node-id"))
+        } else {
+            let previousElement = getPreviousBlock(nodeElement);
+            while (previousElement) {
+                if (previousElement.getAttribute("data-type") === "NodeHeading") {
+                    break;
+                } else {
+                    previousElement = getPreviousBlock(previousElement);
+                }
+            }
+            if (previousElement) {
+                this.setCurrentById(previousElement.getAttribute("data-node-id"))
+            } else {
+                fetchPost("/api/block/getBlockBreadcrumb", {
+                    id: nodeElement.getAttribute("data-node-id"),
+                    excludeTypes: []
+                }, (response) => {
+                    response.data.reverse().find((item: IBreadcrumb) => {
+                        if (item.type === "NodeHeading") {
+                            this.setCurrentById(item.id);
+                            return true;
+                        }
+                    });
+                });
+            }
+        }
+    }
+
+    private setCurrentById(id: string) {
         this.element.querySelectorAll(".b3-list-item.b3-list-item--focus").forEach(item => {
             item.classList.remove("b3-list-item--focus");
         });

app/src/protyle/wysiwyg/getBlock.ts

@@ -1,18 +1,6 @@
 import {hasClosestBlock, hasClosestByAttribute} from "../util/hasClosest";
 import {Constants} from "../../constants";
 
-export const getPreviousHeading = (element: Element) => {
-    let previous = getPreviousBlock(element);
-    while (previous) {
-        if (previous.getAttribute("data-type") === "NodeHeading") {
-            break;
-        } else {
-            previous = getPreviousBlock(previous);
-        }
-    }
-    return previous;
-};
-
 export const getPreviousBlock = (element: Element) => {
     let parentElement = element;
     while (parentElement) {

app/src/protyle/wysiwyg/index.ts

@@ -28,7 +28,6 @@ import {
     getContenteditableElement,
     getLastBlock,
     getNextBlock,
-    getPreviousHeading,
     getTopAloneElement,
     hasNextSibling,
     hasPreviousSibling,
@@ -175,16 +174,7 @@ export class WYSIWYG {
         if (protyle.model) {
             getAllModels().outline.forEach(item => {
                 if (item.blockId === protyle.block.rootID) {
-                    if (nodeElement.getAttribute("data-type") === "NodeHeading") {
+                    item.setCurrent(nodeElement)
-                        item.setCurrent(nodeElement.getAttribute("data-node-id"));
-                        return;
-                    }
-                    const headingElement = getPreviousHeading(nodeElement);
-                    if (headingElement) {
-                        item.setCurrent(headingElement.getAttribute("data-node-id"));
-                        return;
-                    }
-                    item.setCurrent("");
                 }
             });
         }