Closed rcloss closed 1 year ago
Could you maybe provide a reproduction / git repo? so it's easier to figure out what is going on.
It's happening without any major modifications, I'm using grapesjs-mjml 0.1.17 (it's the last one with a dist folder, haven't built a newer one yet, but I don't see a fix in the release notes) and grapesjs 0.16.17
Here's my settings:
var editor = grapesjs.init({
container: '#gjs',
height: '100%',
avoidInlineStyle: false,
fromElement: true,
clearOnRender: true,
plugins: ['grapesjs-mjml', 'gjs-plugin-ckeditor'],
pluginsOpts: {
'grapesjs-mjml': {
columnsPadding: '0',
},
'gjs-plugin-ckeditor': {
position: 'center',
options: {
startupFocus: true,
extraAllowedContent: '();{}',
allowedContent: true,
enterMode: CKEDITOR.ENTER_BR,
extraPlugins: 'justify,colorbutton,panelbutton,font,placeholder,mnlink',
toolbarGroups: [
{name: 'document', groups: ['mode', 'document', 'doctools']},
{name: 'clipboard', groups: ['clipboard', 'undo']},
{name: 'editing', groups: ['find', 'selection', 'spellchecker', 'editing']},
{name: 'forms', groups: ['forms']},
{name: 'basicstyles', groups: ['basicstyles', 'cleanup']},
{name: 'paragraph', groups: ['list', 'indent', 'blocks', 'align', 'bidi', 'paragraph']},
{name: 'links', groups: ['links']},
{name: 'insert', groups: ['insert']},
'/',
{name: 'styles', groups: ['styles']},
{name: 'colors', groups: ['colors']},
{name: 'tools', groups: ['tools']},
{name: 'others', groups: ['others']},
{name: 'about', groups: ['about']}
],
removeButtons: 'Source,Save,NewPage,Preview,Print,Templates,Form,Checkbox,Radio,TextField,Textarea,Select,Button,ImageButton,HiddenField,Find,Replace,Scayt,Language,Anchor,Image,Flash,PageBreak,Iframe'
}
}
}
});
So if I drag a column and a text block I can edit the italic/bold/whatever with CK Editor, but as soon as I do something like center it with the style manager I can no longer do anything with the CKEditor
update: I also tried this with the MJML plugin disabled and using the style manager doesn't stop the CKEditor from working in that case.
Any reason you need the dist folder? the dist folder is still being published to npm and various cdns
no, I just haven't got around to upgrading yet, because it wasn't handy here on github. If the newer version fix this bug I can upgrade but I didn't see anything pressing in the release notes to warrant it
I got back to this and updated to 0.2.4 today and there's still the conflict with the CKEditor plugin, as soon as I change anything in Typography the CKEditor can no longer update bold, italic, etc...
I get the same issue on demo https://grapesjs.com/demo-mjml.html
To reproduce :
Issue : imposible to complete step 4.
I still have the same issue with mjml emails but fix Rte destroy on disable seems to work for me. @artf @DRoet is there a chance that it will be resolved soon?
If this somehow helps to fix the problem, when the gjs-plugin-ckeditor stops working, trying to convert the selected text to a bulleted or numbered list returns an error in the console:
ckeditor.js:186 Uncaught TypeError: Cannot read properties of null (reading 'isContextFor')
at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.command.refresh (ckeditor.js:186:481)
at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.command.exec (ckeditor.js:715:448)
at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.command.exec (ckeditor.js:186:379)
at a.execCommand (ckeditor.js:252:231)
at CKEDITOR.tools.extend.click (ckeditor.js:766:419)
at Object.execute (ckeditor.js:767:490)
at ckeditor.js:768:326
at ckeditor.js:29:180
at Object.callFunction (ckeditor.js:29:296)
at HTMLAnchorElement.onclick (demo-mjml.html:1:16)
Closing this as from the demo the issue seems to be resolved
I'm not sure how to resolve this. If I haven't chosen any style options from the style manager for a block I can use CKEditor (installed via the grapesjs plugin) and all the font changes work, but if I have set something with Style Manager, I can no longer use CKEditor to change anything, I thought maybe mjml was overriding the CKEditor styles, but I can't even use i, b or u tags once something has been chosen from the Style Manager. If necessary I can disable the style manager stuff and just use CKEditor, but this still seems like an bug