Merge pull request #151 from ckeditor/t/134

Fix: Autoparagraph text nodes in table cells. Closes #134.
ckeditor · Feb 7, 2019 · 5863307 · 5863307
2 parents 041be55 + eb6f525
commit 5863307
Show file tree

Hide file tree

Showing 2 changed files with 115 additions and 2 deletions.
diff --git a/src/converters/table-cell-content-post-fixer.js b/src/converters/table-cell-content-post-fixer.js
@@ -97,16 +97,29 @@ function fixTableRow( tableRow, writer ) {
 	return wasFixed;
 }
 
-// Fixes all table cell content by adding paragraph to a table cell without any child.
+// Fixes all table cell content by:
+// - adding paragraph to a table cell without any child.
+// - wrapping direct $text in <paragraph>.
 //
 // @param {module:engine/model/element~Element} table
 // @param {module:engine/model/writer~Writer} writer
+// @returns {Boolean}
 function fixTableCellContent( tableCell, writer ) {
+	// Insert paragraph to an empty table cell.
 	if ( tableCell.childCount == 0 ) {
 		writer.insertElement( 'paragraph', tableCell );
 
 		return true;
 	}
 
-	return false;
+	// Check table cell children for directly placed $text nodes.
+	// Temporary solution. See https://github.com/ckeditor/ckeditor5/issues/1464.
+	const textNodes = Array.from( tableCell.getChildren() ).filter( child => child.is( 'text' ) );
+
+	for ( const child of textNodes ) {
+		writer.wrap( writer.createRangeOn( child ), 'paragraph' );
+	}
+
+	// Return true when there were text nodes to fix.
+	return !!textNodes.length;
 }
diff --git a/tests/converters/table-cell-content-post-fixer.js b/tests/converters/table-cell-content-post-fixer.js
@@ -121,4 +121,104 @@ describe( 'Table cell content post-fixer', () => {
 			'</table>'
 		) );
 	} );
+
+	it( 'should wrap in paragraph $text nodes placed directly in tableCell (on table cell modification) ', () => {
+		setModelData( model,
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell><paragraph></paragraph></tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		);
+
+		// Remove paragraph from table cell & insert: $text<paragraph>$text</paragraph>$text.
+		model.change( writer => {
+			writer.remove( writer.createRangeIn( root.getNodeByPath( [ 0, 0, 0 ] ) ) );
+
+			const paragraph = writer.createElement( 'paragraph' );
+
+			writer.insertText( 'foo', root.getNodeByPath( [ 0, 0, 0 ] ) );
+			writer.insert( paragraph, root.getNodeByPath( [ 0, 0, 0 ] ), 'end' );
+			writer.insertText( 'bar', paragraph );
+			writer.insertText( 'baz', root.getNodeByPath( [ 0, 0, 0 ] ), 'end' );
+		} );
+
+		expect( formatTable( getModelData( model, { withoutSelection: true } ) ) ).to.equal( formatTable(
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell>' +
+						'<paragraph>foo</paragraph>' +
+						'<paragraph>bar</paragraph>' +
+						'<paragraph>baz</paragraph>' +
+					'</tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		) );
+	} );
+
+	it( 'should wrap in paragraph $text nodes placed directly in tableCell (on inserting table cell)', () => {
+		setModelData( model,
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell><paragraph></paragraph></tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		);
+
+		// Insert new tableCell with $text.
+		model.change( writer => {
+			const tableCell = writer.createElement( 'tableCell' );
+
+			writer.insertText( 'foo', tableCell );
+			writer.insert( tableCell, writer.createPositionAt( root.getNodeByPath( [ 0, 0 ] ), 'end' ) );
+		} );
+
+		expect( formatTable( getModelData( model, { withoutSelection: true } ) ) ).to.equal( formatTable(
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell>' +
+						'<paragraph></paragraph>' +
+					'</tableCell>' +
+					'<tableCell>' +
+						'<paragraph>foo</paragraph>' +
+					'</tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		) );
+	} );
+
+	it( 'should wrap in paragraph $text nodes placed directly in tableCell (on inserting table rows)', () => {
+		setModelData( model,
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell><paragraph></paragraph></tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		);
+
+		// Insert new tableRow with tableCell with $text.
+		model.change( writer => {
+			const tableRow = writer.createElement( 'tableRow' );
+			const tableCell = writer.createElement( 'tableCell' );
+
+			writer.insertText( 'foo', tableCell );
+			writer.insert( tableCell, tableRow );
+			writer.insert( tableRow, writer.createPositionAt( root.getNodeByPath( [ 0 ] ), 'end' ) );
+		} );
+
+		expect( formatTable( getModelData( model, { withoutSelection: true } ) ) ).to.equal( formatTable(
+			'<table>' +
+				'<tableRow>' +
+					'<tableCell>' +
+						'<paragraph></paragraph>' +
+					'</tableCell>' +
+				'</tableRow>' +
+				'<tableRow>' +
+					'<tableCell>' +
+						'<paragraph>foo</paragraph>' +
+					'</tableCell>' +
+				'</tableRow>' +
+			'</table>'
+		) );
+	} );
 } );