From 88d3d65c30b14529f5f061e7285929acaee267af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Zag=C3=B3rski?= <m.zagorski@cksource.com>
Date: Thu, 10 Mar 2022 16:15:22 +0100
Subject: [PATCH] Test coverage added.

---
 src/mermaidui.js   |  6 +++++-
 tests/mermaidui.js | 28 +++++++++++++++++++++++++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/mermaidui.js b/src/mermaidui.js
index 09d29be1d..16b0c1b8d 100644
--- a/src/mermaidui.js
+++ b/src/mermaidui.js
@@ -69,7 +69,11 @@ export default class MermaidUI extends Plugin {
 			command.listenTo( buttonView, 'execute', () => {
 				const mermaidItem = editor.execute( 'insertMermaidCommand' );
 				const mermaidItemViewElement = editor.editing.mapper.toViewElement( mermaidItem );
-				const mermaidItemDomElement = view.domConverter.viewToDom( mermaidItemViewElement, document );
+				let mermaidItemDomElement;
+
+				if ( mermaidItemViewElement ) {
+					mermaidItemDomElement = view.domConverter.viewToDom( mermaidItemViewElement, document );
+				}
 
 				view.scrollToTheSelection();
 				view.focus();
diff --git a/tests/mermaidui.js b/tests/mermaidui.js
index 5b3077853..53d424236 100644
--- a/tests/mermaidui.js
+++ b/tests/mermaidui.js
@@ -1,4 +1,6 @@
 import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
+import { getData as getModelData, setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { Paragraph } from '@ckeditor/ckeditor5-paragraph';
 
 import Mermaid from '../src/mermaid';
 import MermaidUI from '../src/mermaidui';
@@ -19,7 +21,8 @@ describe( 'MermaidUI', () => {
 
 			editor = await ClassicEditor.create( domElement, {
 				plugins: [
-					Mermaid
+					Mermaid,
+					Paragraph
 				]
 			} );
 		} );
@@ -61,6 +64,29 @@ describe( 'MermaidUI', () => {
 				} );
 			}
 		} );
+
+		it( 'should set focus inside textarea of a newly created mermaid', () => {
+			const button = editor.ui.componentFactory.create( 'mermaid' );
+
+			button.fire( 'execute' );
+
+			expect( document.activeElement.tagName ).to.equal( 'TEXTAREA' );
+		} );
+
+		it( 'should not crash if the button is fired inside model.change()', () => {
+			const button = editor.ui.componentFactory.create( 'mermaid' );
+
+			setModelData( editor.model,
+				'<paragraph>[foo]</paragraph>'
+			);
+
+			editor.model.change( () => {
+				button.fire( 'execute' );
+			} );
+			// As the conversion is to be executed after the model.change(), we don't have access to the fully prepared view and
+			// despite that, we should still successfully add mermaid widget to the editor, not requiring the selection change
+			// to the inside of the nonexisting textarea element.
+		} );
 	} );
 } );