From 973f5777da97ea289f8eab3641e58697870c49ff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Piotrek=20Koszuli=C5=84ski?= Date: Mon, 24 Apr 2017 12:47:22 +0200 Subject: [PATCH] Pin the toolbar to the element, not range, to fix positioning on Edge. --- src/image/ui/imageballoonpanelview.js | 2 +- tests/image/ui/imageballoonpanelview.js | 20 +++++++++++++------- 2 files changed, 14 insertions(+), 8 deletions(-) diff --git a/src/image/ui/imageballoonpanelview.js b/src/image/ui/imageballoonpanelview.js index 6bd8939b..32bd19fd 100644 --- a/src/image/ui/imageballoonpanelview.js +++ b/src/image/ui/imageballoonpanelview.js @@ -95,7 +95,7 @@ export default class ImageBalloonPanelView extends BalloonPanelView { const defaultPositions = BalloonPanelView.defaultPositions; this.attachTo( { - target: editingView.domConverter.viewRangeToDom( editingView.selection.getFirstRange() ), + target: editingView.domConverter.viewToDom( editingView.selection.getSelectedElement() ), positions: [ defaultPositions.northArrowSouth, defaultPositions.southArrowNorth ] } ); } diff --git a/tests/image/ui/imageballoonpanelview.js b/tests/image/ui/imageballoonpanelview.js index 790f18d8..8ce7a255 100644 --- a/tests/image/ui/imageballoonpanelview.js +++ b/tests/image/ui/imageballoonpanelview.js @@ -67,6 +67,7 @@ describe( 'ImageBalloonPanel', () => { it( 'should detach when image element is no longer selected', () => { const spy = sinon.spy( panel, 'detach' ); + setData( document, '[]' ); panel.attach(); @@ -79,13 +80,17 @@ describe( 'ImageBalloonPanel', () => { it( 'should attach panel correctly', () => { const spy = sinon.spy( panel, 'attachTo' ); + + setData( document, '[]' ); panel.attach(); testPanelAttach( spy ); } ); it( 'should calculate panel position on scroll event', () => { + setData( document, '[]' ); panel.attach(); + const spy = sinon.spy( panel, 'attachTo' ); global.window.dispatchEvent( new Event( 'scroll' ) ); @@ -94,7 +99,9 @@ describe( 'ImageBalloonPanel', () => { } ); it( 'should calculate panel position on resize event event', () => { + setData( document, '[]' ); panel.attach(); + const spy = sinon.spy( panel, 'attachTo' ); global.window.dispatchEvent( new Event( 'resize' ) ); @@ -103,7 +110,9 @@ describe( 'ImageBalloonPanel', () => { } ); it( 'should hide panel on detach', () => { + setData( document, '[]' ); panel.attach(); + const spy = sinon.spy( panel, 'hide' ); panel.detach(); @@ -112,7 +121,9 @@ describe( 'ImageBalloonPanel', () => { } ); it( 'should not reposition panel after detaching', () => { + setData( document, '[]' ); panel.attach(); + const spy = sinon.spy( panel, 'attachTo' ); panel.detach(); @@ -124,16 +135,11 @@ describe( 'ImageBalloonPanel', () => { // Tests if panel.attachTo() was called correctly. function testPanelAttach( spy ) { - const domRange = editor.editing.view.domConverter.viewRangeToDom( editingView.selection.getFirstRange() ); - sinon.assert.calledOnce( spy ); const options = spy.firstCall.args[ 0 ]; - // Check if proper range was used. - expect( options.target.startContainer ).to.equal( domRange.startContainer ); - expect( options.target.startOffset ).to.equal( domRange.startOffset ); - expect( options.target.endContainer ).to.equal( domRange.endContainer ); - expect( options.target.endOffset ).to.equal( domRange.endOffset ); + // Check if proper target element was used. + expect( options.target.tagName.toLowerCase() ).to.equal( 'figure' ); // Check if correct positions are used. const [ north, south ] = options.positions;