From e66b5936e28b3c3ce71acc8ada6cc3819a32a041 Mon Sep 17 00:00:00 2001 From: Thomas Marstrander <marstranderthomas@gmail.com> Date: Fri, 11 Jun 2021 13:08:46 +0200 Subject: [PATCH] JI-2406 Fix CKEditor collapsing if calculator element ever is hidden Overrides the convertToPx function from https://github.com/ckeditor/ckeditor4/blob/cae20318d46745cc46c811da4e7d68b38ca32449/core/tools.js#L899-L929 and instead adds the calculator element for every measurement and removes it when it is done with the measurement. --- scripts/h5peditor-html.js | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) diff --git a/scripts/h5peditor-html.js b/scripts/h5peditor-html.js index 09665080..3cea6923 100644 --- a/scripts/h5peditor-html.js +++ b/scripts/h5peditor-html.js @@ -353,6 +353,41 @@ ns.Html.prototype.appendTo = function ($wrapper) { return new CKEDITOR.dom.element(window.document.body); }; + // Override convertToPx to make sure the calculator is always visible so it can make the measurements and is + // removed after the measurements are done, adapted from: + // https://github.com/ckeditor/ckeditor4/blob/cae20318d46745cc46c811da4e7d68b38ca32449/core/tools.js#L899-L929 + CKEDITOR.tools.convertToPx = function (cssLength) { + const calculator = CKEDITOR.dom.element.createFromHtml( '<div style="position:absolute;left:-9999px;' + + 'top:-9999px;margin:0px;padding:0px;border:0px;"' + + '></div>', CKEDITOR.document ); + CKEDITOR.document.getBody().append(calculator); + + if ( !( /%$/ ).test( cssLength ) ) { + var isNegative = parseFloat( cssLength ) < 0, + ret; + + if ( isNegative ) { + cssLength = cssLength.replace( '-', '' ); + } + + calculator.setStyle( 'width', cssLength ); + ret = calculator.$.clientWidth; + + if (calculator.$ && calculator.$.parentNode) { + calculator.$.parentNode.removeChild(calculator.$); + } + if ( isNegative ) { + return -ret; + } + return ret; + } + + if (calculator.$ && calculator.$.parentNode) { + calculator.$.parentNode.removeChild(calculator.$); + } + return cssLength; + }; + ns.Html.current = that; ckConfig.width = this.offsetWidth - 8; // Avoid miscalculations that.ckeditor = CKEDITOR.replace(this, ckConfig); -- GitLab