N°5298 -When opening CKEditor4 data with CKEditor5, if no change has been made return initial data instead of transformed data

application/cmdbabstract.class.inc.php

@@ -2326,6 +2326,7 @@ JS
 					// b) or override some of the configuration settings, using the second parameter of ckeditor()
 					$aConfig = CKEditorHelper::GetCkeditorPref();
 					$aConfig['placeholder'] = Dict::S('UI:CaseLogTypeYourTextHere');
+					$aConfig['detectChanges'] = ['initialValue' => $sOriginalValue];
 
 					// - Final config
 					$sConfigJS = json_encode($aConfig);

application/ui.htmleditorwidget.class.inc.php

@@ -87,7 +87,7 @@ class UIHTMLEditorWidget
 		if ($sHeightSpec != '') {
 			$aConfig['height'] = $sHeightSpec;
 		}
-		// TODO 3.2.0 Add the configuration for the editor
+		$aConfig['detectChanges'] = ['initialValue' => $sValue];
 		$sConfigJS = json_encode($aConfig);
 
 		WebResourcesHelper::EnableCKEditorToWebPage($oPage);

js/ckeditor/src/ckeditor.ts

@@ -57,6 +57,7 @@ import MentionsMarkup from "./plugins/mentions-markup/mentions-markup.plugin";
 import TriggerUpdateOnReady from "./plugins/trigger_update_on_ready/trigger_update_on_ready.plugin";
 import Maximize from './plugins/maximize/maximize.plugin';
 import ObjectShortcut from './plugins/object-shortcut/object-shortcut.plugin';
+import DetectChanges from "./plugins/detect-change/detect-change.plugin";
 
 // You can read more about extending the build with additional plugins in the "Installing plugins" guide.
 // See https://ckeditor.com/docs/ckeditor5/latest/installation/plugins/installing-plugins.html for details.
@@ -116,7 +117,8 @@ class Editor extends ClassicEditor {
         TriggerUpdateOnReady,
         Maximize,
         ObjectShortcut,
-        InsertHtml
+        InsertHtml,
+        DetectChanges
 	];
 
     // default configuration editor

js/ckeditor/src/plugins/detect-change/detect-change.plugin.ts

@@ -0,0 +1,34 @@
+import { Plugin, type Editor } from 'ckeditor5/src/core.js';
+import iTopDataProcessor from "./itop-data-processor";
+
+/**
+ * DetectChanges Plugin.
+ *
+ */
+export default class DetectChanges extends Plugin {
+
+    constructor( editor: Editor ) {
+        super( editor );
+        const sInitialValue:string = editor.config.get('detectChanges.initialValue') as string;
+        // TODO 3.2.0: How to use CombodoJSConsole here ?
+        console.debug('DetectChanges initial value', sInitialValue);
+        // If the initial value is not set or empty, we don't need to do anything
+        if( !sInitialValue || sInitialValue === '') {
+            return;
+        }
+        // Initialize our own data processor
+        editor.data.processor= new iTopDataProcessor( editor.data.viewDocument,  sInitialValue,  editor.getData() ) as  iTopDataProcessor;
+        // Listen for the dataReady event only once
+        editor.model.document.once('change:data', () => {
+            // Ignore linter as processor can be any kind of DataProcessor but we're sure that we have an iTopDataProcessor
+            // @ts-ignore
+            editor.data.processor.setTransformedInitialValue( editor.getData());
+        });
+    }
+    init() {
+        
+    }
+    static get pluginName() {
+        return 'DetectChanges';
+    }
+}

js/ckeditor/src/plugins/detect-change/itop-data-processor.ts

@@ -0,0 +1,50 @@
+import {HtmlDataProcessor,
+        type ViewDocument,
+        type ViewDocumentFragment
+} from 'ckeditor5/src/engine.js';
+
+export default class iTopDataProcessor extends HtmlDataProcessor {
+    /**
+     * HTML data processor used to process HTML if we detect changes
+     * @private
+     */
+    private _htmlDP: HtmlDataProcessor;
+    /**
+     * Initial value of the editor, we'll return it if we don't detect any changes
+     * @private
+     */
+    private readonly _initialValue: string;
+    /**
+     * Transformed initial value of the editor, we'll use it to detect changes
+     * @private
+     */
+    private  _transformedInitialValue: string;
+    /**
+     * Creates a new instance of the Markdown data processor class.
+     */
+    constructor( document: ViewDocument, initialValue: string, transformedInitialValue: string) {
+        super( document );
+        this._htmlDP = new HtmlDataProcessor( document );
+        this._initialValue = initialValue;
+        // It'll probably be empty on the first call, we'll set it later
+        this._transformedInitialValue = transformedInitialValue;
+    }
+    
+    setTransformedInitialValue( transformedInitialValue: string ) {
+        this._transformedInitialValue = transformedInitialValue;
+    }
+    
+    override toData( viewFragment: ViewDocumentFragment ): string {
+        const html = this._htmlDP.toData( viewFragment );
+        // TODO 3.2.0: How to use CombodoJSConsole here ?
+        console.debug('DataProcessor toData', html);
+        if( html === this._transformedInitialValue ) {
+            // TODO 3.2.0: How to use CombodoJSConsole here ?
+            console.debug('iTopDataProcessor: initialData detected, returning initial value');
+            return this._initialValue;
+        }
+        // TODO 3.2.0: How to use CombodoJSConsole here ?
+        console.debug('iTopDataProcessor: initialData not detected, returning transformed value');
+        return html;
+    }
+}

sources/Application/UI/Base/Component/Input/RichText/RichText.php

@@ -68,6 +68,9 @@ class RichText extends UIBlock
 	public function SetValue(?string $sValue)
 	{
 		$this->sValue = $sValue;
+		if(is_array($this->aConfig)) {
+			$this->aConfig['detectChanges'] = ['initialValue' => $sValue];
+		}
 
 		return $this;
 	}

sources/Renderer/Bootstrap/FieldRenderer/BsSimpleFieldRenderer.php

@@ -173,14 +173,17 @@ EOF
 
 				// Some additional stuff if we are displaying it with a rich editor
 					if ($bRichEditor) {
-						$aConfig = CKEditorHelper::GetCkeditorPref();
-						$aConfig['extraPlugins'] = 'codesnippet';
+						// TODO 3.2.0 How to get a config for portal without mentions ?
+						// $aConfig = CKEditorHelper::GetCkeditorPref();
+						$aConfig = [];
+						$aConfig['detectChanges'] = ['initialValue' => $this->oField->GetCurrentValue()];
+
 						$sJsConfig = json_encode($aConfig);
 						
 						$oOutput->AddJs(
 <<<JS
 							$('#{$this->oField->GetGlobalId()}').addClass('htmlEditor');
-							CombodoCKEditorHandler.CreateInstance('#{$this->oField->GetGlobalId()}').then((	oEditor) => {
+							CombodoCKEditorHandler.CreateInstance('#{$this->oField->GetGlobalId()}', $sJsConfig).then((	oEditor) => {
 							oEditor.model.document.on('change:data', (event) => {
 								
 								$('#{$this->oField->GetGlobalId()}').val(oEditor.getData()).trigger("change");