8
0
Просмотр исходного кода

Auto-media embed is now a separate plugin. Changed the delay from 500ms to 100ms.

Kamil Piechaczek 7 лет назад
Родитель
Сommit
b0bc3cb27a

+ 113 - 0
packages/ckeditor5-media-embed/src/automediaembed.js

@@ -0,0 +1,113 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @module media-embed/automediaembed
+ */
+
+import MediaEmbedEditing from './mediaembedediting';
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
+import Range from '@ckeditor/ckeditor5-engine/src/model/range';
+import Position from '@ckeditor/ckeditor5-engine/src/model/position';
+import LivePosition from '@ckeditor/ckeditor5-engine/src/model/liveposition';
+import TreeWalker from '@ckeditor/ckeditor5-engine/src/model/treewalker';
+import global from '@ckeditor/ckeditor5-utils/src/dom/global';
+
+const URL_REGEXP = /^(?:http(s)?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w\-._~:/?#[\]@!$&'()*+,;=]+$/;
+
+/**
+ * The auto-media embed plugin.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class AutoMediaEmbed extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get requires() {
+		return [ Clipboard ];
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'AutoMediaEmbed';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const modelDocument = editor.model.document;
+		const mediaRegistry = editor.plugins.get( MediaEmbedEditing ).registry;
+
+		let leftLivePosition, rightLivePosition;
+
+		// We need to listen on `Clipboard#inputTransformation` because we need to save positions of selection.
+		// After pasting a content, between those position can be located a URL that should be transformed to media.
+		this.listenTo( editor.plugins.get( Clipboard ), 'inputTransformation', () => {
+			const firstRange = modelDocument.selection.getFirstRange();
+
+			leftLivePosition = LivePosition.createFromPosition( firstRange.start );
+			leftLivePosition.stickiness = 'toPrevious';
+
+			rightLivePosition = LivePosition.createFromPosition( firstRange.end );
+			rightLivePosition.stickiness = 'toNext';
+		} );
+
+		modelDocument.on( 'change:data', () => {
+			if ( !leftLivePosition ) {
+				return;
+			}
+
+			const urlRange = new Range( leftLivePosition, rightLivePosition );
+			const walker = new TreeWalker( { boundaries: urlRange, ignoreElementEnd: true } );
+
+			let url = '';
+
+			for ( const node of walker ) {
+				if ( node.type === 'elementStart' ) {
+					return detach();
+				}
+
+				url += node.item.data;
+			}
+
+			url = url.trim();
+
+			// If the url does not match to universal url regexp, let's skip that.
+			if ( !url.match( URL_REGEXP ) ) {
+				return detach();
+			}
+
+			// If the url is valid from MediaEmbed plugin point of view, let's use it.
+			if ( !mediaRegistry.hasMedia( url ) ) {
+				return detach();
+			}
+
+			// `leftLivePosition` won't be available in `setTimeout` function so let's clone it.
+			const positionToInsert = Position.createFromPosition( leftLivePosition );
+
+			global.window.setTimeout( () => {
+				editor.model.change( writer => {
+					writer.remove( urlRange );
+					writer.setSelection( positionToInsert );
+					editor.commands.execute( 'mediaEmbed', url );
+				} );
+			}, 100 );
+		} );
+
+		function detach() {
+			leftLivePosition.detach();
+			rightLivePosition.detach();
+
+			leftLivePosition = null;
+			rightLivePosition = null;
+		}
+	}
+}

+ 2 - 92
packages/ckeditor5-media-embed/src/mediaembed.js

@@ -8,17 +8,10 @@
  */
  */
 
 
 import MediaEmbedEditing from './mediaembedediting';
 import MediaEmbedEditing from './mediaembedediting';
+import AutoMediaEmbed from './automediaembed';
 import MediaEmbedUI from './mediaembedui';
 import MediaEmbedUI from './mediaembedui';
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
-import Range from '@ckeditor/ckeditor5-engine/src/model/range';
-import Position from '@ckeditor/ckeditor5-engine/src/model/position';
-import LivePosition from '@ckeditor/ckeditor5-engine/src/model/liveposition';
-import TreeWalker from '@ckeditor/ckeditor5-engine/src/model/treewalker';
-import global from '@ckeditor/ckeditor5-utils/src/dom/global';
-
-const URL_REGEXP = /^(?:http(s)?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w\-._~:/?#[\]@!$&'()*+,;=]+$/;
 
 
 /**
 /**
  * The media embed plugin.
  * The media embed plugin.
@@ -35,7 +28,7 @@ export default class MediaEmbed extends Plugin {
 	 * @inheritDoc
 	 * @inheritDoc
 	 */
 	 */
 	static get requires() {
 	static get requires() {
-		return [ MediaEmbedEditing, MediaEmbedUI, Widget, Clipboard ];
+		return [ MediaEmbedEditing, MediaEmbedUI, AutoMediaEmbed, Widget ];
 	}
 	}
 
 
 	/**
 	/**
@@ -44,89 +37,6 @@ export default class MediaEmbed extends Plugin {
 	static get pluginName() {
 	static get pluginName() {
 		return 'MediaEmbed';
 		return 'MediaEmbed';
 	}
 	}
-
-	/**
-	 * @inheritDoc
-	 */
-	init() {
-		this._attachAutoEmbedingEvents();
-	}
-
-	/**
-	 * Attach events required for "auto-embeding" feature.
-	 *
-	 * @private
-	 */
-	_attachAutoEmbedingEvents() {
-		const editor = this.editor;
-		const modelDocument = editor.model.document;
-		const mediaRegistry = editor.plugins.get( MediaEmbedEditing ).registry;
-
-		let leftLivePosition, rightLivePosition;
-
-		// We need to listen on `Clipboard#inputTransformation` because we need to save positions of selection.
-		// After pasting a content, between those position can be located a URL that should be transformed to media.
-		this.listenTo( editor.plugins.get( Clipboard ), 'inputTransformation', () => {
-			const firstRange = modelDocument.selection.getFirstRange();
-
-			leftLivePosition = LivePosition.createFromPosition( firstRange.start );
-			leftLivePosition.stickiness = 'toPrevious';
-
-			rightLivePosition = LivePosition.createFromPosition( firstRange.end );
-			rightLivePosition.stickiness = 'toNext';
-		} );
-
-		modelDocument.on( 'change:data', () => {
-			if ( !leftLivePosition ) {
-				return;
-			}
-
-			const urlRange = new Range( leftLivePosition, rightLivePosition );
-			const walker = new TreeWalker( { boundaries: urlRange, ignoreElementEnd: true } );
-
-			let url = '';
-
-			for ( const node of walker ) {
-				if ( node.type === 'elementStart' ) {
-					return detach();
-				}
-
-				url += node.item.data;
-			}
-
-			// If the url does not match to universal url regexp, let's skip that.
-			if ( !url.match( URL_REGEXP ) ) {
-				return detach();
-			}
-
-			// If the url is valid from MediaEmbed plugin point of view, let's use it.
-			if ( !mediaRegistry.hasMedia( url ) ) {
-				return detach();
-			}
-
-			// `leftLivePosition` won't be available in `setTimeout` function so let's clone it.
-			const positionToInsert = Position.createFromPosition( leftLivePosition );
-
-			global.window.setTimeout( () => {
-				editor.model.change( writer => {
-					// const mediaElement = writer.createElement( 'media', { url } );
-
-					writer.remove( urlRange );
-					// writer.insert( mediaElement, positionToInsert );
-					writer.setSelection( positionToInsert );
-					editor.commands.execute( 'mediaEmbed', url );
-				} );
-			}, 500 );
-		} );
-
-		function detach() {
-			leftLivePosition.detach();
-			rightLivePosition.detach();
-
-			leftLivePosition = null;
-			rightLivePosition = null;
-		}
-	}
 }
 }
 
 
 /**
 /**

+ 327 - 0
packages/ckeditor5-media-embed/tests/automediaembed.js

@@ -0,0 +1,327 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+import MediaEmbed from '../src/mediaembed';
+import AutoMediaEmbed from '../src/automediaembed';
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
+import Link from '@ckeditor/ckeditor5-link/src/link';
+import List from '@ckeditor/ckeditor5-list/src/list';
+import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
+import Undo from '@ckeditor/ckeditor5-undo/src/undo';
+import global from '@ckeditor/ckeditor5-utils/src/dom/global';
+import { getData, setData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+
+describe( 'AutoMediaEmbed - integration', () => {
+	let editorElement, editor;
+
+	beforeEach( () => {
+		editorElement = global.document.createElement( 'div' );
+		global.document.body.appendChild( editorElement );
+
+		return ClassicTestEditor
+			.create( editorElement, {
+				plugins: [ MediaEmbed, AutoMediaEmbed, Link, List, Bold, Undo ]
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		editorElement.remove();
+
+		return editor.destroy();
+	} );
+
+	it( 'should load Clipboard plugin', () => {
+		expect( editor.plugins.get( Clipboard ) ).to.instanceOf( Clipboard );
+	} );
+
+	it( 'has proper name', () => {
+		expect( AutoMediaEmbed.pluginName ).to.equal( 'AutoMediaEmbed' );
+	} );
+
+	describe( 'auto-media embed', () => {
+		let clock;
+
+		beforeEach( () => {
+			clock = sinon.useFakeTimers();
+		} );
+
+		afterEach( () => {
+			clock.restore();
+		} );
+
+		it( 'replaces pasted text with media element after 100ms', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
+			);
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'can undo auto-embeding', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
+			);
+
+			clock.tick( 100 );
+
+			editor.commands.execute( 'undo' );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
+			);
+		} );
+
+		it( 'works for a full URL (https + "www" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for a full URL (https without "wwww" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for a full URL (http + "www" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'http://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="http://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for a full URL (http without "wwww" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'http://youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="http://youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for a URL without protocol (with "www" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for a URL without protocol (without "www" sub-domain)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works fine if a media has no preview', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://twitter.com/ckeditor/status/1035181110140063749' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://twitter.com/ckeditor/status/1035181110140063749"></media>]'
+			);
+		} );
+
+		it( 'works for URL that was pasted as a link', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, '<a href="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4</a>' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for URL that contains some inline styles', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, '<b>https://www.youtube.com/watch?v=H08tGjXNHO4</b>' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for not collapsed selection inside single element', () => {
+			setData( editor.model, '<paragraph>[Foo]</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'works for not collapsed selection over a few elements', () => {
+			setData( editor.model, '<paragraph>Fo[o</paragraph><paragraph>Ba]r</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>For</paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
+			);
+		} );
+
+		it( 'does nothing if a URL is invalid', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://youtube.com' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://youtube.com[]</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if pasted two links as text', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4 https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4 https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if pasted text contains a valid URL', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'Foo bar https://www.youtube.com/watch?v=H08tGjXNHO4 bar foo.' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>Foo bar https://www.youtube.com/watch?v=H08tGjXNHO4 bar foo.[]</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if pasted more than single node', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor,
+				'https://www.youtube.com/watch?v=H08tGjXNHO4 ' +
+				'<a href="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4</a>'
+			);
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4 ' +
+				'<$text linkHref="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4[]</$text>' +
+				'</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if pastes a block of content that looks like a URL', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, '<ul><li>https://</li><li>youtube.com/watch?</li></ul><p>v=H08tGjXNHO4</p>' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<listItem listIndent="0" listType="bulleted">https://</listItem>' +
+				'<listItem listIndent="0" listType="bulleted">youtube.com/watch?</listItem>' +
+				'<paragraph>v=H08tGjXNHO4[]</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if a URL is invalid (space inside URL)', () => {
+			setData( editor.model, '<paragraph>[]</paragraph>' );
+			pasteHtml( editor, 'youtube.com/watch?v=H08tGjXNHO4&amp;param=foo bar' );
+
+			clock.tick( 100 );
+
+			expect( getData( editor.model ) ).to.equal(
+				'<paragraph>youtube.com/watch?v=H08tGjXNHO4&param=foo bar[]</paragraph>'
+			);
+		} );
+
+		it( 'does nothing if URL match to media but it was removed', () => {
+			return ClassicTestEditor
+				.create( editorElement, {
+					plugins: [ MediaEmbed, AutoMediaEmbed, Paragraph ],
+					mediaEmbed: {
+						removeProviders: [ 'youtube' ]
+					}
+				} )
+				.then( newEditor => {
+					editor = newEditor;
+
+					setData( editor.model, '<paragraph>[]</paragraph>' );
+					pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
+
+					clock.tick( 100 );
+
+					expect( getData( editor.model ) ).to.equal(
+						'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
+					);
+
+					editorElement.remove();
+
+					return editor.destroy();
+				} );
+		} );
+
+		function pasteHtml( editor, html ) {
+			editor.editing.view.document.fire( 'paste', {
+				dataTransfer: createDataTransfer( { 'text/html': html } ),
+				preventDefault() {
+				}
+			} );
+		}
+
+		function createDataTransfer( data ) {
+			return {
+				getData( type ) {
+					return data[ type ];
+				}
+			};
+		}
+	} );
+} );

+ 1 - 1
packages/ckeditor5-media-embed/tests/manual/mediaembed.md

@@ -3,7 +3,7 @@
 ### Embed the media
 ### Embed the media
 
 
 1. Put an URL in the clipboard,
 1. Put an URL in the clipboard,
-1. Use the button in the dropdown,
+1. Use the button in the dropdown or paste the URL directly in the editor,
 1. Insert the media,
 1. Insert the media,
 1. Check if media was inserted and is selected.
 1. Check if media was inserted and is selected.
 
 

+ 1 - 1
packages/ckeditor5-media-embed/tests/manual/semanticmediaembed.md

@@ -3,7 +3,7 @@
 ### Embed the media
 ### Embed the media
 
 
 1. Put an URL in the clipboard,
 1. Put an URL in the clipboard,
-1. Use the button in the dropdown,
+1. Use the button in the dropdown or paste the URL directly in the editor,
 1. Insert the media,
 1. Insert the media,
 1. Check if media was inserted and is selected.
 1. Check if media was inserted and is selected.
 
 

+ 6 - 292
packages/ckeditor5-media-embed/tests/mediaembed.js

@@ -7,15 +7,9 @@ import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictest
 import MediaEmbed from '../src/mediaembed';
 import MediaEmbed from '../src/mediaembed';
 import MediaEmbedEditing from '../src/mediaembedediting';
 import MediaEmbedEditing from '../src/mediaembedediting';
 import MediaEmbedUI from '../src/mediaembedui';
 import MediaEmbedUI from '../src/mediaembedui';
+import AutoMediaEmbed from '../src/automediaembed';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
-import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
-import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
-import Link from '@ckeditor/ckeditor5-link/src/link';
-import List from '@ckeditor/ckeditor5-list/src/list';
-import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
-import Undo from '@ckeditor/ckeditor5-undo/src/undo';
 import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 import global from '@ckeditor/ckeditor5-utils/src/dom/global';
-import { getData, setData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 
 
 describe( 'MediaEmbed', () => {
 describe( 'MediaEmbed', () => {
 	let editorElement, editor;
 	let editorElement, editor;
@@ -26,7 +20,7 @@ describe( 'MediaEmbed', () => {
 
 
 		return ClassicTestEditor
 		return ClassicTestEditor
 			.create( editorElement, {
 			.create( editorElement, {
-				plugins: [ MediaEmbed, Paragraph, Link, Bold, Undo, List ]
+				plugins: [ MediaEmbed ]
 			} )
 			} )
 			.then( newEditor => {
 			.then( newEditor => {
 				editor = newEditor;
 				editor = newEditor;
@@ -51,295 +45,15 @@ describe( 'MediaEmbed', () => {
 		expect( editor.plugins.get( Widget ) ).to.instanceOf( Widget );
 		expect( editor.plugins.get( Widget ) ).to.instanceOf( Widget );
 	} );
 	} );
 
 
-	it( 'should load Clipboard plugin', () => {
-		expect( editor.plugins.get( Clipboard ) ).to.instanceOf( Clipboard );
-	} );
-
 	it( 'should load MediaEmbedUI plugin', () => {
 	it( 'should load MediaEmbedUI plugin', () => {
 		expect( editor.plugins.get( MediaEmbedUI ) ).to.instanceOf( MediaEmbedUI );
 		expect( editor.plugins.get( MediaEmbedUI ) ).to.instanceOf( MediaEmbedUI );
 	} );
 	} );
 
 
-	it( 'has proper name', () => {
-		expect( MediaEmbed.pluginName ).to.equal( 'MediaEmbed' );
+	it( 'should load AutoMediaEmbed plugin', () => {
+		expect( editor.plugins.get( AutoMediaEmbed ) ).to.instanceOf( AutoMediaEmbed );
 	} );
 	} );
 
 
-	describe( 'auto-media embed', () => {
-		let clock;
-
-		beforeEach( () => {
-			clock = sinon.useFakeTimers();
-		} );
-
-		afterEach( () => {
-			clock.restore();
-		} );
-
-		it( 'replaces pasted text with media element after 500ms', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
-			);
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'can undo auto-embeding', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
-			);
-
-			clock.tick( 500 );
-
-			editor.commands.execute( 'undo' );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
-			);
-		} );
-
-		it( 'works for a full URL (https + "www" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for a full URL (https without "wwww" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for a full URL (http + "www" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'http://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="http://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for a full URL (http without "wwww" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'http://youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="http://youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for a URL without protocol (with "www" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for a URL without protocol (without "www" sub-domain)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works fine if a media has no preview', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://twitter.com/ckeditor/status/1035181110140063749' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://twitter.com/ckeditor/status/1035181110140063749"></media>]'
-			);
-		} );
-
-		it( 'works for URL that was pasted as a link', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, '<a href="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4</a>' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for URL that contains some inline styles', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, '<b>https://www.youtube.com/watch?v=H08tGjXNHO4</b>' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for not collapsed selection inside single element', () => {
-			setData( editor.model, '<paragraph>[Foo]</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph></paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'works for not collapsed selection over a few elements', () => {
-			setData( editor.model, '<paragraph>Fo[o</paragraph><paragraph>Ba]r</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>For</paragraph>[<media url="https://www.youtube.com/watch?v=H08tGjXNHO4"></media>]'
-			);
-		} );
-
-		it( 'does nothing if a URL is invalid', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://youtube.com' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://youtube.com[]</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if pasted two links as text', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4 https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4 https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if pasted text contains a valid URL', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'Foo bar https://www.youtube.com/watch?v=H08tGjXNHO4 bar foo.' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>Foo bar https://www.youtube.com/watch?v=H08tGjXNHO4 bar foo.[]</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if pasted more than single node', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor,
-				'https://www.youtube.com/watch?v=H08tGjXNHO4 ' +
-				'<a href="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4</a>'
-			);
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4 ' +
-					'<$text linkHref="https://www.youtube.com/watch?v=H08tGjXNHO4">https://www.youtube.com/watch?v=H08tGjXNHO4[]</$text>' +
-				'</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if pastes a block of content that looks like a URL', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, '<ul><li>https://</li><li>youtube.com/watch?</li></ul><p>v=H08tGjXNHO4</p>' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<listItem listIndent="0" listType="bulleted">https://</listItem>' +
-				'<listItem listIndent="0" listType="bulleted">youtube.com/watch?</listItem>' +
-				'<paragraph>v=H08tGjXNHO4[]</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if a URL is invalid (space inside URL)', () => {
-			setData( editor.model, '<paragraph>[]</paragraph>' );
-			pasteHtml( editor, 'youtube.com/watch?v=H08tGjXNHO4&amp;param=foo bar' );
-
-			clock.tick( 500 );
-
-			expect( getData( editor.model ) ).to.equal(
-				'<paragraph>youtube.com/watch?v=H08tGjXNHO4&param=foo bar[]</paragraph>'
-			);
-		} );
-
-		it( 'does nothing if URL match to media but it was removed', () => {
-			return ClassicTestEditor
-				.create( editorElement, {
-					plugins: [ MediaEmbed, Paragraph ],
-					mediaEmbed: {
-						removeProviders: [ 'youtube' ]
-					}
-				} )
-				.then( newEditor => {
-					editor = newEditor;
-
-					setData( editor.model, '<paragraph>[]</paragraph>' );
-					pasteHtml( editor, 'https://www.youtube.com/watch?v=H08tGjXNHO4' );
-
-					clock.tick( 500 );
-
-					expect( getData( editor.model ) ).to.equal(
-						'<paragraph>https://www.youtube.com/watch?v=H08tGjXNHO4[]</paragraph>'
-					);
-
-					editorElement.remove();
-
-					return editor.destroy();
-				} );
-		} );
-
-		function pasteHtml( editor, html ) {
-			editor.editing.view.document.fire( 'paste', {
-				dataTransfer: createDataTransfer( { 'text/html': html } ),
-				preventDefault() {
-				}
-			} );
-		}
-
-		function createDataTransfer( data ) {
-			return {
-				getData( type ) {
-					return data[ type ];
-				}
-			};
-		}
+	it( 'has proper name', () => {
+		expect( MediaEmbed.pluginName ).to.equal( 'MediaEmbed' );
 	} );
 	} );
 } );
 } );