From 9968139b6bf2afc567f82d2d830efcd953b10a90 Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Sat, 23 Mar 2024 20:18:45 +0200 Subject: [PATCH] Remove jQuery from the issue "go to" button (#30028) - Switched to plain JavaScript - Tested the "go to" button functionality and it works as before ![demo](https://github.com/go-gitea/gitea/assets/20454870/76add18f-3294-4117-98b7-a97f576370e2) Signed-off-by: Yarden Shoham (cherry picked from commit d9e33959b38d1463f69f6f8807bc50095cf6dbdb) Conflicts: web_src/js/features/common-issue-list.js because "Make submit event code work with both jQuery event and native event (#29223)" was not cherry-picked. The change it introduced in this file is reverted by this commit so it does not matter. --- web_src/js/features/common-issue-list.js | 33 +++++++++++------------- 1 file changed, 15 insertions(+), 18 deletions(-) diff --git a/web_src/js/features/common-issue-list.js b/web_src/js/features/common-issue-list.js index 317c11219b..0c0f6c563d 100644 --- a/web_src/js/features/common-issue-list.js +++ b/web_src/js/features/common-issue-list.js @@ -1,4 +1,3 @@ -import $ from 'jquery'; import {isElemHidden, onInputDebounce, submitEventSubmitter, toggleElem} from '../utils/dom.js'; import {GET} from '../modules/fetch.js'; @@ -30,42 +29,40 @@ export function parseIssueListQuickGotoLink(repoLink, searchText) { } export function initCommonIssueListQuickGoto() { - const $goto = $('#issue-list-quick-goto'); - if (!$goto.length) return; + const goto = document.getElementById('issue-list-quick-goto'); + if (!goto) return; - const $form = $goto.closest('form'); - const $input = $form.find('input[name=q]'); - const repoLink = $goto.attr('data-repo-link'); + const form = goto.closest('form'); + const input = form.querySelector('input[name=q]'); + const repoLink = goto.getAttribute('data-repo-link'); - $form.on('submit', (e) => { + form.addEventListener('submit', (e) => { // if there is no goto button, or the form is submitted by non-quick-goto elements, submit the form directly - let doQuickGoto = !isElemHidden($goto); - const submitter = submitEventSubmitter(e.originalEvent); - if (submitter !== $form[0] && submitter !== $input[0] && submitter !== $goto[0]) doQuickGoto = false; + let doQuickGoto = !isElemHidden(goto); + const submitter = submitEventSubmitter(e); + if (submitter !== form && submitter !== input && submitter !== goto) doQuickGoto = false; if (!doQuickGoto) return; // if there is a goto button, use its link e.preventDefault(); - window.location.href = $goto.attr('data-issue-goto-link'); + window.location.href = goto.getAttribute('data-issue-goto-link'); }); const onInput = async () => { - const searchText = $input.val(); - + const searchText = input.value; // try to check whether the parsed goto link is valid let targetUrl = parseIssueListQuickGotoLink(repoLink, searchText); if (targetUrl) { const res = await GET(`${targetUrl}/info`); if (res.status !== 200) targetUrl = ''; } - // if the input value has changed, then ignore the result - if ($input.val() !== searchText) return; + if (input.value !== searchText) return; - toggleElem($goto, Boolean(targetUrl)); - $goto.attr('data-issue-goto-link', targetUrl); + toggleElem(goto, Boolean(targetUrl)); + goto.setAttribute('data-issue-goto-link', targetUrl); }; - $input.on('input', onInputDebounce(onInput)); + input.addEventListener('input', onInputDebounce(onInput)); onInput(); }