mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-31 10:56:10 +01:00 
			
		
		
		
	Fix EasyMDE validation (#18161)
This commit is contained in:
		| @@ -75,13 +75,27 @@ export function createCommentEasyMDE(textarea) { | |||||||
|     } |     } | ||||||
|   }); |   }); | ||||||
|   attachTribute(inputField, {mentions: true, emoji: true}); |   attachTribute(inputField, {mentions: true, emoji: true}); | ||||||
|  |   attachEasyMDEToElements(easyMDE); | ||||||
|   // TODO: that's the only way we can do now to attach the EasyMDE object to a HTMLElement |  | ||||||
|   inputField._data_easyMDE = easyMDE; |  | ||||||
|   textarea._data_easyMDE = easyMDE; |  | ||||||
|   return easyMDE; |   return easyMDE; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | /** | ||||||
|  |  * attach the EasyMDE object to its input elements (InputField, TextArea) | ||||||
|  |  * @param {EasyMDE} easyMDE | ||||||
|  |  */ | ||||||
|  | export function attachEasyMDEToElements(easyMDE) { | ||||||
|  |   // TODO: that's the only way we can do now to attach the EasyMDE object to a HTMLElement | ||||||
|  |  | ||||||
|  |   // InputField is used by CodeMirror to accept user input | ||||||
|  |   const inputField = easyMDE.codemirror.getInputField(); | ||||||
|  |   inputField._data_easyMDE = easyMDE; | ||||||
|  |  | ||||||
|  |   // TextArea is the real textarea element in the form | ||||||
|  |   const textArea = easyMDE.codemirror.getTextArea(); | ||||||
|  |   textArea._data_easyMDE = easyMDE; | ||||||
|  | } | ||||||
|  |  | ||||||
|  |  | ||||||
| /** | /** | ||||||
|  * get the attached EasyMDE editor created by createCommentEasyMDE |  * get the attached EasyMDE editor created by createCommentEasyMDE | ||||||
|  * @param el jQuery or HTMLElement |  * @param el jQuery or HTMLElement | ||||||
| @@ -98,29 +112,27 @@ export function getAttachedEasyMDE(el) { | |||||||
| } | } | ||||||
|  |  | ||||||
| /** | /** | ||||||
|  * validate if the given textarea from a form, is non-empty. |  * validate if the given EasyMDE textarea is is non-empty. | ||||||
|  * @param {jQuery | HTMLElement} form |  * @param {jQuery} $textarea | ||||||
|  * @param {jQuery | HTMLElement} textarea |  | ||||||
|  * @returns {boolean} returns true if validation succeeded. |  * @returns {boolean} returns true if validation succeeded. | ||||||
|  */ |  */ | ||||||
| export function validateTextareaNonEmpty(form, textarea) { | export function validateTextareaNonEmpty($textarea) { | ||||||
|   if (form instanceof jQuery) { |   const $mdeInputField = $(getAttachedEasyMDE($textarea).codemirror.getInputField()); | ||||||
|     form = form[0]; |  | ||||||
|   } |  | ||||||
|   if (textarea instanceof jQuery) { |  | ||||||
|     textarea = textarea[0]; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   const $markdownEditorTextArea = $(getAttachedEasyMDE(textarea).codemirror.getInputField()); |  | ||||||
|   // The original edit area HTML element is hidden and replaced by the |   // The original edit area HTML element is hidden and replaced by the | ||||||
|   // SimpleMDE/EasyMDE editor, breaking HTML5 input validation if the text area is empty. |   // SimpleMDE/EasyMDE editor, breaking HTML5 input validation if the text area is empty. | ||||||
|   // This is a workaround for this upstream bug. |   // This is a workaround for this upstream bug. | ||||||
|   // See https://github.com/sparksuite/simplemde-markdown-editor/issues/324 |   // See https://github.com/sparksuite/simplemde-markdown-editor/issues/324 | ||||||
|   if (textarea.value.length) { |   if (!$textarea.val()) { | ||||||
|     $markdownEditorTextArea.prop('required', true); |     $mdeInputField.prop('required', true); | ||||||
|     form.reportValidity(); |     const $form = $textarea.parents('form'); | ||||||
|  |     if (!$form.length) { | ||||||
|  |       // this should never happen. we put a alert here in case the textarea would be forgotten to be put in a form | ||||||
|  |       alert('Require non-empty content'); | ||||||
|  |     } else { | ||||||
|  |       $form[0].reportValidity(); | ||||||
|  |     } | ||||||
|     return false; |     return false; | ||||||
|   } |   } | ||||||
|   $markdownEditorTextArea.prop('required', false); |   $mdeInputField.prop('required', false); | ||||||
|   return true; |   return true; | ||||||
| } | } | ||||||
|   | |||||||
| @@ -27,7 +27,7 @@ export function initRepoDiffConversationForm() { | |||||||
|  |  | ||||||
|     const form = $(e.target); |     const form = $(e.target); | ||||||
|     const $textArea = form.find('textarea'); |     const $textArea = form.find('textarea'); | ||||||
|     if (!validateTextareaNonEmpty(form, $textArea)) { |     if (!validateTextareaNonEmpty($textArea)) { | ||||||
|       return; |       return; | ||||||
|     } |     } | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1,5 +1,5 @@ | |||||||
| import {initMarkupContent} from '../markup/content.js'; | import {initMarkupContent} from '../markup/content.js'; | ||||||
| import {validateTextareaNonEmpty} from './comp/CommentEasyMDE.js'; | import {attachEasyMDEToElements, validateTextareaNonEmpty} from './comp/CommentEasyMDE.js'; | ||||||
| import {initCompMarkupContentPreviewTab} from './comp/MarkupContentPreview.js'; | import {initCompMarkupContentPreviewTab} from './comp/MarkupContentPreview.js'; | ||||||
|  |  | ||||||
| const {csrfToken} = window.config; | const {csrfToken} = window.config; | ||||||
| @@ -119,11 +119,15 @@ export function initRepoWikiForm() { | |||||||
|       ] |       ] | ||||||
|     }); |     }); | ||||||
|  |  | ||||||
|     const $markdownEditorTextArea = $(easyMDE.codemirror.getInputField()); |     attachEasyMDEToElements(easyMDE); | ||||||
|     $markdownEditorTextArea.addClass('js-quick-submit'); |  | ||||||
|  |  | ||||||
|     $form.on('submit', function () { |     const $mdeInputField = $(easyMDE.codemirror.getInputField()); | ||||||
|       validateTextareaNonEmpty(this, $editArea); |     $mdeInputField.addClass('js-quick-submit'); | ||||||
|  |  | ||||||
|  |     $form.on('submit', () => { | ||||||
|  |       if (!validateTextareaNonEmpty($editArea)) { | ||||||
|  |         return false; | ||||||
|  |       } | ||||||
|     }); |     }); | ||||||
|  |  | ||||||
|     setTimeout(() => { |     setTimeout(() => { | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user