add destroy event

docs/src/demos/Examples/CollaborativeEditing/index.vue

@@ -114,7 +114,6 @@ export default {
     return {
       name: this.getRandomName(),
       color: this.getRandomColor(),
-      provider: null,
       indexdb: null,
       editor: null,
       users: [],
@@ -123,17 +122,17 @@ export default {
 
   mounted() {
     const ydoc = new Y.Doc()
-    this.provider = new WebrtcProvider('tiptap-collaboration-example', ydoc)
+    const provider = new WebrtcProvider('tiptap-collaboration-example', ydoc)
     this.indexdb = new IndexeddbPersistence('tiptap-collaboration-example', ydoc)
 
     this.editor = new Editor({
       extensions: [
         ...defaultExtensions(),
         Collaboration.configure({
-          provider: this.provider,
+          provider,
         }),
         CollaborationCursor.configure({
-          provider: this.provider,
+          provider,
           user: {
             name: this.name,
             color: this.color,
@@ -201,7 +200,6 @@ export default {
 
   beforeDestroy() {
     this.editor.destroy()
-    this.provider.destroy()
   },
 }
 </script>

packages/core/src/Editor.ts

@@ -385,6 +385,8 @@ export class Editor extends EventEmitter {
    * Destroy the editor.
    */
   public destroy() {
+    this.emit('destroy')
+
     if (this.view) {
       this.view.destroy()
     }

packages/core/src/Extension.ts

@@ -62,6 +62,11 @@ export interface ExtensionConfig<Options = any, Commands = {}> {
     options: Options,
     editor: Editor,
   }) => Plugin[],
+
+  onDestroy?: ((this: {
+    options: Options,
+    editor: Editor,
+  }) => void) | null,
 }
 
 export class Extension<Options = any, Commands = any> {
@@ -76,6 +81,7 @@ export class Extension<Options = any, Commands = any> {
     addInputRules: () => [],
     addPasteRules: () => [],
     addProseMirrorPlugins: () => [],
+    onDestroy: null,
   }
 
   options!: Options

packages/core/src/ExtensionManager.ts

@@ -33,6 +33,10 @@ export default class ExtensionManager {
       const commands = extension.config.addCommands.bind(context)()
 
       editor.registerCommands(commands)
+
+      if (typeof extension.config.onDestroy === 'function') {
+        this.editor.on('destroy', extension.config.onDestroy.bind(context))
+      }
     })
   }
 

packages/core/src/Mark.ts

@@ -108,6 +108,12 @@ export interface MarkConfig<Options = any, Commands = {}> extends Overwrite<Exte
     editor: Editor,
     type: MarkType,
   }) => Plugin[],
+
+  onDestroy?: ((this: {
+    options: Options,
+    editor: Editor,
+    type: MarkType,
+  }) => void) | null,
 }> {}
 
 export class Mark<Options = any, Commands = {}> {
@@ -129,6 +135,7 @@ export class Mark<Options = any, Commands = {}> {
     parseHTML: () => null,
     renderHTML: null,
     addAttributes: () => ({}),
+    onDestroy: null,
   }
 
   options!: Options

packages/core/src/Node.ts

@@ -152,6 +152,12 @@ export interface NodeConfig<Options = any, Commands = {}> extends Overwrite<Exte
     editor: Editor,
     type: NodeType,
   }) => NodeViewRenderer) | null,
+
+  onDestroy?: ((this: {
+    options: Options,
+    editor: Editor,
+    type: NodeType,
+  }) => void) | null,
 }> {}
 
 export class Node<Options = any, Commands = {}> {
@@ -181,6 +187,7 @@ export class Node<Options = any, Commands = {}> {
     renderHTML: null,
     addAttributes: () => ({}),
     addNodeView: null,
+    onDestroy: null,
   }
 
   options!: Options

packages/extension-collaboration/src/index.ts

@@ -31,6 +31,10 @@ const Collaboration = Extension.create({
       'Mod-Shift-z': redo,
     }
   },
+
+  onDestroy() {
+    this.options.provider?.destroy()
+  },
 })
 
 export default Collaboration