Resolve editor.destroy() Problem (#1404)

* Resolve editor.destroy() Problem

* Resolve this.flipper undefined in inline.ts in readonly mode

* fix destroy methods

* destroy conversion toolbar on toggling read-only

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

docs/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+### 2.19.1
+
+- `Fix` - The problem with destroy() method [#1380](https://github.com/codex-team/editor.js/issues/1380)
+
 ### 2.19
 
 - `New` - Read-only mode 🥳 [#837](https://github.com/codex-team/editor.js/issues/837)

src/components/core.ts

@@ -185,7 +185,6 @@ export default class Core {
       a: true,
     } as SanitizerConfig;
 
-
     this.config.hideToolbar = this.config.hideToolbar ? this.config.hideToolbar : false;
     this.config.tools = this.config.tools || {};
     this.config.i18n = this.config.i18n || {};

src/components/modules/toolbar/blockSettings.ts

@@ -107,8 +107,14 @@ export default class BlockSettings extends Module<BlockSettingsNodes> {
    * Destroys module
    */
   public destroy(): void {
+    /**
+     * Sometimes (in read-only mode) there is no Flipper
+     */
+    if (this.flipper) {
       this.flipper.deactivate();
       this.flipper = null;
+    }
+
     this.removeAllNodes();
   }
 

src/components/modules/toolbar/conversion.ts

@@ -95,8 +95,14 @@ export default class ConversionToolbar extends Module<ConversionToolbarNodes> {
    * Deactivates flipper and removes all nodes
    */
   public destroy(): void {
+    /**
+     * Sometimes (in read-only mode) there is no Flipper
+     */
+    if (this.flipper) {
       this.flipper.deactivate();
       this.flipper = null;
+    }
+
     this.removeAllNodes();
   }
 

src/components/modules/toolbar/index.ts

@@ -150,6 +150,8 @@ export default class Toolbar extends Module<ToolbarNodes> {
       this.enableModuleBindings();
     } else {
       this.destroy();
+      this.Editor.Toolbox.destroy();
+      this.Editor.BlockSettings.destroy();
       this.disableModuleBindings();
     }
   }
@@ -381,8 +383,6 @@ export default class Toolbar extends Module<ToolbarNodes> {
    * It is used in Read-Only mode
    */
   private destroy(): void {
-    this.Editor.Toolbox.destroy();
-    this.Editor.BlockSettings.destroy();
     this.removeAllNodes();
   }
 }

src/components/modules/toolbar/inline.ts

@@ -97,6 +97,7 @@ export default class InlineToolbar extends Module<InlineToolbarNodes> {
       this.make();
     } else {
       this.destroy();
+      this.Editor.ConversionToolbar.destroy();
     }
   }
 
@@ -255,10 +256,15 @@ export default class InlineToolbar extends Module<InlineToolbarNodes> {
    * Removes UI and its components
    */
   public destroy(): void {
+    /**
+     * Sometimes (in read-only mode) there is no Flipper
+     */
+    if (this.flipper) {
       this.flipper.deactivate();
       this.flipper = null;
+    }
 
-    this.Editor.ConversionToolbar.destroy();
+    this.removeAllNodes();
   }
 
   /**

src/components/modules/toolbar/toolbox.ts

@@ -96,8 +96,14 @@ export default class Toolbox extends Module<ToolboxNodes> {
    * Destroy Module
    */
   public destroy(): void {
+    /**
+     * Sometimes (in read-only mode) there is no Flipper
+     */
+    if (this.flipper) {
       this.flipper.deactivate();
       this.flipper = null;
+    }
+
     this.removeAllNodes();
     this.removeAllShortcuts();
   }