Merge 00c3faa into 6ba8390

sample/index.html

@@ -22,6 +22,7 @@ <h1>CKEditor 5 – Vue.js Component – development sample</h1>
 			editor="classic"
 			tag-name="textarea"
 			v-model="editorData"
+			:editor="editor"
 			:config="editorConfig"
 			:disabled="editorDisabled"
 			@ready="onEditorReady"
@@ -40,15 +41,12 @@ <h2>Live editor data</h2>
 	</div>
 
 	<script>
-		Vue.use( CKEditor, {
-			editors: {
-				classic: ClassicEditor
-			}
-		} );
+		Vue.use( CKEditor );
 
 		const app = new Vue( {
 			el: '#app',
 			data: {
+				editor: ClassicEditor,
 				editorData: '<p>Hello world!</p>',
 				editorConfig: { toolbar: [ 'heading', '|', 'bold', 'italic' ] },
 				editorDisabled: false

src/ckeditor.js

@@ -13,7 +13,10 @@ export default {
 	},
 
 	props: {
-		editor: null,
+		editor: {
+			type: Function,
+			default: null
+		},
 		value: {
 			type: String,
 			default: ''
@@ -41,9 +44,7 @@ export default {
 	},
 
 	mounted() {
-		const creator = typeof this.editor === 'string' ? this.$_ckeditor_types[ this.editor ] : this.editor;
-
-		creator.create( this.$el, this.config )
+		this.editor.create( this.$el, this.config )
 			.then( editor => {
 				// Save the reference to the instance for further use.
 				this.instance = editor;

src/plugin.js

@@ -10,17 +10,9 @@ const CKEditor = {
 	 * Instals the plugin, registering the `<ckeditor>` component.
 	 *
 	 * @param {Vue} Vue The Vue object.
-	 * @param {Object} [config] Plugin configuration.
-	 * @param {Object.<String,Function>} [config.editors] The configuration of editor constructors and their names.
-	 * @param {String>} [config.componentName] The name of the component used in the template. `'ckeditor'` by default.
 	 */
-	install( Vue, config ) {
-		// https://github.com/gotwarlost/istanbul/issues/665
-		config = config || {};
-
-		Vue.component( config.componentName || 'ckeditor', CKEditorComponent );
-
-		Vue.prototype.$_ckeditor_types = config.editors;
+	install( Vue ) {
+		Vue.component( 'ckeditor', CKEditorComponent );
 	},
 	component: CKEditorComponent
 };

tests/ckeditor.js

@@ -11,8 +11,6 @@ import CKEditorComponent from '../src/ckeditor';
 import MockEditor from './_utils/mockeditor';
 import { ModelDocument, ViewlDocument } from './_utils/mockeditor';
 
-Vue.prototype.$_ckeditor_types = { classic: MockEditor };
-
 describe( 'CKEditor Component', () => {
 	let sandbox, wrapper, vm;
 
@@ -323,7 +321,7 @@ describe( 'CKEditor Component', () => {
 	function createComponent( props ) {
 		const wrapper = mount( CKEditorComponent, {
 			propsData: Object.assign( {}, {
-				editor: 'classic'
+				editor: MockEditor
 			}, props )
 		} );
 

tests/plugin/integration.js

@@ -8,17 +8,13 @@ import { mount } from '@vue/test-utils';
 import CKEditor from '../../src/plugin';
 import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
 
-Vue.use( CKEditor, {
-	editors: {
-		classic: ClassicEditor
-	}
-} );
+Vue.use( CKEditor );
 
 describe( 'CKEditor plugin', () => {
 	describe( 'Vue.use()', () => {
 		it( 'works with an actual editor build', done => {
 			const wrapper = mount( {
-				template: '<ckeditor editor="classic" @ready="onReady()" v-model="editorData"></ckeditor>',
+				template: '<ckeditor :editor="editor" @ready="onReady()" v-model="editorData"></ckeditor>',
 				methods: {
 					onReady: () => {
 						const instance = wrapper.vm.$children[ 0 ].instance;
@@ -34,6 +30,7 @@ describe( 'CKEditor plugin', () => {
 				attachToDocument: true,
 				data: () => {
 					return {
+						editor: ClassicEditor,
 						editorData: '<p>foo</p>'
 					};
 				}