Przeglądaj źródła

Split the Indent plugin to Indent, IndentEditing and IndentUI.

Maciej Gołaszewski 6 lat temu
rodzic
commit
78bd09a033

+ 13 - 42
packages/ckeditor5-core/src/indent.js

@@ -6,23 +6,29 @@
 /**
  * @module core/indent
  */
-import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
 
 import Plugin from './plugin';
-import MultiCommand from './multicommand';
+
+import IndentEditing from './indentediting';
+import IndentUI from './indentui';
 
 /**
  * The indent feature.
  *
  * This plugin acts as a single entry point plugin for other features that implements indenting of elements like list or paragraphs.
  *
- * It registers the `'indent'` and `'outdent'` commands and it introduces the `'indent'` and `'outdent'` buttons that allow to
- * increase or decrease text indentation of supported elements.
- *
  * The compatible features are:
  * - the {@link module:list/list~List} or {@link module:list/listediting~ListEditing} feature for list indentation
  * - the {@link module:indent-block/indentblock~IndentBlock} feature for indenting text blocks like paragraphs or headings
  *
+ * This is a "glue" plugin which loads the following plugins:
+ *
+ * * The {@link module:core/indentediting~IndentEditing indent editing feature} and
+ * * The {@link module:core/indentui~IndentUI indent UI feature}.
+ *
+ * The dependent plugins registers the `'indent'` and `'outdent'` commands and it introduces the `'indent'` and `'outdent'` buttons
+ * that allow to increase or decrease text indentation of supported elements.
+ *
  * **Note**: In order the commands and buttons to work at least one of compatible features is required.
  *
  * @extends module:core/plugin~Plugin
@@ -38,42 +44,7 @@ export default class Indent extends Plugin {
 	/**
 	 * @inheritDoc
 	 */
-	init() {
-		const editor = this.editor;
-		const t = editor.t;
-
-		editor.commands.add( 'indent', new MultiCommand( editor ) );
-		editor.commands.add( 'outdent', new MultiCommand( editor ) );
-
-		this._defineButton( 'indent', t( 'Increase indent' ) );
-		this._defineButton( 'outdent', t( 'Decrease indent' ) );
-	}
-
-	/**
-	 * Defines an UI button.
-	 *
-	 * @param {String} commandName
-	 * @param {String} label
-	 * @private
-	 */
-	_defineButton( commandName, label ) {
-		const editor = this.editor;
-
-		editor.ui.componentFactory.add( commandName, locale => {
-			const command = editor.commands.get( commandName );
-			const view = new ButtonView( locale );
-
-			view.set( {
-				label,
-				withText: true,
-				tooltip: true
-			} );
-
-			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
-
-			this.listenTo( view, 'execute', () => editor.execute( commandName ) );
-
-			return view;
-		} );
+	static get requires() {
+		return [ IndentEditing, IndentUI ];
 	}
 }

+ 40 - 0
packages/ckeditor5-core/src/indentediting.js

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module core/indentediting
+ */
+
+import Plugin from './plugin';
+import MultiCommand from './multicommand';
+
+/**
+ * The indent editing feature.
+ *
+ * This plugin registers the `'indent'` and `'outdent'` commands.
+ *
+ * **Note**: In order the commands to work at least one of compatible features is required. Read more in
+ * {@link module:core/indent~Indent indent feature} api docs.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class IndentEditing extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'IndentEditing';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+
+		editor.commands.add( 'indent', new MultiCommand( editor ) );
+		editor.commands.add( 'outdent', new MultiCommand( editor ) );
+	}
+}

+ 69 - 0
packages/ckeditor5-core/src/indentui.js

@@ -0,0 +1,69 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module core/indentui
+ */
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+
+import Plugin from './plugin';
+
+/**
+ * The indent feature.
+ *
+ * This plugin registers the `'indent'` and `'outdent'` buttons.
+ *
+ * **Note**: In order the commands to work at least one of compatible features is required. Read more in
+ * {@link module:core/indent~Indent indent feature} api docs.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class IndentUI extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'IndentUI';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		this._defineButton( 'indent', t( 'Increase indent' ) );
+		this._defineButton( 'outdent', t( 'Decrease indent' ) );
+	}
+
+	/**
+	 * Defines an UI button.
+	 *
+	 * @param {String} commandName
+	 * @param {String} label
+	 * @private
+	 */
+	_defineButton( commandName, label ) {
+		const editor = this.editor;
+
+		editor.ui.componentFactory.add( commandName, locale => {
+			const command = editor.commands.get( commandName );
+			const view = new ButtonView( locale );
+
+			view.set( {
+				label,
+				withText: true,
+				tooltip: true
+			} );
+
+			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
+
+			this.listenTo( view, 'execute', () => editor.execute( commandName ) );
+
+			return view;
+		} );
+	}
+}

+ 7 - 47
packages/ckeditor5-core/tests/indent.js

@@ -7,12 +7,12 @@
 
 import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
 import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
-import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
 
 import Indent from '../src/indent';
-import MultiCommand from '../src/multicommand';
+import IndentEditing from '../src/indentediting';
+import IndentUI from '../src/indentui';
 
