From 9b12e972b8cc06f159a82d3a477147471a291e8b Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Sat, 23 Mar 2024 10:44:54 +0000 Subject: [PATCH 1/3] Remove jQuery `.attr` from the diff page - Switched from jQuery `.attr` to plain javascript `getAttribute` and `setAttribute` - Tested the review box counter and Previous/Next code review conversation buttons. They work as before Signed-off-by: Yarden Shoham --- web_src/js/features/repo-diff.js | 24 ++++++++++++++---------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/web_src/js/features/repo-diff.js b/web_src/js/features/repo-diff.js index 20a65779326fc..5b6b875c4afc7 100644 --- a/web_src/js/features/repo-diff.js +++ b/web_src/js/features/repo-diff.js @@ -13,16 +13,21 @@ import {POST, GET} from '../modules/fetch.js'; const {pageData, i18n} = window.config; function initRepoDiffReviewButton() { - const $reviewBox = $('#review-box'); - const $counter = $reviewBox.find('.review-comments-counter'); + const reviewBox = document.getElementById('review-box'); + if (!reviewBox) return; + + const $reviewBox = $(reviewBox); + const counters = reviewBox.getElementsByClassName('review-comments-counter'); + if (!counters.length) return; + const counter = counters[0]; $(document).on('click', 'button[name="pending_review"]', (e) => { const $form = $(e.target).closest('form'); // Watch for the form's submit event. $form.on('submit', () => { - const num = parseInt($counter.attr('data-pending-comment-number')) + 1 || 1; - $counter.attr('data-pending-comment-number', num); - $counter.text(num); + const num = parseInt(counter.getAttribute('data-pending-comment-number')) + 1 || 1; + counter.setAttribute('data-pending-comment-number', num); + counter.textContent = num; // Force the browser to reflow the DOM. This is to ensure that the browser replay the animation $reviewBox.removeClass('pulse'); $reviewBox.width(); @@ -65,7 +70,7 @@ function initRepoDiffConversationForm() { formData.append(submitter.name, submitter.value); } - const response = await POST($form.attr('action'), {data: formData}); + const response = await POST(e.target.getAttribute('action'), {data: formData}); const $newConversationHolder = $(await response.text()); const {path, side, idx} = $newConversationHolder.data(); @@ -118,7 +123,7 @@ export function initRepoDiffConversationNav() { const index = $conversations.index($conversation); const previousIndex = index > 0 ? index - 1 : $conversations.length - 1; const $previousConversation = $conversations.eq(previousIndex); - const anchor = $previousConversation.find('.comment').first().attr('id'); + const anchor = $previousConversation.find('.comment').first()[0].getAttribute('id'); window.location.href = `#${anchor}`; }); $(document).on('click', '.next-conversation', (e) => { @@ -127,7 +132,7 @@ export function initRepoDiffConversationNav() { const index = $conversations.index($conversation); const nextIndex = index < $conversations.length - 1 ? index + 1 : 0; const $nextConversation = $conversations.eq(nextIndex); - const anchor = $nextConversation.find('.comment').first().attr('id'); + const anchor = $nextConversation.find('.comment').first()[0].getAttribute('id'); window.location.href = `#${anchor}`; }); } @@ -173,8 +178,7 @@ function initRepoDiffShowMore() { $(document).on('click', 'a#diff-show-more-files', (e) => { e.preventDefault(); - const $target = $(e.target); - const linkLoadMore = $target.attr('data-href'); + const linkLoadMore = e.target.getAttribute('data-href'); loadMoreFiles(linkLoadMore); }); From 7b5aa9ec31cac1feba66f5eb32bd29467dfd7847 Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Sat, 23 Mar 2024 13:26:32 +0200 Subject: [PATCH 2/3] Update web_src/js/features/repo-diff.js Co-authored-by: silverwind --- web_src/js/features/repo-diff.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/web_src/js/features/repo-diff.js b/web_src/js/features/repo-diff.js index 5b6b875c4afc7..1b2c1943471a2 100644 --- a/web_src/js/features/repo-diff.js +++ b/web_src/js/features/repo-diff.js @@ -17,9 +17,8 @@ function initRepoDiffReviewButton() { if (!reviewBox) return; const $reviewBox = $(reviewBox); - const counters = reviewBox.getElementsByClassName('review-comments-counter'); - if (!counters.length) return; - const counter = counters[0]; + const counter = reviewBox.querySelector('.review-comments-counter'); + if (!counters) return; $(document).on('click', 'button[name="pending_review"]', (e) => { const $form = $(e.target).closest('form'); From 34a37624759d75960ba8ee3e2a8a93261ef580db Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Sat, 23 Mar 2024 13:26:56 +0200 Subject: [PATCH 3/3] Update web_src/js/features/repo-diff.js --- web_src/js/features/repo-diff.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web_src/js/features/repo-diff.js b/web_src/js/features/repo-diff.js index 1b2c1943471a2..262ce2abffd1b 100644 --- a/web_src/js/features/repo-diff.js +++ b/web_src/js/features/repo-diff.js @@ -18,7 +18,7 @@ function initRepoDiffReviewButton() { const $reviewBox = $(reviewBox); const counter = reviewBox.querySelector('.review-comments-counter'); - if (!counters) return; + if (!counter) return; $(document).on('click', 'button[name="pending_review"]', (e) => { const $form = $(e.target).closest('form');