From fd281518aecb85be4984ad31a90698a2386d62a5 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Sat, 4 Jan 2025 05:50:39 +0800
Subject: [PATCH] Fix line-number and scroll bugs (#33094) (#33095)

Partially backport #33094

Fix the scroll bug in issue/pr view page.

Fix a JS error when line number exceeds the max
---
 web_src/css/base.css              |  1 +
 web_src/js/features/repo-code.ts  |  2 +-
 web_src/js/features/repo-issue.ts | 22 +++++-----------------
 3 files changed, 7 insertions(+), 18 deletions(-)

diff --git a/web_src/css/base.css b/web_src/css/base.css
index 04f3678f3a..a0bfefebf5 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -693,6 +693,7 @@ input:-webkit-autofill:active,
 
 .ui.dropdown .menu > .header {
   font-size: 0.8em;
+  text-transform: none; /* reset fomantic's "uppercase" */
 }
 
 .ui .text.left {
diff --git a/web_src/js/features/repo-code.ts b/web_src/js/features/repo-code.ts
index a8d6e8f97d..7b5b348db5 100644
--- a/web_src/js/features/repo-code.ts
+++ b/web_src/js/features/repo-code.ts
@@ -59,7 +59,7 @@ function selectRange($linesEls, $selectionEndEl, $selectionStartEls?) {
     copyPermalink.setAttribute('data-url', link);
   };
 
-  if ($selectionStartEls) {
+  if ($selectionStartEls && $selectionStartEls[0]) {
     let a = parseInt($selectionEndEl[0].getAttribute('rel').slice(1));
     let b = parseInt($selectionStartEls[0].getAttribute('rel').slice(1));
     let c;
diff --git a/web_src/js/features/repo-issue.ts b/web_src/js/features/repo-issue.ts
index 7541039786..39eff21347 100644
--- a/web_src/js/features/repo-issue.ts
+++ b/web_src/js/features/repo-issue.ts
@@ -371,10 +371,6 @@ export async function handleReply(el) {
 
 export function initRepoPullRequestReview() {
   if (window.location.hash && window.location.hash.startsWith('#issuecomment-')) {
-    // set scrollRestoration to 'manual' when there is a hash in url, so that the scroll position will not be remembered after refreshing
-    if (window.history.scrollRestoration !== 'manual') {
-      window.history.scrollRestoration = 'manual';
-    }
     const commentDiv = document.querySelector(window.location.hash);
     if (commentDiv) {
       // get the name of the parent id
@@ -382,14 +378,6 @@ export function initRepoPullRequestReview() {
       if (groupID && groupID.startsWith('code-comments-')) {
         const id = groupID.slice(14);
         const ancestorDiffBox = commentDiv.closest('.diff-file-box');
-        // on pages like conversation, there is no diff header
-        const diffHeader = ancestorDiffBox?.querySelector('.diff-file-header');
-
-        // offset is for scrolling
-        let offset = 30;
-        if (diffHeader) {
-          offset += $('.diff-detail-box').outerHeight() + $(diffHeader).outerHeight();
-        }
 
         hideElem(`#show-outdated-${id}`);
         showElem(`#code-comments-${id}, #code-preview-${id}, #hide-outdated-${id}`);
@@ -397,12 +385,12 @@ export function initRepoPullRequestReview() {
         if (ancestorDiffBox?.getAttribute('data-folded') === 'true') {
           setFileFolding(ancestorDiffBox, ancestorDiffBox.querySelector('.fold-file'), false);
         }
-
-        window.scrollTo({
-          top: $(commentDiv).offset().top - offset,
-          behavior: 'instant',
-        });
       }
+
+      // set scrollRestoration to 'manual' when there is a hash in url, so that the scroll position will not be remembered after refreshing
+      if (window.history.scrollRestoration !== 'manual') window.history.scrollRestoration = 'manual';
+      // wait for a while because some elements (eg: image, editor, etc.) may change the viewport's height.
+      setTimeout(() => commentDiv.scrollIntoView({block: 'start'}), 100);
     }
   }