Browse Source

Merge branch 't/ckeditor5/550'

Other: Rename `ContextualToolbar` to `BalloonToolbar`.  Closes ckeditor/ckeditor5#550.

BREAKING CHANGE: Renamed `contextual/contextualtoolbar~ContextualToolbar` to `balloon/balloontoolbar~BalloonToolbar`.
BREAKING CHANGE: Renamed `contextualToolbar` configuration option to `balloonToolbar`.
Piotrek Koszuliński 7 years ago
parent
commit
5cb648a06c

+ 9 - 9
packages/ckeditor5-ui/src/toolbar/contextual/contextualtoolbar.js

@@ -4,7 +4,7 @@
  */
 
 /**
- * @module ui/toolbar/contextual/contextualtoolbar
+ * @module ui/toolbar/balloon/balloontoolbar
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
@@ -22,12 +22,12 @@ import normalizeToolbarConfig from '../normalizetoolbarconfig';
  *
  * @extends module:core/plugin~Plugin
  */
-export default class ContextualToolbar extends Plugin {
+export default class BalloonToolbar extends Plugin {
 	/**
 	 * @inheritDoc
 	 */
 	static get pluginName() {
-		return 'ContextualToolbar';
+		return 'BalloonToolbar';
 	}
 
 	/**
@@ -83,7 +83,7 @@ export default class ContextualToolbar extends Plugin {
 		this._handleSelectionChange();
 		this._handleFocusChange();
 
-		// The appearance of the ContextualToolbar method is event–driven.
+		// The appearance of the BalloonToolbar method is event–driven.
 		// It is possible to stop the #show event and this prevent the toolbar from showing up.
 		this.decorate( 'show' );
 	}
@@ -95,7 +95,7 @@ export default class ContextualToolbar extends Plugin {
 	 * @inheritDoc
 	 */
 	afterInit() {
-		const config = normalizeToolbarConfig( this.editor.config.get( 'contextualToolbar' ) );
+		const config = normalizeToolbarConfig( this.editor.config.get( 'balloonToolbar' ) );
 		const factory = this.editor.ui.componentFactory;
 
 		this.toolbarView.fillFromConfig( config.items, factory );
@@ -283,20 +283,20 @@ function getBalloonPositions( isBackward ) {
 }
 
 /**
- * Contextual toolbar configuration. Used by the {@link module:ui/toolbar/contextual/contextualtoolbar~ContextualToolbar}
+ * Contextual toolbar configuration. Used by the {@link module:ui/toolbar/balloon/balloontoolbar~BalloonToolbar}
  * feature.
  *
  *		const config = {
- *			contextualToolbar: [ 'bold', 'italic', 'undo', 'redo' ]
+ *			balloonToolbar: [ 'bold', 'italic', 'undo', 'redo' ]
  *		};
  *
  * You can also use `'|'` to create a separator between groups of items:
  *
  *		const config = {
- *			contextualToolbar: [ 'bold', 'italic', | 'undo', 'redo' ]
+ *			balloonToolbar: [ 'bold', 'italic', | 'undo', 'redo' ]
  *		};
  *
  * Read also about configuring the main editor toolbar in {@link module:core/editor/editorconfig~EditorConfig#toolbar}.
  *
- * @member {Array.<String>|Object} module:core/editor/editorconfig~EditorConfig#contextualToolbar
+ * @member {Array.<String>|Object} module:core/editor/editorconfig~EditorConfig#balloonToolbar
  */

+ 1 - 1
packages/ckeditor5-ui/tests/manual/contextualtoolbar/contextualtoolbar.html

@@ -1,5 +1,5 @@
 <div id="editor">
-	<p><em>ContextualToolbar</em> won't show for the first block element.</p>
+	<p><em>BalloonToolbar</em> won't show for the first block element.</p>
 	<p><em>This</em> is a <strong>first line</strong> of text.</p>
 	<p><em>This</em> is a <strong>second line</strong> of text.</p>
 	<p><em>This</em> is the <strong>end</strong> of text.</p>

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

@@ -7,21 +7,21 @@
 
 import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
 import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
-import ContextualToolbar from '../../../src/toolbar/contextual/contextualtoolbar';
+import BalloonToolbar from '../../../src/toolbar/balloon/balloontoolbar';
 import Range from '@ckeditor/ckeditor5-engine/src/model/range';
 
 ClassicEditor
 	.create( document.querySelector( '#editor' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'bold', 'italic', 'link', 'undo', 'redo' ],
-		contextualToolbar: [ 'bold', 'italic', 'link' ]
+		balloonToolbar: [ 'bold', 'italic', 'link' ]
 	} )
 	.then( editor => {
 		window.editor = editor;
 
-		const contextualToolbar = editor.plugins.get( 'ContextualToolbar' );
+		const balloonToolbar = editor.plugins.get( 'BalloonToolbar' );
 
-		contextualToolbar.on( 'show', evt => {
+		balloonToolbar.on( 'show', evt => {
 			const selectionRange = editor.model.document.selection.getFirstRange();
 			const blockRange = Range.createOn( editor.model.document.getRoot().getChild( 0 ) );
 

packages/ckeditor5-ui/tests/manual/contextualtoolbar/contextualtoolbar.md → packages/ckeditor5-ui/tests/manual/balloontoolbar/balloontoolbar.md


+ 3 - 3
packages/ckeditor5-ui/tests/manual/contextualballoon/contextualballoon.js

@@ -7,14 +7,14 @@
 
 import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
 import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
-import ContextualToolbar from '../../../src/toolbar/contextual/contextualtoolbar';
+import BalloonToolbar from '../../../src/toolbar/balloon/balloontoolbar';
 
 // Finally the editor.
 ClassicEditor
 	.create( document.querySelector( '#editor' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'bold', 'link' ],
-		contextualToolbar: [ 'bold', 'link' ]
+		balloonToolbar: [ 'bold', 'link' ]
 	} )
 	.then( editor => {
 		window.editor = editor;

+ 5 - 5
packages/ckeditor5-ui/tests/manual/contextualballoon/externalchanges.js

@@ -6,7 +6,7 @@
 /* globals console:false, document, setTimeout */
 
 import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
-import ContextualToolbar from '../../../src/toolbar/contextual/contextualtoolbar';
+import BalloonToolbar from '../../../src/toolbar/balloon/balloontoolbar';
 import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
 
 import Position from '@ckeditor/ckeditor5-engine/src/model/position';
@@ -15,9 +15,9 @@ import Range from '@ckeditor/ckeditor5-engine/src/model/range';
 // Editor for the external insert.
 ClassicEditor
 	.create( document.querySelector( '#editor-insert' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'bold', 'link' ],
-		contextualToolbar: [ 'bold', 'link' ]
+		balloonToolbar: [ 'bold', 'link' ]
 	} )
 	.then( editor => {
 		const element = document.querySelector( '#button-insert' );
@@ -32,9 +32,9 @@ ClassicEditor
 // Editor for the external delete.
 ClassicEditor
 	.create( document.querySelector( '#editor-delete' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'bold', 'link' ],
-		contextualToolbar: [ 'bold', 'link' ]
+		balloonToolbar: [ 'bold', 'link' ]
 	} )
 	.then( editor => {
 		const element = document.querySelector( '#button-delete' );

+ 1 - 1
packages/ckeditor5-ui/tests/manual/contextualballoon/externalchanges.md

@@ -1,4 +1,4 @@
-## Link panel opened from ContextualToolbar should be updated on external changes.
+## Link panel opened from BalloonToolbar should be updated on external changes.
 
 ### Create #1:
 

+ 5 - 5
packages/ckeditor5-ui/tests/manual/tickets/198/1.js

@@ -7,7 +7,7 @@
 
 import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
 import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
-import ContextualToolbar from '../../../../src/toolbar/contextual/contextualtoolbar';
+import BalloonToolbar from '../../../../src/toolbar/balloon/balloontoolbar';
 
 import Position from '@ckeditor/ckeditor5-engine/src/model/position';
 import Range from '@ckeditor/ckeditor5-engine/src/model/range';
@@ -15,9 +15,9 @@ import Range from '@ckeditor/ckeditor5-engine/src/model/range';
 // Editor for the external insert.
 ClassicEditor
 	.create( document.querySelector( '#editor-insert' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'undo', 'redo' ],
-		contextualToolbar: [ 'bold', 'italic' ]
+		balloonToolbar: [ 'bold', 'italic' ]
 	} )
 	.then( editor => {
 		const element = document.querySelector( '#button-insert' );
@@ -32,9 +32,9 @@ ClassicEditor
 // Editor for the external delete.
 ClassicEditor
 	.create( document.querySelector( '#editor-delete' ), {
-		plugins: [ ArticlePluginSet, ContextualToolbar ],
+		plugins: [ ArticlePluginSet, BalloonToolbar ],
 		toolbar: [ 'undo', 'redo' ],
-		contextualToolbar: [ 'bold', 'italic' ]
+		balloonToolbar: [ 'bold', 'italic' ]
 	} )
 	.then( editor => {
 		const element = document.querySelector( '#button-delete' );

+ 1 - 1
packages/ckeditor5-ui/tests/manual/tickets/198/1.md

@@ -1,6 +1,6 @@
 # Issue [#198](https://github.com/ckeditor/ckeditor5-ui/issues/198) manual test.
 
-## Position of the `ContextualToolbar` should be updated on external changes.
+## Position of the `BalloonToolbar` should be updated on external changes.
 
 ### Insert:
 

+ 57 - 57
packages/ckeditor5-ui/tests/toolbar/contextual/contextualtoolbar.js

@@ -4,7 +4,7 @@
  */
 
 import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
-import ContextualToolbar from '../../../src/toolbar/contextual/contextualtoolbar';
+import BalloonToolbar from '../../../src/toolbar/balloon/balloontoolbar';
 import ContextualBalloon from '../../../src/panel/balloon/contextualballoon';
 import BalloonPanelView from '../../../src/panel/balloon/balloonpanelview';
 import ToolbarView from '../../../src/toolbar/toolbarview';
@@ -18,8 +18,8 @@ import { setData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model.js';
 
 /* global document, setTimeout, window */
 
-describe( 'ContextualToolbar', () => {
-	let sandbox, editor, model, selection, editingView, contextualToolbar, balloon, editorElement;
+describe( 'BalloonToolbar', () => {
+	let sandbox, editor, model, selection, editingView, balloonToolbar, balloon, editorElement;
 
 	beforeEach( () => {
 		sandbox = sinon.sandbox.create();
@@ -29,15 +29,15 @@ describe( 'ContextualToolbar', () => {
 
 		return ClassicTestEditor
 			.create( editorElement, {
-				plugins: [ Paragraph, Bold, Italic, ContextualToolbar ],
-				contextualToolbar: [ 'bold', 'italic' ]
+				plugins: [ Paragraph, Bold, Italic, BalloonToolbar ],
+				balloonToolbar: [ 'bold', 'italic' ]
 			} )
 			.then( newEditor => {
 				editor = newEditor;
 				model = editor.model;
 				editingView = editor.editing.view;
 				selection = model.document.selection;
-				contextualToolbar = editor.plugins.get( ContextualToolbar );
+				balloonToolbar = editor.plugins.get( BalloonToolbar );
 				balloon = editor.plugins.get( ContextualBalloon );
 
 				editingView.attachDomRoot( editorElement );
@@ -63,10 +63,10 @@ describe( 'ContextualToolbar', () => {
 	} );
 
 	it( 'should create a plugin instance', () => {
-		expect( contextualToolbar ).to.instanceOf( Plugin );
-		expect( contextualToolbar ).to.instanceOf( ContextualToolbar );
-		expect( contextualToolbar.toolbarView ).to.instanceof( ToolbarView );
-		expect( contextualToolbar.toolbarView.element.classList.contains( 'ck-toolbar_floating' ) ).to.be.true;
+		expect( balloonToolbar ).to.instanceOf( Plugin );
+		expect( balloonToolbar ).to.instanceOf( BalloonToolbar );
+		expect( balloonToolbar.toolbarView ).to.instanceof( ToolbarView );
+		expect( balloonToolbar.toolbarView.element.classList.contains( 'ck-toolbar_floating' ) ).to.be.true;
 	} );
 
 	it( 'should load ContextualBalloon', () => {
@@ -74,7 +74,7 @@ describe( 'ContextualToolbar', () => {
 	} );
 
 	it( 'should create components from config', () => {
-		expect( contextualToolbar.toolbarView.items ).to.length( 2 );
+		expect( balloonToolbar.toolbarView.items ).to.length( 2 );
 	} );
 
 	it( 'should accept the extended format of the toolbar config', () => {
@@ -83,15 +83,15 @@ describe( 'ContextualToolbar', () => {
 
 		return ClassicTestEditor
 			.create( editorElement, {
-				plugins: [ Paragraph, Bold, Italic, Underline, ContextualToolbar ],
-				contextualToolbar: {
+				plugins: [ Paragraph, Bold, Italic, Underline, BalloonToolbar ],
+				balloonToolbar: {
 					items: [ 'bold', 'italic', 'underline' ]
 				}
 			} )
 			.then( editor => {
-				const contextualToolbar = editor.plugins.get( ContextualToolbar );
+				const balloonToolbar = editor.plugins.get( BalloonToolbar );
 
-				expect( contextualToolbar.toolbarView.items ).to.length( 3 );
+				expect( balloonToolbar.toolbarView.items ).to.length( 3 );
 
 				editorElement.remove();
 
@@ -106,7 +106,7 @@ describe( 'ContextualToolbar', () => {
 
 		const spy = sandbox.spy();
 		setData( model, '<paragraph>[bar]</paragraph>' );
-		contextualToolbar.on( '_selectionChangeDebounced', spy );
+		balloonToolbar.on( '_selectionChangeDebounced', spy );
 
 		selection.fire( 'change:range', {} );
 
@@ -138,7 +138,7 @@ describe( 'ContextualToolbar', () => {
 
 	describe( 'pluginName', () => {
 		it( 'should return plugin by its name', () => {
-			expect( editor.plugins.get( 'ContextualToolbar' ) ).to.equal( contextualToolbar );
+			expect( editor.plugins.get( 'BalloonToolbar' ) ).to.equal( balloonToolbar );
 		} );
 	} );
 
@@ -178,10 +178,10 @@ describe( 'ContextualToolbar', () => {
 
 			const defaultPositions = BalloonPanelView.defaultPositions;
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 
 			sinon.assert.calledWith( balloonAddSpy, {
-				view: contextualToolbar.toolbarView,
+				view: balloonToolbar.toolbarView,
 				balloonClassName: 'ck-toolbar-container',
 				position: {
 					target: sinon.match.func,
@@ -212,7 +212,7 @@ describe( 'ContextualToolbar', () => {
 
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			expect( balloonAddSpy.firstCall.args[ 0 ].position.target() ).to.deep.equal( forwardSelectionRect );
 		} );
 
@@ -221,10 +221,10 @@ describe( 'ContextualToolbar', () => {
 
 			const defaultPositions = BalloonPanelView.defaultPositions;
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 
 			sinon.assert.calledWithExactly( balloonAddSpy, {
-				view: contextualToolbar.toolbarView,
+				view: balloonToolbar.toolbarView,
 				balloonClassName: 'ck-toolbar-container',
 				position: {
 					target: sinon.match.func,
@@ -249,7 +249,7 @@ describe( 'ContextualToolbar', () => {
 
 			editingView.fire( 'render' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.notCalled( spy );
 
 			editingView.fire( 'render' );
@@ -259,31 +259,31 @@ describe( 'ContextualToolbar', () => {
 		it( 'should not add #toolbarView to the #_balloon more than once', () => {
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
-			contextualToolbar.show();
+			balloonToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.calledOnce( balloonAddSpy );
 		} );
 
 		it( 'should not add #toolbarView to the #_balloon when all components inside #toolbarView are disabled', () => {
-			Array.from( contextualToolbar.toolbarView.items ).forEach( item => {
+			Array.from( balloonToolbar.toolbarView.items ).forEach( item => {
 				item.isEnabled = false;
 			} );
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.notCalled( balloonAddSpy );
 		} );
 
 		it( 'should add #toolbarView to the #_balloon when at least one component inside does not have #isEnabled interface', () => {
-			Array.from( contextualToolbar.toolbarView.items ).forEach( item => {
+			Array.from( balloonToolbar.toolbarView.items ).forEach( item => {
 				item.isEnabled = false;
 			} );
 
-			delete contextualToolbar.toolbarView.items.get( 0 ).isEnabled;
+			delete balloonToolbar.toolbarView.items.get( 0 ).isEnabled;
 
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.calledOnce( balloonAddSpy );
 		} );
 
@@ -291,21 +291,21 @@ describe( 'ContextualToolbar', () => {
 			let showSpy;
 
 			beforeEach( () => {
-				showSpy = sandbox.spy( contextualToolbar, 'show' );
+				showSpy = sandbox.spy( balloonToolbar, 'show' );
 			} );
 
 			it( 'should not be called when the editor is not focused', () => {
 				setData( model, '<paragraph>b[a]r</paragraph>' );
 				editingView.document.isFocused = false;
 
-				contextualToolbar.fire( '_selectionChangeDebounced' );
+				balloonToolbar.fire( '_selectionChangeDebounced' );
 				sinon.assert.notCalled( showSpy );
 			} );
 
 			it( 'should not be called when the selection is collapsed', () => {
 				setData( model, '<paragraph>b[]ar</paragraph>' );
 
-				contextualToolbar.fire( '_selectionChangeDebounced' );
+				balloonToolbar.fire( '_selectionChangeDebounced' );
 				sinon.assert.notCalled( showSpy );
 			} );
 
@@ -313,7 +313,7 @@ describe( 'ContextualToolbar', () => {
 				setData( model, '<paragraph>b[a]r</paragraph>' );
 				editingView.document.isFocused = true;
 
-				contextualToolbar.fire( '_selectionChangeDebounced' );
+				balloonToolbar.fire( '_selectionChangeDebounced' );
 				sinon.assert.calledOnce( showSpy );
 			} );
 		} );
@@ -330,10 +330,10 @@ describe( 'ContextualToolbar', () => {
 		it( 'should remove #toolbarView from the #_balloon', () => {
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 
-			contextualToolbar.hide();
-			sinon.assert.calledWithExactly( removeBalloonSpy, contextualToolbar.toolbarView );
+			balloonToolbar.hide();
+			sinon.assert.calledWithExactly( removeBalloonSpy, balloonToolbar.toolbarView );
 		} );
 
 		it( 'should stop update balloon position on ViewDocument#change event', () => {
@@ -341,15 +341,15 @@ describe( 'ContextualToolbar', () => {
 
 			const spy = sandbox.spy( balloon, 'updatePosition' );
 
-			contextualToolbar.show();
-			contextualToolbar.hide();
+			balloonToolbar.show();
+			balloonToolbar.hide();
 
 			editingView.fire( 'render' );
 			sinon.assert.notCalled( spy );
 		} );
 
 		it( 'should not remove #ttolbarView when is not added to the #_balloon', () => {
-			contextualToolbar.hide();
+			balloonToolbar.hide();
 
 			sinon.assert.notCalled( removeBalloonSpy );
 		} );
@@ -358,19 +358,19 @@ describe( 'ContextualToolbar', () => {
 	describe( 'destroy()', () => {
 		it( 'can be called multiple times', () => {
 			expect( () => {
-				contextualToolbar.destroy();
-				contextualToolbar.destroy();
+				balloonToolbar.destroy();
+				balloonToolbar.destroy();
 			} ).to.not.throw();
 		} );
 
 		it( 'should not fire `_selectionChangeDebounced` after plugin destroy', done => {
 			const spy = sandbox.spy();
 
-			contextualToolbar.on( '_selectionChangeDebounced', spy );
+			balloonToolbar.on( '_selectionChangeDebounced', spy );
 
 			selection.fire( 'change:range', { directChange: true } );
 
-			contextualToolbar.destroy();
+			balloonToolbar.destroy();
 
 			setTimeout( () => {
 				sinon.assert.notCalled( spy );
@@ -385,22 +385,22 @@ describe( 'ContextualToolbar', () => {
 		beforeEach( () => {
 			setData( model, '<paragraph>[bar]</paragraph>' );
 
-			showPanelSpy = sandbox.spy( contextualToolbar, 'show' );
-			hidePanelSpy = sandbox.spy( contextualToolbar, 'hide' );
+			showPanelSpy = sandbox.spy( balloonToolbar, 'show' );
+			hidePanelSpy = sandbox.spy( balloonToolbar, 'hide' );
 		} );
 
 		it( 'should open when selection stops changing', () => {
 			sinon.assert.notCalled( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
 
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
 			sinon.assert.calledOnce( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
 		} );
 
 		it( 'should close when selection starts changing by a directChange', () => {
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
 			sinon.assert.calledOnce( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
@@ -412,7 +412,7 @@ describe( 'ContextualToolbar', () => {
 		} );
 
 		it( 'should not close when selection starts changing by not a directChange', () => {
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
 			sinon.assert.calledOnce( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
@@ -424,7 +424,7 @@ describe( 'ContextualToolbar', () => {
 		} );
 
 		it( 'should close when selection starts changing by not a directChange but will become collapsed', () => {
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
 			sinon.assert.calledOnce( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
@@ -442,9 +442,9 @@ describe( 'ContextualToolbar', () => {
 		it( 'should hide if the editor loses focus', () => {
 			editor.ui.focusTracker.isFocused = true;
 
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
-			const stub = sandbox.stub( balloon, 'visibleView' ).get( () => contextualToolbar.toolbarView );
+			const stub = sandbox.stub( balloon, 'visibleView' ).get( () => balloonToolbar.toolbarView );
 
 			sinon.assert.calledOnce( showPanelSpy );
 			sinon.assert.notCalled( hidePanelSpy );
@@ -460,7 +460,7 @@ describe( 'ContextualToolbar', () => {
 		it( 'should not hide if the editor loses focus and #toolbarView is not visible', () => {
 			editor.ui.focusTracker.isFocused = true;
 
-			contextualToolbar.fire( '_selectionChangeDebounced' );
+			balloonToolbar.fire( '_selectionChangeDebounced' );
 
 			const stub = sandbox.stub( balloon, 'visibleView' ).get( () => null );
 
@@ -480,10 +480,10 @@ describe( 'ContextualToolbar', () => {
 		it( 'should fire `show` event just before panel shows', () => {
 			const spy = sandbox.spy();
 
-			contextualToolbar.on( 'show', spy );
+			balloonToolbar.on( 'show', spy );
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.calledOnce( spy );
 		} );
 
@@ -492,9 +492,9 @@ describe( 'ContextualToolbar', () => {
 
 			setData( model, '<paragraph>b[a]r</paragraph>' );
 
-			contextualToolbar.on( 'show', evt => evt.stop(), { priority: 'high' } );
+			balloonToolbar.on( 'show', evt => evt.stop(), { priority: 'high' } );
 
-			contextualToolbar.show();
+			balloonToolbar.show();
 			sinon.assert.notCalled( balloonAddSpy );
 		} );
 	} );