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

BalloonToolbar should not show up when multiple table cells are selected.

Aleksander Nowodzinski 5 лет назад
Родитель
Сommit
9f3783a54d

+ 1 - 0
packages/ckeditor5-ui/package.json

@@ -28,6 +28,7 @@
     "@ckeditor/ckeditor5-mention": "^21.0.0",
     "@ckeditor/ckeditor5-paragraph": "^21.0.0",
     "@ckeditor/ckeditor5-horizontal-line": "^21.0.0",
+    "@ckeditor/ckeditor5-table": "^21.0.0",
     "@ckeditor/ckeditor5-typing": "^21.0.0"
   },
   "engines": {

+ 5 - 5
packages/ckeditor5-ui/src/toolbar/balloon/balloontoolbar.js

@@ -222,9 +222,9 @@ export default class BalloonToolbar extends Plugin {
 			return;
 		}
 
-		// Do not show the toolbar when there is more than one range in the selection and they fully contain object elements.
+		// Do not show the toolbar when there is more than one range in the selection and they fully contain selectable elements.
 		// See https://github.com/ckeditor/ckeditor5/issues/6443.
-		if ( selectionContainsOnlyMultipleObjects( selection, schema ) ) {
+		if ( selectionContainsOnlyMultipleSelectables( selection, schema ) ) {
 			return;
 		}
 
@@ -364,14 +364,14 @@ function getBalloonPositions( isBackward ) {
 	];
 }
 
-// Returns "true" when the selection has multiple ranges and each range contains an object
+// Returns "true" when the selection has multiple ranges and each range contains a selectable element
 // and nothing else.
 //
 // @private
 // @param {module:engine/model/selection~Selection} selection
 // @param {module:engine/model/schema~Schema} schema
 // @returns {Boolean}
-function selectionContainsOnlyMultipleObjects( selection, schema ) {
+function selectionContainsOnlyMultipleSelectables( selection, schema ) {
 	// It doesn't contain multiple objects if there is only one range.
 	if ( selection.rangeCount === 1 ) {
 		return false;
@@ -380,7 +380,7 @@ function selectionContainsOnlyMultipleObjects( selection, schema ) {
 	return [ ...selection.getRanges() ].every( range => {
 		const element = range.getContainedElement();
 
-		return element && schema.isObject( element );
+		return element && schema.isSelectable( element );
 	} );
 }
 

+ 16 - 2
packages/ckeditor5-ui/tests/toolbar/balloon/balloontoolbar.js

@@ -15,6 +15,7 @@ import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
 import Underline from '@ckeditor/ckeditor5-basic-styles/src/underline';
 import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 import HorizontalLine from '@ckeditor/ckeditor5-horizontal-line/src/horizontalline';
+import TableEditing from '@ckeditor/ckeditor5-table/src/tableediting';
 import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 import ResizeObserver from '@ckeditor/ckeditor5-utils/src/dom/resizeobserver';
 
@@ -56,7 +57,7 @@ describe( 'BalloonToolbar', () => {
 
 		return ClassicTestEditor
 			.create( editorElement, {
-				plugins: [ Paragraph, Bold, Italic, BalloonToolbar, HorizontalLine ],
+				plugins: [ Paragraph, Bold, Italic, BalloonToolbar, HorizontalLine, TableEditing ],
 				balloonToolbar: [ 'bold', 'italic' ]
 			} )
 			.then( newEditor => {
@@ -377,13 +378,26 @@ describe( 'BalloonToolbar', () => {
 
 		// https://github.com/ckeditor/ckeditor5/issues/6443
 		it( 'should not add the #toolbarView to the #_balloon when the selection contains more than one fully contained object', () => {
-			// This is for multi cell selection in tables.
 			setData( model, '[<horizontalLine></horizontalLine>]<paragraph>foo</paragraph>[<horizontalLine></horizontalLine>]' );
 
 			balloonToolbar.show();
 			sinon.assert.notCalled( balloonAddSpy );
 		} );
 
+		// https://github.com/ckeditor/ckeditor5/issues/6432
+		it( 'should not add the #toolbarView to the #_balloon when the selection contains more than one fully contained selectable', () => {
+			// This is for multi cell selection in tables.
+			setData( model, '<table>' +
+				'<tableRow>' +
+					'[<tableCell><paragraph>foo</paragraph></tableCell>]' +
+					'[<tableCell><paragraph>bar</paragraph></tableCell>]' +
+				'</tableRow>' +
+			'</table>' );
+
+			balloonToolbar.show();
+			sinon.assert.notCalled( balloonAddSpy );
+		} );
+
 		it( 'should not add #toolbarView to the #_balloon when all components inside #toolbarView are disabled', () => {
 			Array.from( balloonToolbar.toolbarView.items ).forEach( item => {
 				item.isEnabled = false;