Sfoglia il codice sorgente

Code refactoring. Tests for BalloonPanelView#withArrow.

Aleksander Nowodzinski 8 anni fa
parent
commit
7dcdbd5cfc

+ 4 - 2
packages/ckeditor5-ui/src/panel/balloon/balloonpanelview.js

@@ -59,8 +59,10 @@ export default class BalloonPanelView extends View {
 		 * Default position names correspond with
 		 * Default position names correspond with
 		 * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.defaultPositions}.
 		 * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.defaultPositions}.
 		 *
 		 *
+		 * See {@link #withArrow}.
+		 *
 		 * @observable
 		 * @observable
-		 * @default 'se'
+		 * @default 'arrow_se'
 		 * @member {'arrow_se'|'arrow_sw'|'arrow_ne'|'arrow_nw'} #position
 		 * @member {'arrow_se'|'arrow_sw'|'arrow_ne'|'arrow_nw'} #position
 		 */
 		 */
 		this.set( 'position', 'arrow_se' );
 		this.set( 'position', 'arrow_se' );
@@ -113,7 +115,7 @@ export default class BalloonPanelView extends View {
 					'ck-balloon-panel',
 					'ck-balloon-panel',
 					bind.to( 'position', ( value ) => `ck-balloon-panel_${ value }` ),
 					bind.to( 'position', ( value ) => `ck-balloon-panel_${ value }` ),
 					bind.if( 'isVisible', 'ck-balloon-panel_visible' ),
 					bind.if( 'isVisible', 'ck-balloon-panel_visible' ),
-					bind.if( 'withArrow', 'ck-balloon-panel_arrow' )
+					bind.if( 'withArrow', 'ck-balloon-panel_with-arrow' )
 				],
 				],
 
 
 				style: {
 				style: {

+ 2 - 2
packages/ckeditor5-ui/tests/manual/contextualtoolbar/contextualtoolbar.js

@@ -28,7 +28,7 @@ const positions = {
 	forwardSelection: ( targetRect, balloonRect ) => ( {
 	forwardSelection: ( targetRect, balloonRect ) => ( {
 		top: targetRect.bottom + arrowVOffset,
 		top: targetRect.bottom + arrowVOffset,
 		left: targetRect.right - balloonRect.width / 2,
 		left: targetRect.right - balloonRect.width / 2,
-		name: 's'
+		name: 'arrow_s'
 	} ),
 	} ),
 
 
 	//	+-----------------+
 	//	+-----------------+
@@ -39,7 +39,7 @@ const positions = {
 	backwardSelection: ( targetRect, balloonRect ) => ( {
 	backwardSelection: ( targetRect, balloonRect ) => ( {
 		top: targetRect.top - balloonRect.height - arrowVOffset,
 		top: targetRect.top - balloonRect.height - arrowVOffset,
 		left: targetRect.left - balloonRect.width / 2,
 		left: targetRect.left - balloonRect.width / 2,
-		name: 'n'
+		name: 'arrow_n'
 	} )
 	} )
 };
 };
 
 

+ 9 - 0
packages/ckeditor5-ui/tests/panel/balloon/balloonpanelview.js

@@ -43,6 +43,7 @@ describe( 'BalloonPanelView', () => {
 			expect( view.left ).to.equal( 0 );
 			expect( view.left ).to.equal( 0 );
 			expect( view.position ).to.equal( 'arrow_se' );
 			expect( view.position ).to.equal( 'arrow_se' );
 			expect( view.isVisible ).to.equal( false );
 			expect( view.isVisible ).to.equal( false );
+			expect( view.withArrow ).to.equal( true );
 		} );
 		} );
 
 
 		it( 'creates view#content collection', () => {
 		it( 'creates view#content collection', () => {
@@ -59,6 +60,14 @@ describe( 'BalloonPanelView', () => {
 
 
 				expect( view.element.classList.contains( 'ck-balloon-panel_arrow_sw' ) ).to.true;
 				expect( view.element.classList.contains( 'ck-balloon-panel_arrow_sw' ) ).to.true;
 			} );
 			} );
+
+			it( 'should react on view#withArrow', () => {
+				expect( view.element.classList.contains( 'ck-balloon-panel_with-arrow' ) ).to.be.true;
+
+				view.withArrow = false;
+
+				expect( view.element.classList.contains( 'ck-balloon-panel_with-arrow' ) ).to.be.false;
+			} );
 		} );
 		} );
 
 
 		describe( 'isVisible', () => {
 		describe( 'isVisible', () => {

+ 3 - 1
packages/ckeditor5-ui/theme/components/panel/balloonpanel.scss

@@ -9,7 +9,7 @@
 
 
 	z-index: ck-z( 'modal' );
 	z-index: ck-z( 'modal' );
 
 
-	&.ck-balloon-panel_arrow {
+	&.ck-balloon-panel_with-arrow {
 		&:before,
 		&:before,
 		&:after {
 		&:after {
 			content: "";
 			content: "";
@@ -23,7 +23,9 @@
 		&:after {
 		&:after {
 			z-index: ck-z( 'default', 1 );
 			z-index: ck-z( 'default', 1 );
 		}
 		}
+	}
 
 
+	&.ck-balloon-panel_arrow {
 		&_s,
 		&_s,
 		&_se,
 		&_se,
 		&_sw {
 		&_sw {