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

Add tests for vertical-align attribute in tableCell.

Maciej Gołaszewski 6 лет назад
Родитель
Сommit
34f65f4b32

+ 9 - 5
packages/ckeditor5-table/src/tablestyleediting.js

@@ -35,11 +35,15 @@ export default class TableStyleEditing extends Plugin {
 		schema.extend( 'tableCell', {
 			allowAttributes: [
 				'borderWidth', 'borderColor', 'borderStyle',
-				'backgroundColor', 'padding', 'vertical-align', 'width', 'height' ]
+				'backgroundColor',
+				'padding',
+				'verticalAlignment',
+				'width', 'height'
+			]
 		} );
 
 		// Table attributes.
-		setupTableConversion( conversion, 'background-color' );
+		setupTableConversion( conversion, 'background-color', 'backgroundColor' );
 		setupTableConversion( conversion, 'width' );
 		setupTableConversion( conversion, 'height' );
 
@@ -56,7 +60,7 @@ export default class TableStyleEditing extends Plugin {
 
 		setupConversion( conversion, 'background-color', 'tableCell', 'backgroundColor' );
 		setupConversion( conversion, 'padding', 'tableCell' );
-		setupConversion( conversion, 'vertical-align', 'tableCell' );
+		setupConversion( conversion, 'vertical-align', 'tableCell', 'verticalAlignment' );
 		setupConversion( conversion, 'width', 'tableCell' );
 	}
 }
@@ -157,7 +161,7 @@ function downcastToStyle( conversion, modelAttribute, viewStyleName ) {
 	} );
 }
 
-function setupTableConversion( conversion, styleName ) {
+function setupTableConversion( conversion, styleName, modelAttribute ) {
 	upcastAttribute( conversion, styleName, 'table' );
 
 	// Properly downcast table border attribute on <table> and not on <figure>.
@@ -167,6 +171,6 @@ function setupTableConversion( conversion, styleName ) {
 
 		const table = [ ...mapper.toViewElement( item ).getChildren() ].find( child => child.is( 'table' ) );
 
-		writer.setStyle( styleName, attributeNewValue, table );
+		writer.setStyle( modelAttribute || styleName, attributeNewValue, table );
 	} ) );
 }

+ 13 - 0
packages/ckeditor5-table/tests/converters/tablestyles.js

@@ -167,6 +167,13 @@ describe( 'Table styles conversion', () => {
 
 				assertTRBLAttribute( tableCell, 'padding', '2px', '4em' );
 			} );
+
+			it( 'should upcast vertical-align', () => {
+				editor.setData( '<table><tr><td style="vertical-align:top">foo</td></tr></table>' );
+				const tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] );
+
+				expect( tableCell.getAttribute( 'verticalAlignment' ) ).to.equal( 'top' );
+			} );
 		} );
 
 		describe( 'table row', () => {
@@ -360,6 +367,12 @@ describe( 'Table styles conversion', () => {
 				assertTableCellStyle( 'padding:2px 3px 4px 5px;' );
 			} );
 
+			it( 'should downcast verticalAlignment', () => {
+				model.change( writer => writer.setAttribute( 'verticalAlignment', 'middle', tableCell ) );
+
+				assertTableCellStyle( 'vertical-align:middle;' );
+			} );
+
 			describe( 'change attribute', () => {
 				beforeEach( () => {
 					model.change( writer => {