8
0
Просмотр исходного кода

Added support for Range and Rect as a target.

Oskar Wróbel 8 лет назад
Родитель
Сommit
1ff027be74

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

@@ -10,6 +10,8 @@
 import View from '../../view';
 import Template from '../../template';
 import { getOptimalPosition } from '@ckeditor/ckeditor5-utils/src/dom/position';
+import isRange from '@ckeditor/ckeditor5-utils/src/dom/isrange';
+import isElement from '@ckeditor/ckeditor5-utils/src/lib/lodash/isElement';
 import toUnit from '@ckeditor/ckeditor5-utils/src/dom/tounit';
 import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 
@@ -183,8 +185,11 @@ export default class BalloonPanelView extends View {
 
 		// Then we need to listen on scroll event of eny element in the document.
 		this.listenTo( global.document, 'scroll', ( evt, domEvt ) => {
-			// And update position if scrolled element contains related to the balloon elements.
-			if ( domEvt.target.contains( target ) || domEvt.target.contains( limiter ) ) {
+			// We need to take HTMLElement related to the target if it is possible.
+			const targetNode = isElement( target ) ? target : isRange( target ) ? target.commonAncestorContainer : null;
+
+			// We need to update position if scrolled element contains related to the balloon elements.
+			if ( ( targetNode && domEvt.target.contains( targetNode ) ) || domEvt.target.contains( limiter ) ) {
 				this.attachTo( options );
 			}
 		}, { useCapture: true } );

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

@@ -9,6 +9,7 @@ import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 import ViewCollection from '../../../src/viewcollection';
 import BalloonPanelView from '../../../src/panel/balloon/balloonpanelview';
 import ButtonView from '../../../src/button/buttonview';
+import Rect from '@ckeditor/ckeditor5-utils/src/dom/rect';
 import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
 import * as positionUtils from '@ckeditor/ckeditor5-utils/src/dom/position';
 
@@ -496,6 +497,36 @@ describe( 'BalloonPanelView', () => {
 
 			expect( attachToSpy.calledTwice ).to.true;
 		} );
+
+		it( 'should work for Range as a target', () => {
+			const element = document.createElement( 'div' );
+			const range = document.createRange();
+
+			element.appendChild( document.createTextNode( 'foo bar' ) );
+			document.body.appendChild( element );
+			range.selectNodeContents( element );
+
+			view.keepAttachedTo( { target: range } );
+
+			expect( attachToSpy.calledOnce ).to.true;
+
+			element.dispatchEvent( new Event( 'scroll' ) );
+
+			expect( attachToSpy.calledTwice ).to.true;
+		} );
+
+		it( 'should work for Rect as a target', () => {
+			// Just check if this normally works without errors.
+			const rect = new Rect( {} );
+
+			view.keepAttachedTo( { target: rect, limiter } );
+
+			expect( attachToSpy.calledOnce ).to.true;
+
+			limiter.dispatchEvent( new Event( 'scroll' ) );
+
+			expect( attachToSpy.calledTwice ).to.true;
+		} );
 	} );
 } );