8
0
Эх сурвалжийг харах

Fix reference to the new ResizeObserver class

panr 5 жил өмнө
parent
commit
260b029f1d

+ 23 - 3
packages/ckeditor5-editor-inline/src/inlineeditoruiview.js

@@ -12,7 +12,7 @@ import InlineEditableUIView from '@ckeditor/ckeditor5-ui/src/editableui/inline/i
 import BalloonPanelView from '@ckeditor/ckeditor5-ui/src/panel/balloon/balloonpanelview';
 import ToolbarView from '@ckeditor/ckeditor5-ui/src/toolbar/toolbarview';
 import Rect from '@ckeditor/ckeditor5-utils/src/dom/rect';
-import getResizeObserver from '@ckeditor/ckeditor5-utils/src/dom/getresizeobserver';
+import ResizeObserver from '@ckeditor/ckeditor5-utils/src/dom/resizeobserver';
 import toUnit from '@ckeditor/ckeditor5-utils/src/dom/tounit';
 
 const toPx = toUnit( 'px' );
@@ -141,6 +141,17 @@ export default class InlineEditorUIView extends EditorUIView {
 		 * @member {module:ui/editableui/inline/inlineeditableuiview~InlineEditableUIView}
 		 */
 		this.editable = new InlineEditableUIView( locale, editingView, editableElement );
+
+		/**
+		 * An instance of the resize observer that helps dynamically determine the geometry of the toolbar
+		 * and manage items that do not fit into a single row.
+		 *
+		 * **Note:** Created in {@link #render}.
+		 *
+		 * @readonly
+		 * @member {module:utils/dom/getresizeobserver~ResizeObserver}
+		 */
+		this.resizeObserver = null;
 	}
 
 	/**
@@ -159,7 +170,7 @@ export default class InlineEditorUIView extends EditorUIView {
 		// if 'shouldToolbarGroupWhenFull' in config is set to 'true'.
 		if ( options.shouldGroupWhenFull ) {
 			const editableElement = this.editable.element;
-			const widthObserver = getResizeObserver( () => {
+			this.resizeObserver = new ResizeObserver( editableElement, () => {
 				// We need to check if there's already the editable element in the DOM.
 				// Otherwise the `Rect` instance will complain that source (editableElement) is not available
 				// to obtain the element's geometry.
@@ -169,8 +180,17 @@ export default class InlineEditorUIView extends EditorUIView {
 
 				this.toolbar.maxWidth = toPx( new Rect( editableElement ).width );
 			} );
+		}
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	destroy() {
+		super.destroy();
 
-			widthObserver.observe( editableElement );
+		if ( this.resizeObserver ) {
+			this.resizeObserver.destroy();
 		}
 	}