diff --git a/src/ui/imageballoonpanelview.js b/src/ui/imageballoonpanelview.js index 0096fda5..df051d8e 100644 --- a/src/ui/imageballoonpanelview.js +++ b/src/ui/imageballoonpanelview.js @@ -54,9 +54,6 @@ export default class ImageBalloonPanelView extends BalloonPanelView { this.editor = editor; const editingView = editor.editing.view; - // Let the focusTracker know about new focusable UI element. - editor.ui.focusTracker.add( this.element ); - // Hide the balloon if editor had focus and now focus is lost. this.listenTo( editor.ui.focusTracker, 'change:isFocused', ( evt, name, is, was ) => { if ( was && !is ) { @@ -85,6 +82,16 @@ export default class ImageBalloonPanelView extends BalloonPanelView { }, 100 ); } + /** + * @inheritDoc + */ + init() { + // Let the focusTracker know about new focusable UI element. + this.editor.ui.focusTracker.add( this.element ); + + return super.init(); + } + /** * Attaches the panel and enables `scroll` and `resize` listeners. */ diff --git a/tests/ui/imageballoonpanelview.js b/tests/ui/imageballoonpanelview.js index db86f0fd..0d0d2abc 100644 --- a/tests/ui/imageballoonpanelview.js +++ b/tests/ui/imageballoonpanelview.js @@ -36,12 +36,25 @@ describe( 'ImageBalloonPanel', () => { return editor.destroy(); } ); - it( 'should add element to editor\'s focus tracker', () => { + it( 'init method should return a promise', () => { + const panel = new ImageBalloonPanel( editor ); + const promise = panel.init(); + + expect( promise ).to.be.instanceof( Promise ); + + return promise; + } ); + + it( 'should add element to editor\'s focus tracker after init', () => { const spy = sinon.spy( editor.ui.focusTracker, 'add' ); const panel = new ImageBalloonPanel( editor ); - sinon.assert.calledOnce( spy ); - sinon.assert.calledWithExactly( spy, panel.element ); + sinon.assert.notCalled( spy ); + + return panel.init().then( () => { + sinon.assert.calledOnce( spy ); + sinon.assert.calledWithExactly( spy, panel.element ); + } ); } ); it( 'should detach panel when focus is removed', () => {