diff --git a/sample/index.html b/sample/index.html
index e48cbba..324af92 100644
--- a/sample/index.html
+++ b/sample/index.html
@@ -1,5 +1,6 @@
+
CKEditor 5 Mermaid widget – Development Sample
@@ -10,13 +11,15 @@
}
+
-CKEditor 5 Mermaid widget – Development Sample
+ CKEditor 5 Mermaid widget – Development Sample
-
-
+
+
-
+
+
diff --git a/src/mermaidediting.js b/src/mermaidediting.js
index dc6acb5..c49abe6 100644
--- a/src/mermaidediting.js
+++ b/src/mermaidediting.js
@@ -174,19 +174,27 @@ export default class MermaidEditing extends Plugin {
domElement.addEventListener( 'input', debouncedListener );
/* Workaround for internal #1544 */
- domElement.addEventListener( 'focus', () => {
- const model = editor.model;
- const selectedElement = model.document.selection.getSelectedElement();
+ domElement.addEventListener( 'focus', focusListener, true );
- // Move the selection onto the mermaid widget if it's currently not selected.
- if ( selectedElement !== data.item ) {
- model.change( writer => writer.setSelection( data.item, 'on' ) );
- }
- }, true );
+ // Remove the focus and input listener on editor#destroy.
+ editor.on( 'destroy', () => {
+ domElement.removeEventListener( 'input', debouncedListener );
+ domElement.removeEventListener( 'focus', focusListener );
+ } );
return domElement;
}
+ function focusListener( ) {
+ const model = editor.model;
+ const selectedElement = model.document.selection.getSelectedElement();
+
+ // Move the selection onto the mermaid widget if it's currently not selected.
+ if ( selectedElement !== data.item ) {
+ model.change( writer => writer.setSelection( data.item, 'on' ) );
+ }
+ }
+
function createMermaidPreview( domDocument ) {
// Taking the text from the wrapper container element for now
const mermaidSource = data.item.getAttribute( 'source' );