fix: fix focus fighting in textarea again

OI-wiki · Sep 28, 2024 · 2813f27 · 2813f27
1 parent 25e5963
commit 2813f27
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 12 deletions.
diff --git a/frontend/lib/dom/comment.ts b/frontend/lib/dom/comment.ts
@@ -47,7 +47,7 @@ export const handleAnchor = async () => {
 
   await selectOffsetParagraph({
     el: paragraph,
-    focusReply: true,
+    forceOpenCommentsPanel: true,
   });
 
   const commentEl = document.querySelector<HTMLDivElement>(
@@ -112,20 +112,21 @@ export const registerDialog = ({
 
 export const selectOffsetParagraph = async ({
   el,
-  focusReply = false,
+  forceOpenCommentsPanel = false,
 }: {
   el: HTMLElement;
-  focusReply?: boolean;
+  forceOpenCommentsPanel?: boolean;
 }) => {
   if (selectedOffset !== el) {
     delete selectedOffset?.dataset.reviewSelected;
     selectedOffset = el;
   }
 
-  if (selectedOffset?.dataset.reviewHasComments || focusReply) {
+  if (selectedOffset?.dataset.reviewHasComments || forceOpenCommentsPanel) {
     delete selectedOffset.dataset.reviewFocused;
     selectedOffset.dataset.reviewSelected = "true";
-    await openCommentsPanel();
+    // 只有在点击评论按钮时才会 focus 到评论框，这里 forceOpenCommentsPanel === true 就等价于点击评论按钮
+    await openCommentsPanel(forceOpenCommentsPanel);
   }
 };
 
@@ -134,7 +135,7 @@ export const unselectOffsetParagraph = () => {
   selectedOffset = null;
 };
 
-export const openCommentsPanel = async () => {
+export const openCommentsPanel = async (focusTextarea: boolean = true) => {
   const comments = [...(await fetchComments())];
 
   const selected = selectedOffset;
@@ -177,11 +178,12 @@ export const openCommentsPanel = async () => {
     behavior: "smooth",
     block: "start",
   });
-  const textarea = selectedCommentsGroup?.querySelector(
-    ".comment_actions_panel textarea",
-  ) as HTMLTextAreaElement | undefined;
-  textarea?.focus();
-
+  if (focusTextarea) {
+    const textarea = selectedCommentsGroup?.querySelector(
+      ".comment_actions_panel textarea",
+    ) as HTMLTextAreaElement | undefined;
+    textarea?.focus();
+  }
   commentsButton.classList.add("review_hidden");
   commentsPanel.classList.remove("review_hidden");
 };

diff --git a/frontend/lib/dom/ctx_menu.ts b/frontend/lib/dom/ctx_menu.ts
@@ -18,7 +18,7 @@ export const createContextMenu = ({ el }: { el: HTMLElement }) => {
         () => {
           selectOffsetParagraph({
             el,
-            focusReply: true,
+            forceOpenCommentsPanel: true,
           });
         },
       ],
-Original file line number
+Diff line change
@@ Expand Up @@
             () => {
               selectOffsetParagraph({
                 el,
-                focusReply: true,
+                forceOpenCommentsPanel: true,
               });
             },
           ],
@@ Expand Down @@