Przeglądaj źródła

Fix table commands after changes in selection mode.

Maciej Gołaszewski 7 lat temu
rodzic
commit
3bed17dae5

+ 22 - 3
packages/ckeditor5-table/src/commands/removecolumncommand.js

@@ -12,6 +12,7 @@ import Command from '@ckeditor/ckeditor5-core/src/command';
 import TableWalker from '../tablewalker';
 import TableWalker from '../tablewalker';
 import TableUtils from '../tableutils';
 import TableUtils from '../tableutils';
 import { findAncestor, updateNumericAttribute } from './utils';
 import { findAncestor, updateNumericAttribute } from './utils';
+import Range from '../../../ckeditor5-engine/src/model/range';
 
 
 /**
 /**
  * The remove column command.
  * The remove column command.
@@ -52,7 +53,6 @@ export default class RemoveColumnCommand extends Command {
 		const table = tableRow.parent;
 		const table = tableRow.parent;
 
 
 		const headingColumns = table.getAttribute( 'headingColumns' ) || 0;
 		const headingColumns = table.getAttribute( 'headingColumns' ) || 0;
-		const row = table.getChildIndex( tableRow );
 
 
 		// Cache the table before removing or updating colspans.
 		// Cache the table before removing or updating colspans.
 		const tableMap = [ ...new TableWalker( table ) ];
 		const tableMap = [ ...new TableWalker( table ) ];
@@ -60,14 +60,23 @@ export default class RemoveColumnCommand extends Command {
 		// Get column index of removed column.
 		// Get column index of removed column.
 		const cellData = tableMap.find( value => value.cell === tableCell );
 		const cellData = tableMap.find( value => value.cell === tableCell );
 		const removedColumn = cellData.column;
 		const removedColumn = cellData.column;
+		const removedRow = cellData.row;
+
+		let cellToFocus;
+
+		const tableUtils = this.editor.plugins.get( TableUtils );
+		const columns = tableUtils.getColumns( tableCell.parent.parent );
+
+		const columnToFocus = removedColumn === columns - 1 ? removedColumn - 1 : removedColumn + 1;
+		const rowToFocus = removedRow;
 
 
 		model.change( writer => {
 		model.change( writer => {
 			// Update heading columns attribute if removing a row from head section.
 			// Update heading columns attribute if removing a row from head section.
-			if ( headingColumns && row <= headingColumns ) {
+			if ( headingColumns && removedRow <= headingColumns ) {
 				writer.setAttribute( 'headingColumns', headingColumns - 1, table );
 				writer.setAttribute( 'headingColumns', headingColumns - 1, table );
 			}
 			}
 
 
-			for ( const { cell, column, colspan } of tableMap ) {
+			for ( const { cell, row, column, rowspan, colspan } of tableMap ) {
 				// If colspaned cell overlaps removed column decrease it's span.
 				// If colspaned cell overlaps removed column decrease it's span.
 				if ( column <= removedColumn && colspan > 1 && column + colspan > removedColumn ) {
 				if ( column <= removedColumn && colspan > 1 && column + colspan > removedColumn ) {
 					updateNumericAttribute( 'colspan', colspan - 1, cell, writer );
 					updateNumericAttribute( 'colspan', colspan - 1, cell, writer );
@@ -75,7 +84,17 @@ export default class RemoveColumnCommand extends Command {
 					// The cell in removed column has colspan of 1.
 					// The cell in removed column has colspan of 1.
 					writer.remove( cell );
 					writer.remove( cell );
 				}
 				}
+
+				if ( isCellToFocusAfterRemoving( row, rowToFocus, rowspan, column, columnToFocus, colspan ) ) {
+					cellToFocus = cell;
+				}
 			}
 			}
+
+			writer.setSelection( Range.createCollapsedAt( cellToFocus ) );
 		} );
 		} );
 	}
 	}
 }
 }
+
+function isCellToFocusAfterRemoving( row, rowToFocus, rowspan, column, columnToFocus, colspan ) {
+	return ( row <= rowToFocus && row + rowspan >= rowToFocus ) && ( column <= columnToFocus && column + colspan >= columnToFocus );
+}

+ 23 - 7
packages/ckeditor5-table/src/commands/removerowcommand.js

@@ -50,30 +50,36 @@ export default class RemoveRowCommand extends Command {
 		const tableRow = tableCell.parent;
 		const tableRow = tableCell.parent;
 		const table = tableRow.parent;
 		const table = tableRow.parent;
 
 
-		const currentRow = table.getChildIndex( tableRow );
+		const removedRow = table.getChildIndex( tableRow );
+
+		const tableMap = [ ...new TableWalker( table, { endRow: removedRow } ) ];
+
+		const cellData = tableMap.find( value => value.cell === tableCell );
+
 		const headingRows = table.getAttribute( 'headingRows' ) || 0;
 		const headingRows = table.getAttribute( 'headingRows' ) || 0;
 
 
+		const rowToFocus = removedRow;
+		const columnToFocus = cellData.column;
+
 		model.change( writer => {
 		model.change( writer => {
-			if ( headingRows && currentRow <= headingRows ) {
+			if ( headingRows && removedRow <= headingRows ) {
 				updateNumericAttribute( 'headingRows', headingRows - 1, table, writer, 0 );
 				updateNumericAttribute( 'headingRows', headingRows - 1, table, writer, 0 );
 			}
 			}
 
 
-			const tableMap = [ ...new TableWalker( table, { endRow: currentRow } ) ];
-
 			const cellsToMove = new Map();
 			const cellsToMove = new Map();
 
 
 			// Get cells from removed row that are spanned over multiple rows.
 			// Get cells from removed row that are spanned over multiple rows.
 			tableMap
 			tableMap
-				.filter( ( { row, rowspan } ) => row === currentRow && rowspan > 1 )
+				.filter( ( { row, rowspan } ) => row === removedRow && rowspan > 1 )
 				.forEach( ( { column, cell, rowspan } ) => cellsToMove.set( column, { cell, rowspanToSet: rowspan - 1 } ) );
 				.forEach( ( { column, cell, rowspan } ) => cellsToMove.set( column, { cell, rowspanToSet: rowspan - 1 } ) );
 
 
 			// Reduce rowspan on cells that are above removed row and overlaps removed row.
 			// Reduce rowspan on cells that are above removed row and overlaps removed row.
 			tableMap
 			tableMap
-				.filter( ( { row, rowspan } ) => row <= currentRow - 1 && row + rowspan > currentRow )
+				.filter( ( { row, rowspan } ) => row <= removedRow - 1 && row + rowspan > removedRow )
 				.forEach( ( { cell, rowspan } ) => updateNumericAttribute( 'rowspan', rowspan - 1, cell, writer ) );
 				.forEach( ( { cell, rowspan } ) => updateNumericAttribute( 'rowspan', rowspan - 1, cell, writer ) );
 
 
 			// Move cells to another row.
 			// Move cells to another row.
-			const targetRow = currentRow + 1;
+			const targetRow = removedRow + 1;
 			const tableWalker = new TableWalker( table, { includeSpanned: true, startRow: targetRow, endRow: targetRow } );
 			const tableWalker = new TableWalker( table, { includeSpanned: true, startRow: targetRow, endRow: targetRow } );
 
 
 			let previousCell;
 			let previousCell;
@@ -93,6 +99,16 @@ export default class RemoveRowCommand extends Command {
 			}
 			}
 
 
 			writer.remove( tableRow );
 			writer.remove( tableRow );
+
+			const { cell: cellToFocus } = [ ...new TableWalker( table ) ].find( ( { row, column, rowspan, colspan } ) => {
+				return isCellToFocusAfterRemoving( row, rowToFocus, rowspan, column, columnToFocus, colspan );
+			} );
+
+			writer.setSelection( Range.createCollapsedAt( cellToFocus ) );
 		} );
 		} );
 	}
 	}
 }
 }
+
+function isCellToFocusAfterRemoving( row, rowToFocus, rowspan, column, columnToFocus, colspan ) {
+	return ( row <= rowToFocus && row + rowspan >= rowToFocus + 1 ) && ( column <= columnToFocus && column + colspan >= columnToFocus + 1 );
+}

+ 1 - 2
packages/ckeditor5-table/src/tableediting.js

@@ -56,7 +56,6 @@ export default class TableEditing extends Plugin {
 		schema.register( 'table', {
 		schema.register( 'table', {
 			allowWhere: '$block',
 			allowWhere: '$block',
 			allowAttributes: [ 'headingRows', 'headingColumns' ],
 			allowAttributes: [ 'headingRows', 'headingColumns' ],
-			isLimit: true,
 			isObject: true
 			isObject: true
 		} );
 		} );
 
 
@@ -175,7 +174,7 @@ export default class TableEditing extends Plugin {
 			cancel();
 			cancel();
 
 
 			editor.model.change( writer => {
 			editor.model.change( writer => {
-				writer.setSelection( Range.createIn( selectedElement.getChild( 0 ).getChild( 0 ) ) );
+				writer.setSelection( Range.createIn( selectedElement.getChild( 0 ).getChild( 0 ).getChild( 0 ) ) );
 			} );
 			} );
 		}
 		}
 	}
 	}

+ 24 - 21
packages/ckeditor5-table/src/tableselection.js

@@ -44,10 +44,26 @@ export default class TableSelection extends Plugin {
 		const editor = this.editor;
 		const editor = this.editor;
 		const viewDocument = editor.editing.view.document;
 		const viewDocument = editor.editing.view.document;
 
 
+		this.listenTo( viewDocument, 'keydown', () => {
+			if ( this.size > 1 ) {
+				this.stopSelection();
+				const tableCell = this._startElement;
+				this.clearSelection();
+
+				editor.model.change( writer => {
+					// Select the contents of table cell.
+					writer.setSelection( Range.createIn( tableCell ) );
+				} );
+			}
+		} );
+
 		this.listenTo( viewDocument, 'mousedown', ( eventInfo, domEventData ) => {
 		this.listenTo( viewDocument, 'mousedown', ( eventInfo, domEventData ) => {
 			const tableCell = getTableCell( domEventData, this.editor );
 			const tableCell = getTableCell( domEventData, this.editor );
 
 
 			if ( !tableCell ) {
 			if ( !tableCell ) {
+				this.stopSelection();
+				this.clearSelection();
+
 				return;
 				return;
 			}
 			}
 
 
@@ -65,26 +81,11 @@ export default class TableSelection extends Plugin {
 				return;
 				return;
 			}
 			}
 
 
-			const wasOne = this.size === 1;
-
 			this.updateSelection( tableCell );
 			this.updateSelection( tableCell );
 
 
 			if ( this.size > 1 ) {
 			if ( this.size > 1 ) {
 				domEventData.preventDefault();
 				domEventData.preventDefault();
 
 
-				if ( wasOne ) {
-					// TODO:
-					// editor.editing.view.change( writer => {
-					// 	// TODO const viewElement = editor.editing.mapper.toViewElement( this._startElement );
-					//
-					// 	// Set selection to the first selected table cell.
-					// 	// writer.setSelection( ViewRange.createIn( viewElement ), {
-					// 	// 	fake: true,
-					// 	// 	label: 'fake selection over table cell'
-					// 	// } );
-					// } );
-				}
-
 				this.redrawSelection();
 				this.redrawSelection();
 			}
 			}
 		} );
 		} );
@@ -98,6 +99,14 @@ export default class TableSelection extends Plugin {
 
 
 			this.stopSelection( tableCell );
 			this.stopSelection( tableCell );
 		} );
 		} );
+
+		this.listenTo( viewDocument, 'mouseleave', () => {
+			if ( !this.isSelecting ) {
+				return;
+			}
+
+			this.stopSelection();
+		} );
 	}
 	}
 
 
 	get isSelecting() {
 	get isSelecting() {
@@ -113,9 +122,6 @@ export default class TableSelection extends Plugin {
 		this._isSelecting = true;
 		this._isSelecting = true;
 		this._startElement = tableCell;
 		this._startElement = tableCell;
 		this._endElement = tableCell;
 		this._endElement = tableCell;
-
-		// todo: stop rendering
-		this.editor.editing.view._renderer.renderSelection = false;
 	}
 	}
 
 
 	updateSelection( tableCell ) {
 	updateSelection( tableCell ) {
@@ -148,7 +154,6 @@ export default class TableSelection extends Plugin {
 		}
 		}
 
 
 		this._isSelecting = false;
 		this._isSelecting = false;
-		this.editor.editing.view._renderer.renderSelection = true;
 	}
 	}
 
 
 	clearSelection() {
 	clearSelection() {
@@ -157,8 +162,6 @@ export default class TableSelection extends Plugin {
 		this._isSelecting = false;
 		this._isSelecting = false;
 		this.clearPreviousSelection();
 		this.clearPreviousSelection();
 		this._highlighted.clear();
 		this._highlighted.clear();
-
-		this.editor.editing.view._renderer.renderSelection = true;
 	}
 	}
 
 
 	* getSelection() {
 	* getSelection() {

+ 1 - 2
packages/ckeditor5-table/tests/_utils/utils.js

@@ -160,7 +160,6 @@ export function defaultSchema( schema, registerParagraph = true ) {
 	schema.register( 'table', {
 	schema.register( 'table', {
 		allowWhere: '$block',
 		allowWhere: '$block',
 		allowAttributes: [ 'headingRows', 'headingColumns' ],
 		allowAttributes: [ 'headingRows', 'headingColumns' ],
-		isLimit: true,
 		isObject: true
 		isObject: true
 	} );
 	} );
 
 
@@ -172,7 +171,7 @@ export function defaultSchema( schema, registerParagraph = true ) {
 	schema.register( 'tableCell', {
 	schema.register( 'tableCell', {
 		allowIn: 'tableRow',
 		allowIn: 'tableRow',
 		allowAttributes: [ 'colspan', 'rowspan' ],
 		allowAttributes: [ 'colspan', 'rowspan' ],
-		isLimit: true
+		isObject: true
 	} );
 	} );
 
 
 	// Allow all $block content inside table cell.
 	// Allow all $block content inside table cell.

+ 11 - 11
packages/ckeditor5-table/tests/commands/mergecellscommand.js

@@ -240,7 +240,7 @@ describe( 'MergeCellsCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ { colspan: 2, contents: '[<paragraph>00</paragraph><paragraph>01</paragraph>]' } ]
+				[ { colspan: 2, contents: '<paragraph>[00</paragraph><paragraph>01]</paragraph>' } ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -261,11 +261,11 @@ describe( 'MergeCellsCommand', () => {
 				[ {
 				[ {
 					colspan: 3,
 					colspan: 3,
 					rowspan: 2,
 					rowspan: 2,
-					contents: '[<paragraph>00</paragraph>' +
+					contents: '<paragraph>[00</paragraph>' +
 						'<paragraph>02</paragraph>' +
 						'<paragraph>02</paragraph>' +
 						'<paragraph>10</paragraph>' +
 						'<paragraph>10</paragraph>' +
 						'<paragraph>11</paragraph>' +
 						'<paragraph>11</paragraph>' +
-						'<paragraph>12</paragraph>]'
+						'<paragraph>12]</paragraph>'
 				}, '03' ],
 				}, '03' ],
 				[ '13' ]
 				[ '13' ]
 			] ) );
 			] ) );
@@ -281,7 +281,7 @@ describe( 'MergeCellsCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ { colspan: 2, contents: '[<paragraph></paragraph>]' } ]
+				[ { colspan: 2, contents: '<paragraph>[]</paragraph>' } ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -295,7 +295,7 @@ describe( 'MergeCellsCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ { colspan: 2, contents: '[<paragraph>foo</paragraph>]' } ]
+				[ { colspan: 2, contents: '<paragraph>[foo]</paragraph>' } ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -309,7 +309,7 @@ describe( 'MergeCellsCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ { colspan: 2, contents: '[<paragraph>foo</paragraph>]' } ]
+				[ { colspan: 2, contents: '<paragraph>[foo]</paragraph>' } ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -329,7 +329,7 @@ describe( 'MergeCellsCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ { colspan: 2, contents: '[<block></block><block></block>]' } ]
+				[ { colspan: 2, contents: '<block>[</block><block>]</block>' } ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -351,7 +351,7 @@ describe( 'MergeCellsCommand', () => {
 
 
 				expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 					[
 					[
-						'[<paragraph>00</paragraph><paragraph>10</paragraph><paragraph>20</paragraph>]'
+						'<paragraph>[00</paragraph><paragraph>10</paragraph><paragraph>20]</paragraph>'
 					]
 					]
 				] ) );
 				] ) );
 			} );
 			} );
@@ -373,7 +373,7 @@ describe( 'MergeCellsCommand', () => {
 
 
 				expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 					[
 					[
-						{ rowspan: 2, contents: '[<paragraph>00</paragraph><paragraph>10</paragraph><paragraph>20</paragraph>]' },
+						{ rowspan: 2, contents: '<paragraph>[00</paragraph><paragraph>10</paragraph><paragraph>20]</paragraph>' },
 						'01',
 						'01',
 						{ rowspan: 2, contents: '02' }
 						{ rowspan: 2, contents: '02' }
 					],
 					],
@@ -402,8 +402,8 @@ describe( 'MergeCellsCommand', () => {
 					[
 					[
 						{
 						{
 							colspan: 2,
 							colspan: 2,
-							contents: '[<paragraph>20</paragraph><paragraph>21</paragraph>' +
-								'<paragraph>30</paragraph><paragraph>31</paragraph>]'
+							contents: '<paragraph>[20</paragraph><paragraph>21</paragraph>' +
+								'<paragraph>30</paragraph><paragraph>31]</paragraph>'
 						}
 						}
 					]
 					]
 				] ) );
 				] ) );

+ 20 - 4
packages/ckeditor5-table/tests/commands/removecolumncommand.js

@@ -71,7 +71,7 @@ describe( 'RemoveColumnCommand', () => {
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				[ '00', '02' ],
 				[ '00', '02' ],
-				[ '<paragraph>10[]</paragraph>', '12' ],
+				[ '10', '[]12' ],
 				[ '20', '22' ]
 				[ '20', '22' ]
 			] ) );
 			] ) );
 		} );
 		} );
@@ -86,7 +86,7 @@ describe( 'RemoveColumnCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ '<paragraph>[]01</paragraph>' ],
+				[ '[]01' ],
 				[ '11' ],
 				[ '11' ],
 				[ '21' ]
 				[ '21' ]
 			] ) );
 			] ) );
@@ -103,7 +103,7 @@ describe( 'RemoveColumnCommand', () => {
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				[ '01' ],
 				[ '01' ],
-				[ '<paragraph>[]11</paragraph>' ],
+				[ '[]11' ],
 				[ '21' ]
 				[ '21' ]
 			], { headingColumns: 1 } ) );
 			], { headingColumns: 1 } ) );
 		} );
 		} );
@@ -122,7 +122,7 @@ describe( 'RemoveColumnCommand', () => {
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				[ { colspan: 3, contents: '00' }, '03' ],
 				[ { colspan: 3, contents: '00' }, '03' ],
 				[ { colspan: 2, contents: '10' }, '13' ],
 				[ { colspan: 2, contents: '10' }, '13' ],
-				[ { colspan: 2, contents: '<paragraph>20[]</paragraph>' }, '23' ],
+				[ { colspan: 2, contents: '20' }, '[]23' ],
 				[ '30', '31', '33' ],
 				[ '30', '31', '33' ],
 				[ '40', '41', '43' ]
 				[ '40', '41', '43' ]
 
 
@@ -144,5 +144,21 @@ describe( 'RemoveColumnCommand', () => {
 				[ '21', '22', '23' ]
 				[ '21', '22', '23' ]
 			] ) );
 			] ) );
 		} );
 		} );
+
+		it( 'should move focus to previous column of removed cell if in last column', () => {
+			setData( model, modelTable( [
+				[ '00', '01', '02' ],
+				[ '10', '11', '12[]' ],
+				[ '20', '21', '22' ]
+			] ) );
+
+			command.execute();
+
+			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
+				[ '00', '01' ],
+				[ '10', '[]11' ],
+				[ '20', '21' ]
+			] ) );
+		} );
 	} );
 	} );
 } );
 } );

+ 7 - 7
packages/ckeditor5-table/tests/commands/removerowcommand.js

@@ -64,8 +64,8 @@ describe( 'RemoveRowCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ '00', '<paragraph>01[]</paragraph>' ],
-				[ '20', '21' ]
+				[ '00', '01' ],
+				[ '[]20', '21' ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 
@@ -79,7 +79,7 @@ describe( 'RemoveRowCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ '<paragraph>[]10</paragraph>', '11' ],
+				[ '[]10', '11' ],
 				[ '20', '21' ]
 				[ '20', '21' ]
 			] ) );
 			] ) );
 		} );
 		} );
@@ -94,8 +94,8 @@ describe( 'RemoveRowCommand', () => {
 			command.execute();
 			command.execute();
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
-				[ '00', '<paragraph>01[]</paragraph>' ],
-				[ '20', '21' ]
+				[ '00', '01' ],
+				[ '[]20', '21' ]
 			], { headingRows: 1 } ) );
 			], { headingRows: 1 } ) );
 		} );
 		} );
 
 
@@ -111,8 +111,8 @@ describe( 'RemoveRowCommand', () => {
 
 
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 			expect( formatTable( getData( model ) ) ).to.equal( formattedModelTable( [
 				[ { rowspan: 3, contents: '00' }, { rowspan: 2, contents: '01' }, { rowspan: 2, contents: '02' }, '03', '04' ],
 				[ { rowspan: 3, contents: '00' }, { rowspan: 2, contents: '01' }, { rowspan: 2, contents: '02' }, '03', '04' ],
-				[ '13', '<paragraph>14[]</paragraph>' ],
-				[ '30', '31', '32', '33', '34' ]
+				[ '13', '14' ],
+				[ '30', '[]31', '32', '33', '34' ]
 			] ) );
 			] ) );
 		} );
 		} );
 
 

+ 14 - 18
packages/ckeditor5-table/tests/tableediting.js

@@ -221,17 +221,14 @@ describe( 'TableEditing', () => {
 
 
 		describe( 'on TAB', () => {
 		describe( 'on TAB', () => {
 			it( 'should do nothing if selection is not in a table', () => {
 			it( 'should do nothing if selection is not in a table', () => {
-				setModelData( model, '[]' + modelTable( [
-					[ '11', '12' ]
-				] ) );
+				setModelData( model, '<paragraph>[]</paragraph>' + modelTable( [ [ '11', '12' ] ] ) );
 
 
 				editor.editing.view.document.fire( 'keydown', domEvtDataStub );
 				editor.editing.view.document.fire( 'keydown', domEvtDataStub );
 
 
 				sinon.assert.notCalled( domEvtDataStub.preventDefault );
 				sinon.assert.notCalled( domEvtDataStub.preventDefault );
 				sinon.assert.notCalled( domEvtDataStub.stopPropagation );
 				sinon.assert.notCalled( domEvtDataStub.stopPropagation );
-				expect( formatTable( getModelData( model ) ) ).to.equal( '[]' + formattedModelTable( [
-					[ '11', '12' ]
-				] ) );
+				expect( formatTable( getModelData( model ) ) )
+					.to.equal( '<paragraph>[]</paragraph>' + formattedModelTable( [ [ '11', '12' ] ] ) );
 			} );
 			} );
 
 
 			it( 'should move to next cell', () => {
 			it( 'should move to next cell', () => {
@@ -244,7 +241,7 @@ describe( 'TableEditing', () => {
 				sinon.assert.calledOnce( domEvtDataStub.preventDefault );
 				sinon.assert.calledOnce( domEvtDataStub.preventDefault );
 				sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 				sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
-					[ '11', '[<paragraph>12</paragraph>]' ]
+					[ '11', '[12]' ]
 				] ) );
 				] ) );
 			} );
 			} );
 
 
@@ -257,7 +254,7 @@ describe( 'TableEditing', () => {
 
 
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 					[ '11', '12' ],
 					[ '11', '12' ],
-					[ '[<paragraph></paragraph>]', '' ]
+					[ '[]', '' ]
 				] ) );
 				] ) );
 			} );
 			} );
 
 
@@ -271,7 +268,7 @@ describe( 'TableEditing', () => {
 
 
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 					[ '11', '12' ],
 					[ '11', '12' ],
-					[ '[<paragraph>21</paragraph>]', '22' ]
+					[ '[21]', '22' ]
 				] ) );
 				] ) );
 			} );
 			} );
 
 
@@ -286,7 +283,7 @@ describe( 'TableEditing', () => {
 					[
 					[
 						'11',
 						'11',
 						'<paragraph>12</paragraph><paragraph>foo</paragraph><paragraph>bar</paragraph>',
 						'<paragraph>12</paragraph><paragraph>foo</paragraph><paragraph>bar</paragraph>',
-						'[<paragraph>13</paragraph>]'
+						'[13]'
 					],
 					],
 				] ) );
 				] ) );
 			} );
 			} );
@@ -335,7 +332,7 @@ describe( 'TableEditing', () => {
 					sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 					sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 
 
 					expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 					expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
-						[ '[<paragraph>11</paragraph>]', '12' ]
+						[ '[11]', '12' ]
 					] ) );
 					] ) );
 
 
 					// Should cancel event - so no other tab handler is called.
 					// Should cancel event - so no other tab handler is called.
@@ -368,7 +365,7 @@ describe( 'TableEditing', () => {
 			} );
 			} );
 
 
 			it( 'should do nothing if selection is not in a table', () => {
 			it( 'should do nothing if selection is not in a table', () => {
-				setModelData( model, '[]' + modelTable( [
+				setModelData( model, '<paragraph>[]</paragraph>' + modelTable( [
 					[ '11', '12' ]
 					[ '11', '12' ]
 				] ) );
 				] ) );
 
 
@@ -379,9 +376,8 @@ describe( 'TableEditing', () => {
 
 
 				sinon.assert.notCalled( domEvtDataStub.preventDefault );
 				sinon.assert.notCalled( domEvtDataStub.preventDefault );
 				sinon.assert.notCalled( domEvtDataStub.stopPropagation );
 				sinon.assert.notCalled( domEvtDataStub.stopPropagation );
-				expect( formatTable( getModelData( model ) ) ).to.equal( '[]' + formattedModelTable( [
-					[ '11', '12' ]
-				] ) );
+				expect( formatTable( getModelData( model ) ) )
+					.to.equal( '<paragraph>[]</paragraph>' + formattedModelTable( [ [ '11', '12' ] ] ) );
 			} );
 			} );
 
 
 			it( 'should move to previous cell', () => {
 			it( 'should move to previous cell', () => {
@@ -395,7 +391,7 @@ describe( 'TableEditing', () => {
 				sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 				sinon.assert.calledOnce( domEvtDataStub.stopPropagation );
 
 
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
-					[ '[<paragraph>11</paragraph>]', '12' ]
+					[ '[11]', '12' ]
 				] ) );
 				] ) );
 			} );
 			} );
 
 
@@ -420,7 +416,7 @@ describe( 'TableEditing', () => {
 				editor.editing.view.document.fire( 'keydown', domEvtDataStub );
 				editor.editing.view.document.fire( 'keydown', domEvtDataStub );
 
 
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
-					[ '11', '[<paragraph>12</paragraph>]' ],
+					[ '11', '[12]' ],
 					[ '21', '22' ]
 					[ '21', '22' ]
 				] ) );
 				] ) );
 			} );
 			} );
@@ -434,7 +430,7 @@ describe( 'TableEditing', () => {
 
 
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 				expect( formatTable( getModelData( model ) ) ).to.equal( formattedModelTable( [
 					[
 					[
-						'[<paragraph>11</paragraph>]',
+						'[11]',
 						'<paragraph>12</paragraph><paragraph>foo</paragraph><paragraph>bar</paragraph>',
 						'<paragraph>12</paragraph><paragraph>foo</paragraph><paragraph>bar</paragraph>',
 						'13'
 						'13'
 					],
 					],