ckeditor / ckeditor5

Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.
https://ckeditor.com/ckeditor-5
Other
9.54k stars 3.7k forks source link

Accessing ButtonView from Compiled CKEditor #17030

Open SnowRunescape opened 2 months ago

SnowRunescape commented 2 months ago

I am trying to access the ButtonView from the compiled version of CKEditor. In the obfuscated version, the ButtonView is renamed to Mv. To work around this, I created a temporary solution by adding window.PARAS = Mv to access ButtonView. However, this approach seems far from ideal and feels like a hack.

// Workaround to access ButtonView
window.PARAS = Mv;

image

Problem:

This method exposes internal CKEditor details globally and relies on the obfuscated naming (Mv), which might change in future releases, making the code brittle and unreliable. I need a more robust way to access ButtonView without exposing internal objects or depending on obfuscated variable names.

Goal:

I am looking for a better way to access ButtonView using pure JavaScript, ideally one that is maintainable and not dependent on CKEditor's internal obfuscation.

Example Code:

using like a hack, tthis work.

image

class HelloWorldPlugin {
    constructor(editor) {
        this.editor = editor;
    }

    // Registra o botão na barra de ferramentas
    init() {
        const editor = this.editor;

        // Adiciona um comando personalizado que insere "Hello World!"
        editor.commands.add('insertHelloWorld', {
            execute() {
                editor.model.change(writer => {
                    const insertPosition = editor.model.document.selection.getFirstPosition();
                    writer.insertText('Hello World!', insertPosition);
                });
            }
        });

        editor.ui.componentFactory.add('helloWorldButton', locale => {
            const view = new PARAS(locale);

            view.set({
                label: 'Hello World',
                withText: true,
                tooltip: true
            });

            view.on('execute', () => editor.execute('insertHelloWorld'));

            return view;
        });
    }
}
Witoso commented 1 month ago

Please share more info where the compiled/obfuscated version comes from. Nothing on our side forces you to use such workarounds, and I would like to understand more why you have this setup.

SnowRunescape commented 1 month ago

The compiled version comes from the CKEditor 5 online builder at https://ckeditor.com/ckeditor-5/builder/. I generated it directly from there, and this is the form it came in. The specific script I'm using is hosted at: https://cdn.minecart.com.br/assets/js/ckeditor/ckeditor.js.

image