CKEditor 5 change event not always firing

Question

I'm using CKeditor v11.1.1 with CountableJS for wordcounting.

Currently, I attach countable like this:

editor.model.document.on( 'change:data', ( evt, data ) => { //call countableJS wordcount });

This works fine for normal typing and backspaces, but fails when I do CTRL+A -> Delete or CTRL+V paste some text. The event doesn't fire and so the wordcount doesn't update until I start typing again.

The docs specifically say "[change:data] is fired for changes which affect the editor data" but that doesn't seem to always be the case. I have also tried listening to just change but that behaved similarly.

Am I misunderstanding something here? Is there another event I can listen to?

Answer 1

I've just checked it and it works for me just fine when I press Ctrl + Delete or Ctrl + V . You can test it on https://jsfiddle.net/auxe23b7/1/ :

ClassicEditor
    .create( document.querySelector( '#editor' ) )
    .then( editor => {
        console.log( editor );

        editor.model.document.on( 'change:data', ( evt, data ) => {
            console.log( data );
        } );
    } )
    .catch( error => {
        console.error( error );
    } );

In fact, if this event would not be fired, the editor would not work. This event begins the conversion of the changes in the model to the view. If some changes (deleting the content, pasting some content) are not converted, they would not appear in the view.

So, either you have a bug in your code or... or I don't know :)