Merge pull request #6736 from ckeditor/i/6333

Fix (media-embed): Made it possible to use the `mediaEmbed` button more than once (in more than one toolbar. Closes #6333.

MINOR BREAKING CHANGE: `MediaEmbedUI#form` was removed from the API.

packages/ckeditor5-media-embed/src/mediaembedui.js

@@ -41,19 +41,14 @@ export default class MediaEmbedUI extends Plugin {
 		const command = editor.commands.get( 'mediaEmbed' );
 		const registry = editor.plugins.get( MediaEmbedEditing ).registry;
 
-		/**
-		 * The form view displayed inside the drop-down.
-		 *
-		 * @member {module:media-embed/ui/mediaformview~MediaFormView}
-		 */
-		this.form = new MediaFormView( getFormValidators( editor.t, registry ), editor.locale );
-
 		// Setup `imageUpload` button.
 		editor.ui.componentFactory.add( 'mediaEmbed', locale => {
 			const dropdown = createDropdown( locale );
 
-			this._setUpDropdown( dropdown, this.form, command, editor );
-			this._setUpForm( this.form, dropdown, command );
+			const mediaForm = new MediaFormView( getFormValidators( editor.t, registry ), editor.locale );
+
+			this._setUpDropdown( dropdown, mediaForm, command, editor );
+			this._setUpForm( dropdown, mediaForm, command );
 
 			return dropdown;
 		} );
@@ -103,7 +98,7 @@ export default class MediaEmbedUI extends Plugin {
 		}
 	}
 
-	_setUpForm( form, dropdown, command ) {
+	_setUpForm( dropdown, form, command ) {
 		form.delegate( 'submit', 'cancel' ).to( dropdown );
 		form.urlInputView.bind( 'value' ).to( command, 'value' );
 

packages/ckeditor5-media-embed/tests/mediaembedui.js

@@ -53,6 +53,15 @@ describe( 'MediaEmbedUI', () => {
 		expect( dropdown ).to.be.instanceOf( DropdownView );
 	} );
 
+	it( 'should allow creating two instances', () => {
+		let secondInstance;
+
+		expect( function createSecondInstance() {
+			secondInstance = editor.ui.componentFactory.create( 'mediaEmbed' );
+		} ).not.to.throw();
+		expect( dropdown ).to.not.equal( secondInstance );
+	} );
+
 	describe( 'dropdown', () => {
 		it( 'should bind #isEnabled to the command', () => {
 			const command = editor.commands.get( 'mediaEmbed' );