-describe( 'indent', () => {
+describe( 'Indent', () => {
 	let editor, element;
 
 	testUtils.createSinonSandbox();
@@ -40,51 +40,11 @@ describe( 'indent', () => {
 		expect( Indent.pluginName ).to.equal( 'Indent' );
 	} );
 
-	it( 'should be loaded', () => {
-		expect( editor.plugins.get( Indent ) ).to.be.instanceOf( Indent );
+	it( 'should load the IndentUI plugin', () => {
+		expect( editor.plugins.get( IndentUI ) ).to.be.instanceOf( IndentUI );
 	} );
 
-	it( 'should register indent command', () => {
-		const command = editor.commands.get( 'indent' );
-
-		expect( command ).to.be.instanceof( MultiCommand );
-	} );
-
-	it( 'should register outdent command', () => {
-		const command = editor.commands.get( 'outdent' );
-
-		expect( command ).to.be.instanceof( MultiCommand );
-	} );
-
-	it( 'should set up button for indent', () => {
-		const indentButton = editor.ui.componentFactory.create( 'indent' );
-
-		expect( indentButton ).to.be.instanceOf( ButtonView );
-	} );
-
-	it( 'should set up button for indent', () => {
-		const outdentButton = editor.ui.componentFactory.create( 'outdent' );
-
-		expect( outdentButton ).to.be.instanceOf( ButtonView );
-	} );
-
-	it( 'should execute indent command on button execute', () => {
-		const button = editor.ui.componentFactory.create( 'indent' );
-		const spy = sinon.spy( editor, 'execute' );
-
-		button.fire( 'execute' );
-
-		sinon.assert.calledOnce( spy );
-		sinon.assert.calledWithExactly( spy, 'indent' );
-	} );
-
-	it( 'should execute outdent command on button execute', () => {
-		const button = editor.ui.componentFactory.create( 'outdent' );
-		const spy = sinon.spy( editor, 'execute' );
-
-		button.fire( 'execute' );
-
-		sinon.assert.calledOnce( spy );
-		sinon.assert.calledWithExactly( spy, 'outdent' );
+	it( 'should load the IndentEditing plugin', () => {
+		expect( editor.plugins.get( IndentEditing ) ).to.be.instanceOf( IndentEditing );
 	} );
 } );

+ 57 - 0
packages/ckeditor5-core/tests/indentediting.js

@@ -0,0 +1,57 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* global document */
+
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
+
+import MultiCommand from '../src/multicommand';
+import IndentEditing from '../src/indentediting';
+
+describe( 'IndentEditing', () => {
+	let editor, element;
+
+	testUtils.createSinonSandbox();
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, { plugins: [ IndentEditing ] } )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		if ( editor ) {
+			return editor.destroy();
+		}
+	} );
+
+	it( 'should be named', () => {
+		expect( IndentEditing.pluginName ).to.equal( 'IndentEditing' );
+	} );
+
+	it( 'should be loaded', () => {
+		expect( editor.plugins.get( IndentEditing ) ).to.be.instanceOf( IndentEditing );
+	} );
+
+	it( 'should register indent command', () => {
+		const command = editor.commands.get( 'indent' );
+
+		expect( command ).to.be.instanceof( MultiCommand );
+	} );
+
+	it( 'should register outdent command', () => {
+		const command = editor.commands.get( 'outdent' );
+
+		expect( command ).to.be.instanceof( MultiCommand );
+	} );
+} );

+ 78 - 0
packages/ckeditor5-core/tests/indentui.js

@@ -0,0 +1,78 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* global document */
+
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+
+import IndentEditing from '../src/indentediting';
+import IndentUI from '../src/indentui';
+
+describe( 'IndentUI', () => {
+	let editor, element;
+
+	testUtils.createSinonSandbox();
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, { plugins: [ IndentUI, IndentEditing ] } )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		if ( editor ) {
+			return editor.destroy();
+		}
+	} );
+
+	it( 'should be named', () => {
+		expect( IndentUI.pluginName ).to.equal( 'IndentUI' );
+	} );
+
+	it( 'should be loaded', () => {
+		expect( editor.plugins.get( IndentUI ) ).to.be.instanceOf( IndentUI );
+	} );
+
+	it( 'should set up button for indent', () => {
+		const indentButton = editor.ui.componentFactory.create( 'indent' );
+
+		expect( indentButton ).to.be.instanceOf( ButtonView );
+	} );
+
+	it( 'should set up button for indent', () => {
+		const outdentButton = editor.ui.componentFactory.create( 'outdent' );
+
+		expect( outdentButton ).to.be.instanceOf( ButtonView );
+	} );
+
+	it( 'should execute indent command on button execute', () => {
+		const button = editor.ui.componentFactory.create( 'indent' );
+		const spy = sinon.spy( editor, 'execute' );
+
+		button.fire( 'execute' );
+
+		sinon.assert.calledOnce( spy );
+		sinon.assert.calledWithExactly( spy, 'indent' );
+	} );
+
+	it( 'should execute outdent command on button execute', () => {
+		const button = editor.ui.componentFactory.create( 'outdent' );
+		const spy = sinon.spy( editor, 'execute' );
+
+		button.fire( 'execute' );
+
+		sinon.assert.calledOnce( spy );
+		sinon.assert.calledWithExactly( spy, 'outdent' );
+	} );
+} );