mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-26 12:27:06 +00:00 
			
		
		
		
	Fix JS error when reply comment on Conversation page (#32685)
Fix #32684, regression of #32596 (side-effect of jQuery removal: jQuery could tolerate non-existing elements) And fix another regression bug from #30453 (initCompReactionSelector double-init)
This commit is contained in:
		| @@ -1,8 +1,8 @@ | |||||||
| import {POST} from '../../modules/fetch.ts'; | import {POST} from '../../modules/fetch.ts'; | ||||||
| import {fomanticQuery} from '../../modules/fomantic/base.ts'; | import {fomanticQuery} from '../../modules/fomantic/base.ts'; | ||||||
|  |  | ||||||
| export function initCompReactionSelector() { | export function initCompReactionSelector(parent: ParentNode = document) { | ||||||
|   for (const container of document.querySelectorAll('.issue-content, .diff-file-body')) { |   for (const container of parent.querySelectorAll('.issue-content, .diff-file-body')) { | ||||||
|     container.addEventListener('click', async (e) => { |     container.addEventListener('click', async (e) => { | ||||||
|       // there are 2 places for the "reaction" buttons, one is the top-right reaction menu, one is the bottom of the comment |       // there are 2 places for the "reaction" buttons, one is the top-right reaction menu, one is the bottom of the comment | ||||||
|       const target = e.target.closest('.comment-reaction-button'); |       const target = e.target.closest('.comment-reaction-button'); | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ function initRepoDiffFileViewToggle() { | |||||||
| } | } | ||||||
|  |  | ||||||
| function initRepoDiffConversationForm() { | function initRepoDiffConversationForm() { | ||||||
|   addDelegatedEventListener<HTMLFormElement>(document, 'submit', '.conversation-holder form', async (form, e) => { |   addDelegatedEventListener<HTMLFormElement, SubmitEvent>(document, 'submit', '.conversation-holder form', async (form, e) => { | ||||||
|     e.preventDefault(); |     e.preventDefault(); | ||||||
|     const textArea = form.querySelector<HTMLTextAreaElement>('textarea'); |     const textArea = form.querySelector<HTMLTextAreaElement>('textarea'); | ||||||
|     if (!validateTextareaNonEmpty(textArea)) return; |     if (!validateTextareaNonEmpty(textArea)) return; | ||||||
| @@ -55,7 +55,9 @@ function initRepoDiffConversationForm() { | |||||||
|         formData.append(submitter.name, submitter.value); |         formData.append(submitter.name, submitter.value); | ||||||
|       } |       } | ||||||
|  |  | ||||||
|       const trLineType = form.closest('tr').getAttribute('data-line-type'); |       // on the diff page, the form is inside a "tr" and need to get the line-type ahead | ||||||
|  |       // but on the conversation page, there is no parent "tr" | ||||||
|  |       const trLineType = form.closest('tr')?.getAttribute('data-line-type'); | ||||||
|       const response = await POST(form.getAttribute('action'), {data: formData}); |       const response = await POST(form.getAttribute('action'), {data: formData}); | ||||||
|       const newConversationHolder = createElementFromHTML(await response.text()); |       const newConversationHolder = createElementFromHTML(await response.text()); | ||||||
|       const path = newConversationHolder.getAttribute('data-path'); |       const path = newConversationHolder.getAttribute('data-path'); | ||||||
| @@ -65,6 +67,9 @@ function initRepoDiffConversationForm() { | |||||||
|       form.closest('.conversation-holder').replaceWith(newConversationHolder); |       form.closest('.conversation-holder').replaceWith(newConversationHolder); | ||||||
|       form = null; // prevent further usage of the form because it should have been replaced |       form = null; // prevent further usage of the form because it should have been replaced | ||||||
|  |  | ||||||
|  |       if (trLineType) { | ||||||
|  |         // if there is a line-type for the "tr", it means the form is on the diff page | ||||||
|  |         // then hide the "add-code-comment" [+] button for current code line by adding "tw-invisible" because the conversation has been added | ||||||
|         let selector; |         let selector; | ||||||
|         if (trLineType === 'same') { |         if (trLineType === 'same') { | ||||||
|           selector = `[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`; |           selector = `[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`; | ||||||
| @@ -72,7 +77,8 @@ function initRepoDiffConversationForm() { | |||||||
|           selector = `[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`; |           selector = `[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`; | ||||||
|         } |         } | ||||||
|         for (const el of document.querySelectorAll(selector)) { |         for (const el of document.querySelectorAll(selector)) { | ||||||
|         el.classList.add('tw-invisible'); // TODO need to figure out why |           el.classList.add('tw-invisible'); | ||||||
|  |         } | ||||||
|       } |       } | ||||||
|       fomanticQuery(newConversationHolder.querySelectorAll('.ui.dropdown')).dropdown(); |       fomanticQuery(newConversationHolder.querySelectorAll('.ui.dropdown')).dropdown(); | ||||||
|  |  | ||||||
| @@ -109,7 +115,7 @@ function initRepoDiffConversationForm() { | |||||||
|         const $conversation = $(data); |         const $conversation = $(data); | ||||||
|         $(this).closest('.conversation-holder').replaceWith($conversation); |         $(this).closest('.conversation-holder').replaceWith($conversation); | ||||||
|         $conversation.find('.dropdown').dropdown(); |         $conversation.find('.dropdown').dropdown(); | ||||||
|         initCompReactionSelector($conversation); |         initCompReactionSelector($conversation[0]); | ||||||
|       } else { |       } else { | ||||||
|         window.location.reload(); |         window.location.reload(); | ||||||
|       } |       } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 wxiaoguang
					wxiaoguang