Procházet zdrojové kódy

Add docs for indent plugin.

Maciej Gołaszewski před 6 roky
rodič
revize
b3c90cc97b

+ 34 - 12
packages/ckeditor5-core/src/indent.js

@@ -11,7 +11,31 @@ import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
 import Plugin from './plugin';
 import MultiCommand from './multicommand';
 
+/**
+ * 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 list} or {@link module:list/listediting~ListEditing list editing} feature for list indentation
+ * - the {@link module:indent-block/indentblock~IndentBlock block indentation} feature for indenting text blocks like paragraphs or headings
+ *
+ * **Note**: In order the commands and buttons to work at least one of compatible features is required.
+ */
 export default class Indent extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'Indent';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
 	init() {
 		const editor = this.editor;
 		const t = editor.t;
@@ -19,19 +43,18 @@ export default class Indent extends Plugin {
 		editor.commands.add( 'indent', new MultiCommand( editor ) );
 		editor.commands.add( 'outdent', new MultiCommand( editor ) );
 
-		this._createButton( 'indent', t( '>' ) );
-		this._createButton( 'outdent', t( '<' ) );
-
-		// TODO: temporary - tests only
-		this._createButton( 'indentList', t( '> List' ) );
-		this._createButton( 'outdentList', t( '< List' ) );
-
-		// TODO: temporary - tests only
-		this._createButton( 'indentBlock', t( '> Block' ) );
-		this._createButton( 'outdentBlock', t( '< Block' ) );
+		this._defineButton( 'indent', t( 'Increase indent' ) );
+		this._defineButton( 'outdent', t( 'Decrease indent' ) );
 	}
 
-	_createButton( commandName, label ) {
+	/**
+	 * Defines an UI button.
+	 *
+	 * @param {String} commandName
+	 * @param {String} label
+	 * @private
+	 */
+	_defineButton( commandName, label ) {
 		const editor = this.editor;
 
 		editor.ui.componentFactory.add( commandName, locale => {
@@ -46,7 +69,6 @@ export default class Indent extends Plugin {
 
 			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
 
-			// Execute command.
 			this.listenTo( view, 'execute', () => editor.execute( commandName ) );
 
 			return view;

+ 70 - 0
packages/ckeditor5-core/tests/indent.js

@@ -0,0 +1,70 @@
+/**
+ * @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 Indent from '../src/indent';
+import MultiCommand from '../src/multicommand';
+
+describe.only( 'indent', () => {
+	let editor, element;
+
+	testUtils.createSinonSandbox();
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, { plugins: [ Indent ] } )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		if ( editor ) {
+			return editor.destroy();
+		}
+	} );
+
+	it( 'should be named', () => {
+		expect( Indent.pluginName ).to.equal( 'Indent' );
+	} );
+
+	it( 'should be loaded', () => {
+		expect( editor.plugins.get( Indent ) ).to.be.instanceOf( Indent );
+	} );
+
+	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 );
+	} );
+} );