mirror of
				https://github.com/go-gitea/gitea
				synced 2025-11-04 13:28:25 +00:00 
			
		
		
		
	Remove jQuery .attr from the ComboMarkdownEditor (#30051)
				
					
				
			- Switched from jQuery `attr` to plain javascript `getAttribute` and `setAttribute` - Tested the markdown editor and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com>
This commit is contained in:
		@@ -132,34 +132,33 @@ class ComboMarkdownEditor {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
  setupTab() {
 | 
					  setupTab() {
 | 
				
			||||||
    const $container = $(this.container);
 | 
					    const $container = $(this.container);
 | 
				
			||||||
    const $tabMenu = $container.find('.tabular.menu');
 | 
					    const tabs = $container[0].querySelectorAll('.tabular.menu > .item');
 | 
				
			||||||
    const $tabs = $tabMenu.find('> .item');
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // Fomantic Tab requires the "data-tab" to be globally unique.
 | 
					    // Fomantic Tab requires the "data-tab" to be globally unique.
 | 
				
			||||||
    // So here it uses our defined "data-tab-for" and "data-tab-panel" to generate the "data-tab" attribute for Fomantic.
 | 
					    // So here it uses our defined "data-tab-for" and "data-tab-panel" to generate the "data-tab" attribute for Fomantic.
 | 
				
			||||||
    const $tabEditor = $tabs.filter(`.item[data-tab-for="markdown-writer"]`);
 | 
					    const tabEditor = Array.from(tabs).find((tab) => tab.getAttribute('data-tab-for') === 'markdown-writer');
 | 
				
			||||||
    const $tabPreviewer = $tabs.filter(`.item[data-tab-for="markdown-previewer"]`);
 | 
					    const tabPreviewer = Array.from(tabs).find((tab) => tab.getAttribute('data-tab-for') === 'markdown-previewer');
 | 
				
			||||||
    $tabEditor.attr('data-tab', `markdown-writer-${elementIdCounter}`);
 | 
					    tabEditor.setAttribute('data-tab', `markdown-writer-${elementIdCounter}`);
 | 
				
			||||||
    $tabPreviewer.attr('data-tab', `markdown-previewer-${elementIdCounter}`);
 | 
					    tabPreviewer.setAttribute('data-tab', `markdown-previewer-${elementIdCounter}`);
 | 
				
			||||||
    const $panelEditor = $container.find('.ui.tab[data-tab-panel="markdown-writer"]');
 | 
					    const panelEditor = $container[0].querySelector('.ui.tab[data-tab-panel="markdown-writer"]');
 | 
				
			||||||
    const $panelPreviewer = $container.find('.ui.tab[data-tab-panel="markdown-previewer"]');
 | 
					    const panelPreviewer = $container[0].querySelector('.ui.tab[data-tab-panel="markdown-previewer"]');
 | 
				
			||||||
    $panelEditor.attr('data-tab', `markdown-writer-${elementIdCounter}`);
 | 
					    panelEditor.setAttribute('data-tab', `markdown-writer-${elementIdCounter}`);
 | 
				
			||||||
    $panelPreviewer.attr('data-tab', `markdown-previewer-${elementIdCounter}`);
 | 
					    panelPreviewer.setAttribute('data-tab', `markdown-previewer-${elementIdCounter}`);
 | 
				
			||||||
    elementIdCounter++;
 | 
					    elementIdCounter++;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    $tabEditor[0].addEventListener('click', () => {
 | 
					    tabEditor.addEventListener('click', () => {
 | 
				
			||||||
      requestAnimationFrame(() => {
 | 
					      requestAnimationFrame(() => {
 | 
				
			||||||
        this.focus();
 | 
					        this.focus();
 | 
				
			||||||
      });
 | 
					      });
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    $tabs.tab();
 | 
					    $(tabs).tab();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    this.previewUrl = $tabPreviewer.attr('data-preview-url');
 | 
					    this.previewUrl = tabPreviewer.getAttribute('data-preview-url');
 | 
				
			||||||
    this.previewContext = $tabPreviewer.attr('data-preview-context');
 | 
					    this.previewContext = tabPreviewer.getAttribute('data-preview-context');
 | 
				
			||||||
    this.previewMode = this.options.previewMode ?? 'comment';
 | 
					    this.previewMode = this.options.previewMode ?? 'comment';
 | 
				
			||||||
    this.previewWiki = this.options.previewWiki ?? false;
 | 
					    this.previewWiki = this.options.previewWiki ?? false;
 | 
				
			||||||
    $tabPreviewer.on('click', async () => {
 | 
					    tabPreviewer.addEventListener('click', async () => {
 | 
				
			||||||
      const formData = new FormData();
 | 
					      const formData = new FormData();
 | 
				
			||||||
      formData.append('mode', this.previewMode);
 | 
					      formData.append('mode', this.previewMode);
 | 
				
			||||||
      formData.append('context', this.previewContext);
 | 
					      formData.append('context', this.previewContext);
 | 
				
			||||||
@@ -167,7 +166,7 @@ class ComboMarkdownEditor {
 | 
				
			|||||||
      formData.append('wiki', this.previewWiki);
 | 
					      formData.append('wiki', this.previewWiki);
 | 
				
			||||||
      const response = await POST(this.previewUrl, {data: formData});
 | 
					      const response = await POST(this.previewUrl, {data: formData});
 | 
				
			||||||
      const data = await response.text();
 | 
					      const data = await response.text();
 | 
				
			||||||
      renderPreviewPanelContent($panelPreviewer, data);
 | 
					      renderPreviewPanelContent($(panelPreviewer), data);
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user