feat: Add integration with CKEditor5 track changes feature. (#1125)

Author: Dumluregn

packages/ckeditor5/src/integration.js

@@ -170,7 +170,10 @@ export default class CKEditor5Integration extends IntegrationModel {
         // Remove selection
         if (!viewSelection.isCollapsed) {
           for (const range of viewSelection.getRanges()) {
-            writer.remove(this.editorObject.editing.mapper.toModelRange(range));
+            const modelRange = this.editorObject.editing.mapper.toModelRange(range);
+            const modelSelection = this.editorObject.model.createSelection(modelRange);
+
+            this.editorObject.model.deleteContent(modelSelection);
           }
         }
 
@@ -189,7 +192,7 @@ export default class CKEditor5Integration extends IntegrationModel {
         if (mathml) {
           this.editorObject.model.insertObject(modelElementNew, position);
         }
-        writer.remove(modelElementOld);
+        this.editorObject.model.deleteContent(this.editorObject.model.createSelection(modelElementOld,'on'));
       }
 
       // eslint-disable-next-line consistent-return
@@ -280,7 +283,9 @@ export default class CKEditor5Integration extends IntegrationModel {
           }
         }
 
-        writer.remove(range);
+        const modelSelection = this.editorObject.model.createSelection(range);
+
+        this.editorObject.model.deleteContent(modelSelection);
         writer.insertText(`$$${returnObject.latex}$$`, startNode.getAttributes(), startPosition);
       });
     } else {

packages/ckeditor5/src/plugin.js

@@ -43,7 +43,10 @@ export default class MathType extends Plugin {
     currentInstance = integration;
 
     // Add the MathType and ChemType commands to the editor
-    this._addCommands();
+    this._addCommands(integration);
+
+    // Add the track changes feature integration
+    this._addTrackChangesIntegration(integration);
 
     // Add the buttons for MathType and ChemType
     this._addViews(integration);
@@ -579,4 +582,24 @@ export default class MathType extends Plugin {
       Latex,
     };
   }
+
+  _addTrackChangesIntegration(integration) {
+    const { editor } = this;
+
+    if (editor.plugins.has("TrackChangesEditing")) {
+      const trackChangesEditing = editor.plugins.get("TrackChangesEditing");
+
+      // Makes MathType and ChemType buttons available when editor is in the track changes mode
+      trackChangesEditing.enableCommand("MathType");
+      trackChangesEditing.enableCommand("ChemType");
+
+      // Adds custom label replacing the default 'mathml'.
+      // Handles both singular and plural forms.
+      trackChangesEditing.descriptionFactory.registerElementLabel(
+        "mathml",
+        quantity => (quantity > 1 ? quantity + ' ' : '') +
+          StringManager.get(quantity > 1 ? "formulas" : "formula", integration.getLanguage()),
+      );
+    }
+  }
 }