liferay / alloy-editor

WYSIWYG editor based on CKEditor with completely rewritten UI
http://alloyeditor.com
GNU Lesser General Public License v3.0
1.39k stars 282 forks source link

Errors after CKEditor upgrade #1553

Open fortunatomaldonado opened 11 months ago

fortunatomaldonado commented 11 months ago

Do you want to request a feature or report a bug? Bug If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. After upgrading CKE version.

  1. Go to blogs and click on Plus to create new blog
  2. Check in devtool to see v.4.21 of CKEditor is being used.
  3. Add a title and content and post the blog

Actual Result Error message in the console errorBlog

What is the expected behavior? Blog is posted without any issues.

Which versions of alloy-editor, and which browser / OS are affected by this issue? Did this work in previous versions? v2.14.9 Chrome

bettysteger commented 10 months ago

@fortunatomaldonado can you install CKEditor separately and how does it not use the built-in version?

bettysteger commented 10 months ago

i cannot get it to work when installing CKEditor from the npm package, following setup:

package.json:

"alloyeditor": "2.14.10",
"ckeditor4": "4.22.1",

app.js

import CKEDITOR from 'ckeditor4/ckeditor.js';
import 'alloyeditor/dist/alloy-editor/alloy-editor-no-react.js';

alloyEditor.js

AlloyEditor.editable(id, {
        extraPlugins: AlloyEditor.Core.ATTRS.extraPlugins.value.replace('ae_tabletools,ae_tableresize', ''),
        removePlugins: 'scayt,about,image,specialchar,stylescombo,contextmenu,tabletools,tableselection,table,link,pastetext,format',

I removed lots of CKEditor plugins because there were so many different errors... I just wanted it to get to work first, but now i am stuck on this error:

error:

Cannot read properties of undefined (reading 'name')
TypeError: Cannot read properties of undefined (reading 'name')
    at generateButtonBridge (http://bettysteger.lvh.me:8000/bundle.js:72310:22)
    at __webpack_modules__../node_modules/ckeditor4/ckeditor.js.window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.ui.create

Code where the exception is thrown:

    function generateButtonBridge(buttonName, buttonDefinition, editor) {
        var ButtonBridge = AlloyEditor.Buttons[buttonName];

        BUTTON_DEFS[editor.name] = BUTTON_DEFS[editor.name] || {};

@fortunatomaldonado how can i use a different ckeditor version with alloyeditor?