8
0
فهرست منبع

Renamed `_selectionChangeDone` event to `selectionChangeDebounced`.

Oskar Wróbel 8 سال پیش
والد
کامیت
d68eee6a5a
2فایلهای تغییر یافته به همراه35 افزوده شده و 28 حذف شده
  1. 16 9
      packages/ckeditor5-ui/src/toolbar/contextualtoolbar.js
  2. 19 19
      packages/ckeditor5-ui/tests/toolbar/contextualtoolbar.js

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

@@ -57,17 +57,15 @@ export default class ContextualToolbar extends Plugin {
 		this._balloon = this.editor.plugins.get( ContextualBalloon );
 
 		/**
-		 * This is internal plugin event which is fired 200 ms after selection last change (lodash#debounce).
-		 * This is to makes easy test debounced action without need to use `setTimeout`. Lodash keeps time related
-		 * stuff in a closure and it's not possible to override it by sinon fake timers.
+		 * Fires {@link #event:_selectionChangeDebounced} event using `lodash#debounce`.
 		 *
-		 * This debounced function is stored as a plugin property to make possible to cancel
+		 * This function is stored as a plugin property to make possible to cancel
 		 * trailing debounced invocation on destroy.
 		 *
 		 * @private
 		 * @member {Function}
 		 */
-		this._fireChangeDoneDebounced = debounce( () => this.fire( '_selectionChangeDone' ), 200 );
+		this._fireSelectionChangeDebounced = debounce( () => this.fire( '_selectionChangeDebounced' ), 200 );
 
 		// Attach lifecycle actions.
 		this._handleSelectionChange();
@@ -122,12 +120,12 @@ export default class ContextualToolbar extends Plugin {
 				this._hidePanel();
 			}
 
-			// Fire internal `_selectionChangeDone` when the selection stops changing.
-			this._fireChangeDoneDebounced();
+			// Fire internal `_selectionChangeDebounced` when the selection stops changing.
+			this._fireSelectionChangeDebounced();
 		} );
 
 		// Hide the toolbar when the selection stops changing.
-		this.listenTo( this, '_selectionChangeDone', () => this._showPanel() );
+		this.listenTo( this, '_selectionChangeDebounced', () => this._showPanel() );
 	}
 
 	/**
@@ -205,8 +203,17 @@ export default class ContextualToolbar extends Plugin {
 	 * @inheritDoc
 	 */
 	destroy() {
-		this._fireChangeDoneDebounced.cancel();
+		this._fireSelectionChangeDebounced.cancel();
 		this.stopListening();
 		super.destroy();
 	}
+
+	/**
+	 * This is internal plugin event which is fired 200 ms after model selection last change (lodash#debounce).
+	 * This is to makes easy test debounced action without need to use `setTimeout`. Lodash keeps time related
+	 * stuff in a closure and it's not possible to override it by sinon fake timers.
+	 *
+	 * @private
+	 * @event _selectionChangeDebounced
+	 */
 }

+ 19 - 19
packages/ckeditor5-ui/tests/toolbar/contextualtoolbar.js

@@ -66,14 +66,14 @@ describe( 'ContextualToolbar', () => {
 		expect( contextualToolbar.toolbarView.items ).to.length( 2 );
 	} );
 
-	it( 'should fire internal `_selectionChangeDone` event 200 ms after last selection change', ( done ) => {
+	it( 'should fire internal `_selectionChangeDebounced` event 200 ms after last selection change', ( done ) => {
 		// This test uses setTimeout to test lodash#debounce because sinon fake timers
 		// doesn't work with lodash. Lodash keeps time related stuff in a closure
 		// and sinon is not able to override it.
 
 		const spy = sandbox.spy();
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
-		contextualToolbar.on( '_selectionChangeDone', spy );
+		contextualToolbar.on( '_selectionChangeDebounced', spy );
 
 		editor.document.selection.fire( 'change:range', {} );
 
@@ -108,7 +108,7 @@ describe( 'ContextualToolbar', () => {
 
 		expect( balloon.visibleView ).to.null;
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 	} );
@@ -116,7 +116,7 @@ describe( 'ContextualToolbar', () => {
 	it( 'should close when selection starts changing by a directChange', () => {
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 
@@ -128,7 +128,7 @@ describe( 'ContextualToolbar', () => {
 	it( 'should not close when selection starts changing by not a directChange', () => {
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 
@@ -140,7 +140,7 @@ describe( 'ContextualToolbar', () => {
 	it( 'should close when selection starts changing by not a directChange but will become collapsed', () => {
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		// Collapse range silently (without firing `change:range` { directChange: true } event).
 		const range = editor.document.selection._ranges[ 0 ];
@@ -162,7 +162,7 @@ describe( 'ContextualToolbar', () => {
 			height: 1000
 		} );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 		expect( balloon.view.top ).to.be.above( 310 );
@@ -179,7 +179,7 @@ describe( 'ContextualToolbar', () => {
 			height: 310
 		} );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 		expect( balloon.view.top ).to.be.below( 310 );
@@ -196,7 +196,7 @@ describe( 'ContextualToolbar', () => {
 			height: 1000
 		} );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 		expect( balloon.view.top ).to.be.below( 100 );
@@ -213,7 +213,7 @@ describe( 'ContextualToolbar', () => {
 			height: 905
 		} );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 		expect( balloon.view.top ).to.be.above( 100 );
@@ -223,12 +223,12 @@ describe( 'ContextualToolbar', () => {
 		setData( editor.document, '<paragraph>ba[]r</paragraph>' );
 
 		editor.document.selection.fire( 'change:range', {} );
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		setData( editor.document, '<paragraph>b[]ar</paragraph>' );
 
 		editor.document.selection.fire( 'change:range', {} );
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.null;
 	} );
@@ -237,7 +237,7 @@ describe( 'ContextualToolbar', () => {
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 		editor.ui.focusTracker.isFocused = true;
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 
@@ -249,12 +249,12 @@ describe( 'ContextualToolbar', () => {
 	it( 'should do nothing when panel is being added to balloon stack twice', () => {
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		expect( balloon.visibleView ).to.equal( contextualToolbar.toolbarView );
 
 		expect( () => {
-			contextualToolbar.fire( '_selectionChangeDone' );
+			contextualToolbar.fire( '_selectionChangeDebounced' );
 		} ).to.not.throw();
 	} );
 
@@ -263,7 +263,7 @@ describe( 'ContextualToolbar', () => {
 
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		sinon.assert.notCalled( spy );
 
@@ -277,7 +277,7 @@ describe( 'ContextualToolbar', () => {
 
 		setData( editor.document, '<paragraph>[bar]</paragraph>' );
 
-		contextualToolbar.fire( '_selectionChangeDone' );
+		contextualToolbar.fire( '_selectionChangeDebounced' );
 
 		// Hide toolbar.
 		editor.document.selection.fire( 'change:range', { directChange: true } );
@@ -294,10 +294,10 @@ describe( 'ContextualToolbar', () => {
 	} );
 
 	describe( 'destroy()', () => {
-		it( 'should not fire `_selectionChangeDone` after plugin destroy', ( done ) => {
+		it( 'should not fire `_selectionChangeDebounced` after plugin destroy', ( done ) => {
 			const spy = sandbox.spy();
 
-			contextualToolbar.on( '_selectionChangeDone', spy );
+			contextualToolbar.on( '_selectionChangeDebounced', spy );
 
 			editor.document.selection.fire( 'change:range', { directChange: true } );