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

Rename var to be more accurate, expose another method to obtaine decorator status. Fix tests.

Mateusz Samsel 6 лет назад
Родитель
Сommit
8a3ccfa711

+ 1 - 7
packages/ckeditor5-link/src/linkui.js

@@ -154,13 +154,7 @@ export default class LinkUI extends Plugin {
 
 		// Execute link command after clicking the "Save" button.
 		this.listenTo( formView, 'submit', () => {
-			const manualDecorators = {};
-
-			for ( const switchButton of formView.manualDecoratorsUIView ) {
-				manualDecorators[ switchButton.name ] = switchButton.isOn;
-			}
-
-			editor.execute( 'link', formView.urlInputView.inputView.element.value, manualDecorators );
+			editor.execute( 'link', formView.urlInputView.inputView.element.value, formView.getDecoratorSwitchesState() );
 			this._closeFormView();
 		} );
 

+ 17 - 4
packages/ckeditor5-link/src/ui/linkformview.js

@@ -102,10 +102,11 @@ export default class LinkFormView extends View {
 		 * which corresponds to {@link #manualDecorators manual decorators} configured in the editor.
 		 * Populated by {@link #_createManualDecoratorsUIView}.
 		 *
+		 * @private
 		 * @readonly
 		 * @type {module:ui/viewcollection~ViewCollection}
 		 */
-		this.manualDecoratorsUIView = this._createManualDecoratorsUIView();
+		this._manualDecoratorSwitches = this._createManualDecoratorSwitches();
 
 		/**
 		 * Collection of child views in the form.
@@ -164,6 +165,18 @@ export default class LinkFormView extends View {
 		} );
 	}
 
+	/**
+	 * Obtain state of the switch buttons in a currently opened {@link module:link/ui/linkformview~LinkFormView}.
+	 *
+	 * @returns {Object} key-value pairs, where key is the name of the decorator and value is its state.
+	 */
+	getDecoratorSwitchesState() {
+		return Array.from( this._manualDecoratorSwitches ).reduce( ( accumulator, switchButton ) => {
+			accumulator[ switchButton.name ] = switchButton.isOn;
+			return accumulator;
+		}, {} );
+	}
+
 	/**
 	 * @inheritDoc
 	 */
@@ -176,7 +189,7 @@ export default class LinkFormView extends View {
 
 		const childViews = [
 			this.urlInputView,
-			...this.manualDecoratorsUIView,
+			...this._manualDecoratorSwitches,
 			this.saveButtonView,
 			this.cancelButtonView
 		];
@@ -256,7 +269,7 @@ export default class LinkFormView extends View {
 	 * @private
 	 * @returns {module:ui/viewcollection~ViewCollection} of Switch Buttons.
 	 */
-	_createManualDecoratorsUIView() {
+	_createManualDecoratorSwitches() {
 		const switches = this.createCollection();
 
 		switches.bindTo( this.manualDecorators ).using( item => {
@@ -300,7 +313,7 @@ export default class LinkFormView extends View {
 
 			additionalButtonsView.setTemplate( {
 				tag: 'ul',
-				children: this.manualDecoratorsUIView.map( switchButton => ( {
+				children: this._manualDecoratorSwitches.map( switchButton => ( {
 					tag: 'li',
 					children: [ switchButton ],
 					attributes: {

+ 1 - 2
packages/ckeditor5-link/tests/linkui.js

@@ -1004,8 +1004,7 @@ describe( 'LinkUI', () => {
 
 						setModelData( model, 'f[<$text linkHref="url" linkManualDecorator0="true">ooba</$text>]r' );
 						expect( formView.urlInputView.inputView.element.value ).to.equal( 'url' );
-						expect( formView.manualDecoratorsUIView.length ).to.equal( 1 );
-						expect( formView.manualDecoratorsUIView.first.isOn ).to.be.true;
+						expect( formView.getDecoratorSwitchesState() ).to.deep.equal( { linkManualDecorator0: true } );
 
 						formView.fire( 'submit' );
 

+ 29 - 7
packages/ckeditor5-link/tests/ui/linkformview.js

@@ -189,7 +189,7 @@ describe( 'LinkFormView', () => {
 		} );
 	} );
 
-	describe( 'customAttributes', () => {
+	describe( 'manual decorators', () => {
 		let view, collection;
 		beforeEach( () => {
 			collection = new Collection();
@@ -225,18 +225,18 @@ describe( 'LinkFormView', () => {
 			view.destroy();
 			collection.clear();
 		} );
-		it( 'switch buttons reflects state of customAttributes', () => {
-			expect( view.manualDecoratorsUIView.length ).to.equal( 3 );
+		it( 'switch buttons reflects state of manual decorators', () => {
+			expect( view._manualDecoratorSwitches.length ).to.equal( 3 );
 
-			expect( view.manualDecoratorsUIView.get( 0 ) ).to.deep.include( {
+			expect( view._manualDecoratorSwitches.get( 0 ) ).to.deep.include( {
 				name: 'decorator1',
 				label: 'Foo'
 			} );
-			expect( view.manualDecoratorsUIView.get( 1 ) ).to.deep.include( {
+			expect( view._manualDecoratorSwitches.get( 1 ) ).to.deep.include( {
 				name: 'decorator2',
 				label: 'Download'
 			} );
-			expect( view.manualDecoratorsUIView.get( 2 ) ).to.deep.include( {
+			expect( view._manualDecoratorSwitches.get( 2 ) ).to.deep.include( {
 				name: 'decorator3',
 				label: 'Multi'
 			} );
@@ -244,7 +244,7 @@ describe( 'LinkFormView', () => {
 
 		it( 'reacts on switch button changes', () => {
 			const modelItem = collection.first;
-			const viewItem = view.manualDecoratorsUIView.first;
+			const viewItem = view._manualDecoratorSwitches.first;
 
 			expect( modelItem.value ).to.be.undefined;
 			expect( viewItem.isOn ).to.be.undefined;
@@ -259,5 +259,27 @@ describe( 'LinkFormView', () => {
 			expect( modelItem.value ).to.be.false;
 			expect( viewItem.isOn ).to.be.false;
 		} );
+
+		describe( 'getDecoratorSwitchesState()', () => {
+			it( 'should provide object with decorators states', () => {
+				expect( view.getDecoratorSwitchesState() ).to.deep.equal( {
+					decorator1: undefined,
+					decorator2: undefined,
+					decorator3: undefined
+				} );
+
+				view._manualDecoratorSwitches.map( item => {
+					item.element.dispatchEvent( new Event( 'click' ) );
+				} );
+
+				view._manualDecoratorSwitches.get( 2 ).element.dispatchEvent( new Event( 'click' ) );
+
+				expect( view.getDecoratorSwitchesState() ).to.deep.equal( {
+					decorator1: true,
+					decorator2: true,
+					decorator3: false
+				} );
+			} );
+		} );
 	} );
 } );