|
@@ -4,7 +4,7 @@
|
|
|
*/
|
|
*/
|
|
|
|
|
|
|
|
import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
|
|
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 ContextualBalloon from '../../../src/panel/balloon/contextualballoon';
|
|
|
import BalloonPanelView from '../../../src/panel/balloon/balloonpanelview';
|
|
import BalloonPanelView from '../../../src/panel/balloon/balloonpanelview';
|
|
|
import ToolbarView from '../../../src/toolbar/toolbarview';
|
|
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 */
|
|
/* 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( () => {
|
|
beforeEach( () => {
|
|
|
sandbox = sinon.sandbox.create();
|
|
sandbox = sinon.sandbox.create();
|
|
@@ -29,15 +29,15 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
return ClassicTestEditor
|
|
return ClassicTestEditor
|
|
|
.create( editorElement, {
|
|
.create( editorElement, {
|
|
|
- plugins: [ Paragraph, Bold, Italic, ContextualToolbar ],
|
|
|
|
|
- contextualToolbar: [ 'bold', 'italic' ]
|
|
|
|
|
|
|
+ plugins: [ Paragraph, Bold, Italic, BalloonToolbar ],
|
|
|
|
|
+ balloonToolbar: [ 'bold', 'italic' ]
|
|
|
} )
|
|
} )
|
|
|
.then( newEditor => {
|
|
.then( newEditor => {
|
|
|
editor = newEditor;
|
|
editor = newEditor;
|
|
|
model = editor.model;
|
|
model = editor.model;
|
|
|
editingView = editor.editing.view;
|
|
editingView = editor.editing.view;
|
|
|
selection = model.document.selection;
|
|
selection = model.document.selection;
|
|
|
- contextualToolbar = editor.plugins.get( ContextualToolbar );
|
|
|
|
|
|
|
+ balloonToolbar = editor.plugins.get( BalloonToolbar );
|
|
|
balloon = editor.plugins.get( ContextualBalloon );
|
|
balloon = editor.plugins.get( ContextualBalloon );
|
|
|
|
|
|
|
|
editingView.attachDomRoot( editorElement );
|
|
editingView.attachDomRoot( editorElement );
|
|
@@ -47,7 +47,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
sandbox.stub( balloon.view, 'pin' ).returns( {} );
|
|
sandbox.stub( balloon.view, 'pin' ).returns( {} );
|
|
|
|
|
|
|
|
// Focus the engine.
|
|
// Focus the engine.
|
|
|
- editingView.isFocused = true;
|
|
|
|
|
|
|
+ editingView.document.isFocused = true;
|
|
|
editingView.getDomRoot().focus();
|
|
editingView.getDomRoot().focus();
|
|
|
|
|
|
|
|
// Remove all selection ranges from DOM before testing.
|
|
// Remove all selection ranges from DOM before testing.
|
|
@@ -63,11 +63,10 @@ describe( 'ContextualToolbar', () => {
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should create a plugin instance', () => {
|
|
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-editor-toolbar' ) ).to.be.true;
|
|
|
|
|
- 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', () => {
|
|
it( 'should load ContextualBalloon', () => {
|
|
@@ -75,7 +74,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should create components from config', () => {
|
|
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', () => {
|
|
it( 'should accept the extended format of the toolbar config', () => {
|
|
@@ -84,15 +83,15 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
return ClassicTestEditor
|
|
return ClassicTestEditor
|
|
|
.create( editorElement, {
|
|
.create( editorElement, {
|
|
|
- plugins: [ Paragraph, Bold, Italic, Underline, ContextualToolbar ],
|
|
|
|
|
- contextualToolbar: {
|
|
|
|
|
|
|
+ plugins: [ Paragraph, Bold, Italic, Underline, BalloonToolbar ],
|
|
|
|
|
+ balloonToolbar: {
|
|
|
items: [ 'bold', 'italic', 'underline' ]
|
|
items: [ 'bold', 'italic', 'underline' ]
|
|
|
}
|
|
}
|
|
|
} )
|
|
} )
|
|
|
.then( editor => {
|
|
.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();
|
|
editorElement.remove();
|
|
|
|
|
|
|
@@ -107,7 +106,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
const spy = sandbox.spy();
|
|
const spy = sandbox.spy();
|
|
|
setData( model, '<paragraph>[bar]</paragraph>' );
|
|
setData( model, '<paragraph>[bar]</paragraph>' );
|
|
|
- contextualToolbar.on( '_selectionChangeDebounced', spy );
|
|
|
|
|
|
|
+ balloonToolbar.on( '_selectionChangeDebounced', spy );
|
|
|
|
|
|
|
|
selection.fire( 'change:range', {} );
|
|
selection.fire( 'change:range', {} );
|
|
|
|
|
|
|
@@ -139,7 +138,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
describe( 'pluginName', () => {
|
|
describe( 'pluginName', () => {
|
|
|
it( 'should return plugin by its name', () => {
|
|
it( 'should return plugin by its name', () => {
|
|
|
- expect( editor.plugins.get( 'ContextualToolbar' ) ).to.equal( contextualToolbar );
|
|
|
|
|
|
|
+ expect( editor.plugins.get( 'BalloonToolbar' ) ).to.equal( balloonToolbar );
|
|
|
} );
|
|
} );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
@@ -171,7 +170,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
] );
|
|
] );
|
|
|
|
|
|
|
|
balloonAddSpy = sandbox.spy( balloon, 'add' );
|
|
balloonAddSpy = sandbox.spy( balloon, 'add' );
|
|
|
- editingView.isFocused = true;
|
|
|
|
|
|
|
+ editingView.document.isFocused = true;
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should add #toolbarView to the #_balloon and attach the #_balloon to the selection for the forward selection', () => {
|
|
it( 'should add #toolbarView to the #_balloon and attach the #_balloon to the selection for the forward selection', () => {
|
|
@@ -179,11 +178,11 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
const defaultPositions = BalloonPanelView.defaultPositions;
|
|
const defaultPositions = BalloonPanelView.defaultPositions;
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
|
|
|
|
|
sinon.assert.calledWith( balloonAddSpy, {
|
|
sinon.assert.calledWith( balloonAddSpy, {
|
|
|
- view: contextualToolbar.toolbarView,
|
|
|
|
|
- balloonClassName: 'ck-toolbar-container ck-editor-toolbar-container',
|
|
|
|
|
|
|
+ view: balloonToolbar.toolbarView,
|
|
|
|
|
+ balloonClassName: 'ck-toolbar-container',
|
|
|
position: {
|
|
position: {
|
|
|
target: sinon.match.func,
|
|
target: sinon.match.func,
|
|
|
positions: [
|
|
positions: [
|
|
@@ -213,7 +212,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
expect( balloonAddSpy.firstCall.args[ 0 ].position.target() ).to.deep.equal( forwardSelectionRect );
|
|
expect( balloonAddSpy.firstCall.args[ 0 ].position.target() ).to.deep.equal( forwardSelectionRect );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
@@ -222,11 +221,11 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
const defaultPositions = BalloonPanelView.defaultPositions;
|
|
const defaultPositions = BalloonPanelView.defaultPositions;
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
|
|
|
|
|
sinon.assert.calledWithExactly( balloonAddSpy, {
|
|
sinon.assert.calledWithExactly( balloonAddSpy, {
|
|
|
- view: contextualToolbar.toolbarView,
|
|
|
|
|
- balloonClassName: 'ck-toolbar-container ck-editor-toolbar-container',
|
|
|
|
|
|
|
+ view: balloonToolbar.toolbarView,
|
|
|
|
|
+ balloonClassName: 'ck-toolbar-container',
|
|
|
position: {
|
|
position: {
|
|
|
target: sinon.match.func,
|
|
target: sinon.match.func,
|
|
|
positions: [
|
|
positions: [
|
|
@@ -243,14 +242,14 @@ describe( 'ContextualToolbar', () => {
|
|
|
expect( balloonAddSpy.firstCall.args[ 0 ].position.target() ).to.deep.equal( backwardSelectionRect );
|
|
expect( balloonAddSpy.firstCall.args[ 0 ].position.target() ).to.deep.equal( backwardSelectionRect );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
- it( 'should update balloon position on ViewDocument#render event while balloon is added to the #_balloon', () => {
|
|
|
|
|
|
|
+ it( 'should update balloon position on view#change event while balloon is added to the #_balloon', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
const spy = sandbox.spy( balloon, 'updatePosition' );
|
|
const spy = sandbox.spy( balloon, 'updatePosition' );
|
|
|
|
|
|
|
|
editingView.fire( 'render' );
|
|
editingView.fire( 'render' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
sinon.assert.notCalled( spy );
|
|
sinon.assert.notCalled( spy );
|
|
|
|
|
|
|
|
editingView.fire( 'render' );
|
|
editingView.fire( 'render' );
|
|
@@ -260,31 +259,31 @@ describe( 'ContextualToolbar', () => {
|
|
|
it( 'should not add #toolbarView to the #_balloon more than once', () => {
|
|
it( 'should not add #toolbarView to the #_balloon more than once', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
sinon.assert.calledOnce( balloonAddSpy );
|
|
sinon.assert.calledOnce( balloonAddSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not add #toolbarView to the #_balloon when all components inside #toolbarView are disabled', () => {
|
|
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;
|
|
item.isEnabled = false;
|
|
|
} );
|
|
} );
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
sinon.assert.notCalled( balloonAddSpy );
|
|
sinon.assert.notCalled( balloonAddSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should add #toolbarView to the #_balloon when at least one component inside does not have #isEnabled interface', () => {
|
|
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;
|
|
item.isEnabled = false;
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
- delete contextualToolbar.toolbarView.items.get( 0 ).isEnabled;
|
|
|
|
|
|
|
+ delete balloonToolbar.toolbarView.items.get( 0 ).isEnabled;
|
|
|
|
|
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
sinon.assert.calledOnce( balloonAddSpy );
|
|
sinon.assert.calledOnce( balloonAddSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
@@ -292,29 +291,29 @@ describe( 'ContextualToolbar', () => {
|
|
|
let showSpy;
|
|
let showSpy;
|
|
|
|
|
|
|
|
beforeEach( () => {
|
|
beforeEach( () => {
|
|
|
- showSpy = sandbox.spy( contextualToolbar, 'show' );
|
|
|
|
|
|
|
+ showSpy = sandbox.spy( balloonToolbar, 'show' );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not be called when the editor is not focused', () => {
|
|
it( 'should not be called when the editor is not focused', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
- editingView.isFocused = false;
|
|
|
|
|
|
|
+ editingView.document.isFocused = false;
|
|
|
|
|
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
sinon.assert.notCalled( showSpy );
|
|
sinon.assert.notCalled( showSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not be called when the selection is collapsed', () => {
|
|
it( 'should not be called when the selection is collapsed', () => {
|
|
|
setData( model, '<paragraph>b[]ar</paragraph>' );
|
|
setData( model, '<paragraph>b[]ar</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
sinon.assert.notCalled( showSpy );
|
|
sinon.assert.notCalled( showSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should be called when the selection is not collapsed and editor is focused', () => {
|
|
it( 'should be called when the selection is not collapsed and editor is focused', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
- editingView.isFocused = true;
|
|
|
|
|
|
|
+ editingView.document.isFocused = true;
|
|
|
|
|
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
sinon.assert.calledOnce( showSpy );
|
|
sinon.assert.calledOnce( showSpy );
|
|
|
} );
|
|
} );
|
|
|
} );
|
|
} );
|
|
@@ -325,32 +324,32 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
beforeEach( () => {
|
|
beforeEach( () => {
|
|
|
removeBalloonSpy = sandbox.stub( balloon, 'remove' ).returns( {} );
|
|
removeBalloonSpy = sandbox.stub( balloon, 'remove' ).returns( {} );
|
|
|
- editingView.isFocused = true;
|
|
|
|
|
|
|
+ editingView.document.isFocused = true;
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should remove #toolbarView from the #_balloon', () => {
|
|
it( 'should remove #toolbarView from the #_balloon', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
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#render event', () => {
|
|
|
|
|
|
|
+ it( 'should stop update balloon position on ViewDocument#change event', () => {
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
const spy = sandbox.spy( balloon, 'updatePosition' );
|
|
const spy = sandbox.spy( balloon, 'updatePosition' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
- contextualToolbar.hide();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
|
|
+ balloonToolbar.hide();
|
|
|
|
|
|
|
|
editingView.fire( 'render' );
|
|
editingView.fire( 'render' );
|
|
|
sinon.assert.notCalled( spy );
|
|
sinon.assert.notCalled( spy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not remove #ttolbarView when is not added to the #_balloon', () => {
|
|
it( 'should not remove #ttolbarView when is not added to the #_balloon', () => {
|
|
|
- contextualToolbar.hide();
|
|
|
|
|
|
|
+ balloonToolbar.hide();
|
|
|
|
|
|
|
|
sinon.assert.notCalled( removeBalloonSpy );
|
|
sinon.assert.notCalled( removeBalloonSpy );
|
|
|
} );
|
|
} );
|
|
@@ -359,19 +358,19 @@ describe( 'ContextualToolbar', () => {
|
|
|
describe( 'destroy()', () => {
|
|
describe( 'destroy()', () => {
|
|
|
it( 'can be called multiple times', () => {
|
|
it( 'can be called multiple times', () => {
|
|
|
expect( () => {
|
|
expect( () => {
|
|
|
- contextualToolbar.destroy();
|
|
|
|
|
- contextualToolbar.destroy();
|
|
|
|
|
|
|
+ balloonToolbar.destroy();
|
|
|
|
|
+ balloonToolbar.destroy();
|
|
|
} ).to.not.throw();
|
|
} ).to.not.throw();
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not fire `_selectionChangeDebounced` after plugin destroy', done => {
|
|
it( 'should not fire `_selectionChangeDebounced` after plugin destroy', done => {
|
|
|
const spy = sandbox.spy();
|
|
const spy = sandbox.spy();
|
|
|
|
|
|
|
|
- contextualToolbar.on( '_selectionChangeDebounced', spy );
|
|
|
|
|
|
|
+ balloonToolbar.on( '_selectionChangeDebounced', spy );
|
|
|
|
|
|
|
|
selection.fire( 'change:range', { directChange: true } );
|
|
selection.fire( 'change:range', { directChange: true } );
|
|
|
|
|
|
|
|
- contextualToolbar.destroy();
|
|
|
|
|
|
|
+ balloonToolbar.destroy();
|
|
|
|
|
|
|
|
setTimeout( () => {
|
|
setTimeout( () => {
|
|
|
sinon.assert.notCalled( spy );
|
|
sinon.assert.notCalled( spy );
|
|
@@ -386,22 +385,22 @@ describe( 'ContextualToolbar', () => {
|
|
|
beforeEach( () => {
|
|
beforeEach( () => {
|
|
|
setData( model, '<paragraph>[bar]</paragraph>' );
|
|
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', () => {
|
|
it( 'should open when selection stops changing', () => {
|
|
|
sinon.assert.notCalled( showPanelSpy );
|
|
sinon.assert.notCalled( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
|
|
|
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should close when selection starts changing by a directChange', () => {
|
|
it( 'should close when selection starts changing by a directChange', () => {
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
@@ -413,7 +412,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should not close when selection starts changing by not a directChange', () => {
|
|
it( 'should not close when selection starts changing by not a directChange', () => {
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
sinon.assert.calledOnce( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
@@ -425,7 +424,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
|
it( 'should close when selection starts changing by not a directChange but will become collapsed', () => {
|
|
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.calledOnce( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
@@ -443,9 +442,9 @@ describe( 'ContextualToolbar', () => {
|
|
|
it( 'should hide if the editor loses focus', () => {
|
|
it( 'should hide if the editor loses focus', () => {
|
|
|
editor.ui.focusTracker.isFocused = true;
|
|
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.calledOnce( showPanelSpy );
|
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
sinon.assert.notCalled( hidePanelSpy );
|
|
@@ -461,7 +460,7 @@ describe( 'ContextualToolbar', () => {
|
|
|
it( 'should not hide if the editor loses focus and #toolbarView is not visible', () => {
|
|
it( 'should not hide if the editor loses focus and #toolbarView is not visible', () => {
|
|
|
editor.ui.focusTracker.isFocused = true;
|
|
editor.ui.focusTracker.isFocused = true;
|
|
|
|
|
|
|
|
- contextualToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
+ balloonToolbar.fire( '_selectionChangeDebounced' );
|
|
|
|
|
|
|
|
const stub = sandbox.stub( balloon, 'visibleView' ).get( () => null );
|
|
const stub = sandbox.stub( balloon, 'visibleView' ).get( () => null );
|
|
|
|
|
|
|
@@ -481,10 +480,10 @@ describe( 'ContextualToolbar', () => {
|
|
|
it( 'should fire `show` event just before panel shows', () => {
|
|
it( 'should fire `show` event just before panel shows', () => {
|
|
|
const spy = sandbox.spy();
|
|
const spy = sandbox.spy();
|
|
|
|
|
|
|
|
- contextualToolbar.on( 'show', spy );
|
|
|
|
|
|
|
+ balloonToolbar.on( 'show', spy );
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
|
|
|
|
|
|
- contextualToolbar.show();
|
|
|
|
|
|
|
+ balloonToolbar.show();
|
|
|
sinon.assert.calledOnce( spy );
|
|
sinon.assert.calledOnce( spy );
|
|
|
} );
|
|
} );
|
|
|
|
|
|
|
@@ -493,9 +492,9 @@ describe( 'ContextualToolbar', () => {
|
|
|
|
|
|
|
|
setData( model, '<paragraph>b[a]r</paragraph>' );
|
|
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 );
|
|
sinon.assert.notCalled( balloonAddSpy );
|
|
|
} );
|
|
} );
|
|
|
} );
|
|
} );
|