Open aaronskiba opened 2 weeks ago
forced_root_block:
forced_root_block: ''
seems to default to forced_root_block: 'p'
, which is the same behaviour as not explicitly stating the forced_root_block:
arg at all.
rails assets:clobber && rails assets:precompile
was executed between code changes:
forced_root_block: ''
// app/javascript/src/superAdmin/notifications/edit.js
$(() => {
Tinymce.init({ selector: '#notification_body', forced_root_block: '' });
3.0.5 :001 > Notification.last.body
Notification Load (0.7ms) SELECT "notifications".* FROM "notifications" ORDER BY "notifications"."id" DESC LIMIT $1 [["LIMIT", 1]]
=> "<p>Test 1</p>"
3.0.5 :002 >
forced_root_block: 'div'
// app/javascript/src/superAdmin/notifications/edit.js
$(() => {
Tinymce.init({ selector: '#notification_body', forced_root_block: 'div' });
3.0.5 :002 > Notification.last.body
Notification Load (1.9ms) SELECT "notifications".* FROM "notifications" ORDER BY "notifications"."id" DESC LIMIT $1 [["LIMIT", 1]]
=> "<div>Test 2</div>"
3.0.5 :003 >
forced_root_block: 'p'
$(() => {
Tinymce.init({ selector: '#notification_body', forced_root_block: 'p' });
3.0.5 :003 > Notification.last.body
Notification Load (1.6ms) SELECT "notifications".* FROM "notifications" ORDER BY "notifications"."id" DESC LIMIT $1 [["LIMIT", 1]]
=> "<p>Test 3</p>"
3.0.5 :004 >
forced_root_block:
arg$(() => {
Tinymce.init({ selector: '#notification_body' });
3.0.5 :004 > Notification.last.body
Notification Load (2.0ms) SELECT "notifications".* FROM "notifications" ORDER BY "notifications"."id" DESC LIMIT $1 [["LIMIT", 1]]
=> "<p>Test 4</p>"
3.0.5 :005 >
autoresize_min_height:
container.find('.toggleable-field').find('.tinymce').each((_idx, el) => {
const tinymceEditor = Tinymce.findEditorById($(el).attr('id'));
if (tinymceEditor) {
console.log('tinymceEditor: ', tinymceEditor);
console.log('tinymceEditor.settings: ', tinymceEditor.settings);
$(tinymceEditor.iframeElement).height(tinymceEditor.settings.autoresize_min_height);
}
});
Console Output:
tinymceEditor: GD {plugins: {…}, contentCSS: Array(0), contentStyles: Array(0), loadedCSS: {…}, isNotDirty: true, …}
application.source.js:2 tinymceEditor.settings: undefined
After removing TinyMCE editor resize code from app/javascript/src/utils/conditionalFields.js
:
and experimenting with
defaultOptions.min_height
within app/javascript/src/utils/tinymce.js
:
(The same behaviour is observed even when we don't edit the code within app/javascript/src/utils/conditionalFields.js
.)
After removing TinyMCE editor resize code from
app/javascript/src/utils/conditionalFields.js
:and experimenting with
defaultOptions.min_height
withinapp/javascript/src/utils/tinymce.js
:![]()
(The same behaviour is observed even when we don't edit the code within
app/javascript/src/utils/conditionalFields.js
.)
https://www.tiny.cloud/docs/tinymce/latest/autoresize/#min_height
//app/javascript/src/utils/tinymce.js
export const defaultOptions = {
selector: '.tinymce',
statusbar: true,
menubar: false,
toolbar: 'bold italic | bullist numlist | link | table',
plugins: 'table autoresize link advlist lists autolink',
browser_spellcheck: true,
advlist_bullet_styles: 'circle,disc,square', // Only disc bullets display on htmltoword
target_list: false,
elementpath: false,
resize: true,
min_height: 230,
Our codebase has 'autoresize' included within plugins:
and min_height: 230
. Thus, 230 is the minimum height that the editor can be shrunk down to.
https://www.tiny.cloud/blog/how-to-migrate-from-tinymce-4-to-tinymce-5/
Please complete the following fields as applicable:
What version of the DMPRoadmap code are you running? (e.g. v2.2.0)
v4.2.0
("tinymce": "^6.4.1"
)Description
The following console warnings are visible with this version
1) URL:
http://127.0.0.1:3000/super_admin/notifications/9/edit
Related code
app/javascript/src/superAdmin/notifications/edit.js
2) URL:
http://127.0.0.1:3000/plans/:id
(on any plan that has "Research outputs may have ethical concerns" checked)Related code
app/javascript/src/utils/conditionalFields.js