Skip to content

Commit 5687aca

Browse files
yardenshohamsilverwindGiteaBot
authored
Remove jQuery .attr from the code comments (#30112)
- Switched from jQuery `attr` to plain javascript `getAttribute` - Tested the code comments and they work as before --------- Signed-off-by: Yarden Shoham <[email protected]> Co-authored-by: silverwind <[email protected]> Co-authored-by: Giteabot <[email protected]>
1 parent a1f11e2 commit 5687aca

File tree

1 file changed

+71
-60
lines changed

1 file changed

+71
-60
lines changed

web_src/js/features/repo-legacy.js

Lines changed: 71 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,11 @@ export function initRepoCommentForm() {
7474
}
7575

7676
if (editMode === 'true') {
77-
const $form = $('#update_issueref_form');
77+
const form = document.getElementById('update_issueref_form');
7878
const params = new URLSearchParams();
7979
params.append('ref', selectedValue);
8080
try {
81-
await POST($form.attr('action'), {data: params});
81+
await POST(form.getAttribute('action'), {data: params});
8282
window.location.reload();
8383
} catch (error) {
8484
console.error(error);
@@ -138,12 +138,12 @@ export function initRepoCommentForm() {
138138
hasUpdateAction = $listMenu.data('action') === 'update'; // Update the var
139139

140140
const clickedItem = this; // eslint-disable-line unicorn/no-this-assignment
141-
const scope = $(this).attr('data-scope');
141+
const scope = this.getAttribute('data-scope');
142142

143143
$(this).parent().find('.item').each(function () {
144144
if (scope) {
145145
// Enable only clicked item for scoped labels
146-
if ($(this).attr('data-scope') !== scope) {
146+
if (this.getAttribute('data-scope') !== scope) {
147147
return true;
148148
}
149149
if (this !== clickedItem && !$(this).hasClass('checked')) {
@@ -319,29 +319,32 @@ export function initRepoCommentForm() {
319319
async function onEditContent(event) {
320320
event.preventDefault();
321321

322-
const $segment = $(this).closest('.header').next();
323-
const $editContentZone = $segment.find('.edit-content-zone');
324-
const $renderContent = $segment.find('.render-content');
325-
const $rawContent = $segment.find('.raw-content');
322+
const segment = this.closest('.header').nextElementSibling;
323+
const editContentZone = segment.querySelector('.edit-content-zone');
324+
const renderContent = segment.querySelector('.render-content');
325+
const rawContent = segment.querySelector('.raw-content');
326326

327327
let comboMarkdownEditor;
328328

329-
const setupDropzone = async ($dropzone) => {
330-
if (!$dropzone.length) return null;
329+
/**
330+
* @param {HTMLElement} dropzone
331+
*/
332+
const setupDropzone = async (dropzone) => {
333+
if (!dropzone) return null;
331334

332335
let disableRemovedfileEvent = false; // when resetting the dropzone (removeAllFiles), disable the "removedfile" event
333336
let fileUuidDict = {}; // to record: if a comment has been saved, then the uploaded files won't be deleted from server when clicking the Remove in the dropzone
334-
const dz = await createDropzone($dropzone[0], {
335-
url: $dropzone.attr('data-upload-url'),
337+
const dz = await createDropzone(dropzone, {
338+
url: dropzone.getAttribute('data-upload-url'),
336339
headers: {'X-Csrf-Token': csrfToken},
337-
maxFiles: $dropzone.attr('data-max-file'),
338-
maxFilesize: $dropzone.attr('data-max-size'),
339-
acceptedFiles: (['*/*', ''].includes($dropzone.attr('data-accepts'))) ? null : $dropzone.attr('data-accepts'),
340+
maxFiles: dropzone.getAttribute('data-max-file'),
341+
maxFilesize: dropzone.getAttribute('data-max-size'),
342+
acceptedFiles: ['*/*', ''].includes(dropzone.getAttribute('data-accepts')) ? null : dropzone.getAttribute('data-accepts'),
340343
addRemoveLinks: true,
341-
dictDefaultMessage: $dropzone.attr('data-default-message'),
342-
dictInvalidFileType: $dropzone.attr('data-invalid-input-type'),
343-
dictFileTooBig: $dropzone.attr('data-file-too-big'),
344-
dictRemoveFile: $dropzone.attr('data-remove-file'),
344+
dictDefaultMessage: dropzone.getAttribute('data-default-message'),
345+
dictInvalidFileType: dropzone.getAttribute('data-invalid-input-type'),
346+
dictFileTooBig: dropzone.getAttribute('data-file-too-big'),
347+
dictRemoveFile: dropzone.getAttribute('data-remove-file'),
345348
timeout: 0,
346349
thumbnailMethod: 'contain',
347350
thumbnailWidth: 480,
@@ -350,46 +353,54 @@ async function onEditContent(event) {
350353
this.on('success', (file, data) => {
351354
file.uuid = data.uuid;
352355
fileUuidDict[file.uuid] = {submitted: false};
353-
const $input = $(`<input id="${data.uuid}" name="files" type="hidden">`).val(data.uuid);
354-
$dropzone.find('.files').append($input);
356+
const input = document.createElement('input');
357+
input.id = data.uuid;
358+
input.name = 'files';
359+
input.type = 'hidden';
360+
input.value = data.uuid;
361+
dropzone.querySelector('.files').insertAdjacentHTML('beforeend', input.outerHTML);
355362
});
356363
this.on('removedfile', async (file) => {
357364
if (disableRemovedfileEvent) return;
358-
$(`#${file.uuid}`).remove();
359-
if ($dropzone.attr('data-remove-url') && !fileUuidDict[file.uuid].submitted) {
365+
document.getElementById(file.uuid)?.remove();
366+
if (dropzone.getAttribute('data-remove-url') && !fileUuidDict[file.uuid].submitted) {
360367
try {
361-
await POST($dropzone.attr('data-remove-url'), {data: new URLSearchParams({file: file.uuid})});
368+
await POST(dropzone.getAttribute('data-remove-url'), {data: new URLSearchParams({file: file.uuid})});
362369
} catch (error) {
363370
console.error(error);
364371
}
365372
}
366373
});
367374
this.on('submit', () => {
368-
$.each(fileUuidDict, (fileUuid) => {
375+
for (const fileUuid of Object.keys(fileUuidDict)) {
369376
fileUuidDict[fileUuid].submitted = true;
370-
});
377+
}
371378
});
372379
this.on('reload', async () => {
373380
try {
374-
const response = await GET($editContentZone.attr('data-attachment-url'));
381+
const response = await GET(editContentZone.getAttribute('data-attachment-url'));
375382
const data = await response.json();
376383
// do not trigger the "removedfile" event, otherwise the attachments would be deleted from server
377384
disableRemovedfileEvent = true;
378385
dz.removeAllFiles(true);
379-
$dropzone.find('.files').empty();
386+
dropzone.querySelector('.files').innerHTML = '';
380387
fileUuidDict = {};
381388
disableRemovedfileEvent = false;
382389

383390
for (const attachment of data) {
384-
const imgSrc = `${$dropzone.attr('data-link-url')}/${attachment.uuid}`;
391+
const imgSrc = `${dropzone.getAttribute('data-link-url')}/${attachment.uuid}`;
385392
dz.emit('addedfile', attachment);
386393
dz.emit('thumbnail', attachment, imgSrc);
387394
dz.emit('complete', attachment);
388395
dz.files.push(attachment);
389396
fileUuidDict[attachment.uuid] = {submitted: true};
390-
$dropzone.find(`img[src='${imgSrc}']`)[0].style.maxWidth = '100%';
391-
const $input = $(`<input id="${attachment.uuid}" name="files" type="hidden">`).val(attachment.uuid);
392-
$dropzone.find('.files').append($input);
397+
dropzone.querySelector(`img[src='${imgSrc}']`).style.maxWidth = '100%';
398+
const input = document.createElement('input');
399+
input.id = attachment.uuid;
400+
input.name = 'files';
401+
input.type = 'hidden';
402+
input.value = attachment.uuid;
403+
dropzone.querySelector('.files').insertAdjacentHTML('beforeend', input.outerHTML);
393404
}
394405
} catch (error) {
395406
console.error(error);
@@ -402,44 +413,44 @@ async function onEditContent(event) {
402413
};
403414

404415
const cancelAndReset = (dz) => {
405-
showElem($renderContent);
406-
hideElem($editContentZone);
416+
showElem(renderContent);
417+
hideElem(editContentZone);
407418
if (dz) {
408419
dz.emit('reload');
409420
}
410421
};
411422

412423
const saveAndRefresh = async (dz) => {
413-
showElem($renderContent);
414-
hideElem($editContentZone);
424+
showElem(renderContent);
425+
hideElem(editContentZone);
415426

416427
try {
417428
const params = new URLSearchParams({
418429
content: comboMarkdownEditor.value(),
419-
context: $editContentZone.attr('data-context'),
430+
context: editContentZone.getAttribute('data-context'),
420431
});
421432
for (const file of dz.files) params.append('files[]', file.uuid);
422433

423-
const response = await POST($editContentZone.attr('data-update-url'), {data: params});
434+
const response = await POST(editContentZone.getAttribute('data-update-url'), {data: params});
424435
const data = await response.json();
425436
if (!data.content) {
426-
$renderContent.html($('#no-content').html());
427-
$rawContent.text('');
437+
renderContent.innerHTML = document.getElementById('no-content').innerHTML;
438+
rawContent.textContent = '';
428439
} else {
429-
$renderContent.html(data.content);
430-
$rawContent.text(comboMarkdownEditor.value());
431-
const $refIssues = $renderContent.find('p .ref-issue');
432-
attachRefIssueContextPopup($refIssues);
440+
renderContent.innerHTML = data.content;
441+
rawContent.textContent = comboMarkdownEditor.value();
442+
const refIssues = renderContent.querySelectorAll('p .ref-issue');
443+
attachRefIssueContextPopup(refIssues);
433444
}
434-
const $content = $segment;
435-
if (!$content.find('.dropzone-attachments').length) {
445+
const content = segment;
446+
if (!content.querySelector('.dropzone-attachments')) {
436447
if (data.attachments !== '') {
437-
$content[0].insertAdjacentHTML('beforeend', data.attachments);
448+
content.insertAdjacentHTML('beforeend', data.attachments);
438449
}
439450
} else if (data.attachments === '') {
440-
$content.find('.dropzone-attachments').remove();
451+
content.querySelector('.dropzone-attachments').remove();
441452
} else {
442-
$content.find('.dropzone-attachments')[0].outerHTML = data.attachments;
453+
content.querySelector('.dropzone-attachments').outerHTML = data.attachments;
443454
}
444455
if (dz) {
445456
dz.emit('submit');
@@ -452,29 +463,29 @@ async function onEditContent(event) {
452463
}
453464
};
454465

455-
if (!$editContentZone.html()) {
456-
$editContentZone.html($('#issue-comment-editor-template').html());
457-
comboMarkdownEditor = await initComboMarkdownEditor($editContentZone.find('.combo-markdown-editor'));
466+
if (!editContentZone.innerHTML) {
467+
editContentZone.innerHTML = document.getElementById('issue-comment-editor-template').innerHTML;
468+
comboMarkdownEditor = await initComboMarkdownEditor(editContentZone.querySelector('.combo-markdown-editor'));
458469

459-
const $dropzone = $editContentZone.find('.dropzone');
460-
const dz = await setupDropzone($dropzone);
461-
$editContentZone.find('.cancel.button').on('click', (e) => {
470+
const dropzone = editContentZone.querySelector('.dropzone');
471+
const dz = await setupDropzone(dropzone);
472+
editContentZone.querySelector('.cancel.button').addEventListener('click', (e) => {
462473
e.preventDefault();
463474
cancelAndReset(dz);
464475
});
465-
$editContentZone.find('.save.button').on('click', (e) => {
476+
editContentZone.querySelector('.save.button').addEventListener('click', (e) => {
466477
e.preventDefault();
467478
saveAndRefresh(dz);
468479
});
469480
} else {
470-
comboMarkdownEditor = getComboMarkdownEditor($editContentZone.find('.combo-markdown-editor'));
481+
comboMarkdownEditor = getComboMarkdownEditor(editContentZone.querySelector('.combo-markdown-editor'));
471482
}
472483

473484
// Show write/preview tab and copy raw content as needed
474-
showElem($editContentZone);
475-
hideElem($renderContent);
485+
showElem(editContentZone);
486+
hideElem(renderContent);
476487
if (!comboMarkdownEditor.value()) {
477-
comboMarkdownEditor.value($rawContent.text());
488+
comboMarkdownEditor.value(rawContent.textContent);
478489
}
479490
comboMarkdownEditor.focus();
480491
}

0 commit comments

Comments
 (0)