diff --git a/app/assets/javascripts/my_modules/protocols.js b/app/assets/javascripts/my_modules/protocols.js index 242f0614a..f5f2a5af0 100644 --- a/app/assets/javascripts/my_modules/protocols.js +++ b/app/assets/javascripts/my_modules/protocols.js @@ -18,6 +18,10 @@ function initEditMyModuleDescription() { if ($(this).hasClass('record-info-link')) return; e.stopPropagation(); }); + + setTimeout(function() { + TinyMCE.wrapTables(viewObject); + }, 100); } function initEditProtocolDescription() { diff --git a/app/javascript/packs/tiny_mce.js b/app/javascript/packs/tiny_mce.js index 5f65665ea..1ec9def8a 100644 --- a/app/javascript/packs/tiny_mce.js +++ b/app/javascript/packs/tiny_mce.js @@ -1,4 +1,4 @@ -/* global I18n hljs GLOBAL_CONSTANTS HelperModule SmartAnnotation */ +/* global I18n hljs GLOBAL_CONSTANTS HelperModule SmartAnnotation TinyMCE */ import tinyMCE from 'tinymce/tinymce'; import 'tinymce/models/dom'; @@ -329,6 +329,7 @@ window.TinyMCE = (() => { editorForm.find('.tinymce-status-badge').removeClass('hidden'); editor.remove(); editorForm.find('.tinymce-view').html(data.html).removeClass('hidden'); + TinyMCE.wrapTables(editorForm.find('.tinymce-view')); editor.plugins.autosave.removeDraft(); removeDraft(editor, textAreaObject); if (options.onSaveCallback) { options.onSaveCallback(data); } @@ -455,7 +456,16 @@ window.TinyMCE = (() => { makeItDirty: (editor) => { makeItDirty(editor); }, - highlight: initHighlightjs + highlight: initHighlightjs, + wrapTables: (container) => { + container.find('table').toArray().forEach((table) => { + if ($(table).parent().hasClass('table-wrapper')) return; + + $(table).css('float', 'none').wrapAll(` +
+ `); + }); + } }; })(); diff --git a/app/javascript/vue/shared/tinymce.vue b/app/javascript/vue/shared/tinymce.vue index 117a77430..b07ca6d8a 100644 --- a/app/javascript/vue/shared/tinymce.vue +++ b/app/javascript/vue/shared/tinymce.vue @@ -136,6 +136,7 @@ this.$emit('update', data.data) } this.$emit('editingDisabled'); + this.wrapTables(); }, afterInitCallback: () => { this.active = true; @@ -151,9 +152,7 @@ }, wrapTables() { this.$nextTick(() => { - $(this.$el).find('.tinymce-view table').toArray().forEach((table) => { - $(table).css('float', 'none').wrapAll(''); - }) + TinyMCE.wrapTables($(this.$el).find('.tinymce-view')); }); }, initCharacterCount() {