Remove jQuery .attr from the diff page (#30021)

- 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 <git@yardenshoham.com>
Co-authored-by: silverwind <me@silverwind.io>
(cherry picked from commit 74c1378dfb5f1831ca2bf1f0b18ab150134f4beb)
This commit is contained in:
Yarden Shoham 2024-03-23 14:37:18 +02:00 committed by Earl Warren
parent 08a9a61faf
commit d64b9757e8
No known key found for this signature in database
GPG key ID: 0579CB2928A78A00

View file

@ -13,16 +13,20 @@ import {POST, GET} from '../modules/fetch.js';
const {pageData, i18n} = window.config; const {pageData, i18n} = window.config;
function initRepoDiffReviewButton() { function initRepoDiffReviewButton() {
const $reviewBox = $('#review-box'); const reviewBox = document.getElementById('review-box');
const $counter = $reviewBox.find('.review-comments-counter'); if (!reviewBox) return;
const $reviewBox = $(reviewBox);
const counter = reviewBox.querySelector('.review-comments-counter');
if (!counter) return;
$(document).on('click', 'button[name="pending_review"]', (e) => { $(document).on('click', 'button[name="pending_review"]', (e) => {
const $form = $(e.target).closest('form'); const $form = $(e.target).closest('form');
// Watch for the form's submit event. // Watch for the form's submit event.
$form.on('submit', () => { $form.on('submit', () => {
const num = parseInt($counter.attr('data-pending-comment-number')) + 1 || 1; const num = parseInt(counter.getAttribute('data-pending-comment-number')) + 1 || 1;
$counter.attr('data-pending-comment-number', num); counter.setAttribute('data-pending-comment-number', num);
$counter.text(num); counter.textContent = num;
// Force the browser to reflow the DOM. This is to ensure that the browser replay the animation // Force the browser to reflow the DOM. This is to ensure that the browser replay the animation
$reviewBox.removeClass('pulse'); $reviewBox.removeClass('pulse');
$reviewBox.width(); $reviewBox.width();
@ -67,7 +71,7 @@ function initRepoDiffConversationForm() {
formData.append(submitter.name, submitter.value); 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 $newConversationHolder = $(await response.text());
const {path, side, idx} = $newConversationHolder.data(); const {path, side, idx} = $newConversationHolder.data();
@ -120,7 +124,7 @@ export function initRepoDiffConversationNav() {
const index = $conversations.index($conversation); const index = $conversations.index($conversation);
const previousIndex = index > 0 ? index - 1 : $conversations.length - 1; const previousIndex = index > 0 ? index - 1 : $conversations.length - 1;
const $previousConversation = $conversations.eq(previousIndex); 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}`; window.location.href = `#${anchor}`;
}); });
$(document).on('click', '.next-conversation', (e) => { $(document).on('click', '.next-conversation', (e) => {
@ -129,7 +133,7 @@ export function initRepoDiffConversationNav() {
const index = $conversations.index($conversation); const index = $conversations.index($conversation);
const nextIndex = index < $conversations.length - 1 ? index + 1 : 0; const nextIndex = index < $conversations.length - 1 ? index + 1 : 0;
const $nextConversation = $conversations.eq(nextIndex); 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}`; window.location.href = `#${anchor}`;
}); });
} }
@ -175,8 +179,7 @@ function initRepoDiffShowMore() {
$(document).on('click', 'a#diff-show-more-files', (e) => { $(document).on('click', 'a#diff-show-more-files', (e) => {
e.preventDefault(); e.preventDefault();
const $target = $(e.target); const linkLoadMore = e.target.getAttribute('data-href');
const linkLoadMore = $target.attr('data-href');
loadMoreFiles(linkLoadMore); loadMoreFiles(linkLoadMore);
}); });