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

Bound DropdownView#buttonView's ck-on class to DropdownView#isOpen.

Aleksander Nowodzinski 8 лет назад
Родитель
Сommit
cc0c23989b

+ 10 - 10
packages/ckeditor5-ui/src/dropdown/dropdownview.js

@@ -44,16 +44,7 @@ export default class DropdownView extends View {
 	constructor( locale, buttonView, panelView ) {
 		super( locale );
 
-		// Extend button's template before it's registered as a child of the dropdown because
-		// by doing so, its #element is rendered and any post–render template extension will
-		// not be reflected in DOM.
-		buttonView.extendTemplate( {
-			attributes: {
-				class: [
-					'ck-dropdown__button'
-				]
-			}
-		} );
+		const bind = this.bindTemplate;
 
 		/**
 		 * Button of the dropdown view. Clicking the button opens the {@link #panelView}.
@@ -121,6 +112,15 @@ export default class DropdownView extends View {
 				panelView
 			]
 		} );
+
+		buttonView.extendTemplate( {
+			attributes: {
+				class: [
+					'ck-dropdown__button',
+					bind.if( 'isOpen', 'ck-on' )
+				]
+			}
+		} );
 	}
 
 	/**

+ 10 - 0
packages/ckeditor5-ui/tests/dropdown/dropdownview.js

@@ -90,6 +90,16 @@ describe( 'DropdownView', () => {
 					expect( values ).to.have.members( [ true, false, true ] );
 				} );
 			} );
+
+			describe( 'view#buttonView class to view#isOpen', () => {
+				it( 'is activated', () => {
+					view.isOpen = false;
+					expect( view.buttonView.element.classList.contains( 'ck-on' ) ).to.be.false;
+
+					view.isOpen = true;
+					expect( view.buttonView.element.classList.contains( 'ck-on' ) ).to.be.true;
+				} );
+			} );
 		} );
 	} );