diff --git a/src/tablecellproperties/tablecellpropertiesediting.js b/src/tablecellproperties/tablecellpropertiesediting.js index 6f0344b3..3e1d6ac9 100644 --- a/src/tablecellproperties/tablecellpropertiesediting.js +++ b/src/tablecellproperties/tablecellpropertiesediting.js @@ -69,6 +69,7 @@ export default class TableCellPropertiesEditing extends Plugin { const editor = this.editor; const schema = editor.model.schema; const conversion = editor.conversion; + const locale = editor.locale; editor.data.addStyleProcessorRules( addBorderRules ); enableBorderProperties( schema, conversion ); @@ -76,7 +77,7 @@ export default class TableCellPropertiesEditing extends Plugin { editor.commands.add( 'tableCellBorderColor', new TableCellBorderColorCommand( editor ) ); editor.commands.add( 'tableCellBorderWidth', new TableCellBorderWidthCommand( editor ) ); - enableHorizontalAlignmentProperty( schema, conversion ); + enableHorizontalAlignmentProperty( schema, conversion, locale ); editor.commands.add( 'tableCellHorizontalAlignment', new TableCellHorizontalAlignmentCommand( editor ) ); enableProperty( schema, conversion, 'width', 'width' ); @@ -117,37 +118,29 @@ function enableBorderProperties( schema, conversion ) { // // @param {module:engine/model/schema~Schema} schema // @param {module:engine/conversion/conversion~Conversion} conversion -function enableHorizontalAlignmentProperty( schema, conversion ) { +// @param {module:utils/locale~Locale} locale The {@link module:core/editor/editor~Editor#locale} instance. +function enableHorizontalAlignmentProperty( schema, conversion, locale ) { schema.extend( 'tableCell', { allowAttributes: [ 'horizontalAlignment' ] } ); + const options = [ locale.contentLanguageDirection == 'rtl' ? 'left' : 'right', 'center', 'justify' ]; + conversion.attributeToAttribute( { model: { name: 'tableCell', key: 'horizontalAlignment', - values: [ 'right', 'center', 'justify' ] + values: options }, - view: { - right: { - key: 'style', - value: { - 'text-align': 'right' - } - }, - center: { + view: options.reduce( ( result, option ) => ( { + ...result, + [ option ]: { key: 'style', value: { - 'text-align': 'center' - } - }, - justify: { - key: 'style', - value: { - 'text-align': 'justify' + 'text-align': option } } - } + } ), {} ) } ); } diff --git a/tests/tablecellproperties/tablecellpropertiesediting.js b/tests/tablecellproperties/tablecellpropertiesediting.js index 3c33f108..93fab54c 100644 --- a/tests/tablecellproperties/tablecellpropertiesediting.js +++ b/tests/tablecellproperties/tablecellpropertiesediting.js @@ -59,7 +59,7 @@ describe( 'table cell properties', () => { expect( editor.commands.get( 'tableCellHorizontalAlignment' ) ).to.be.instanceOf( TableCellHorizontalAlignmentCommand ); } ); - it( 'adds tableCellAlignment command', () => { + it( 'adds tableCellVerticalAlignment command', () => { expect( editor.commands.get( 'tableCellVerticalAlignment' ) ).to.be.instanceOf( TableCellVerticalAlignmentCommand ); } ); @@ -712,6 +712,51 @@ describe( 'table cell properties', () => { expect( tableCell.getAttribute( 'horizontalAlignment' ) ).to.equal( 'justify' ); } ); + + describe( 'for RTL content language', () => { + let editor, model; + + beforeEach( async () => { + editor = await VirtualTestEditor.create( { + plugins: [ TableCellPropertiesEditing, Paragraph, TableEditing ], + language: 'ar' + } ); + + model = editor.model; + } ); + + afterEach( async () => { + await editor.destroy(); + } ); + + it( 'should not upcast text-align:right style', () => { + editor.setData( '
foo
' ); + const tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] ); + + expect( tableCell.getAttribute( 'horizontalAlignment' ) ).to.be.undefined; + } ); + + it( 'should upcast text-align:left style', () => { + editor.setData( '
foo
' ); + const tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] ); + + expect( tableCell.getAttribute( 'horizontalAlignment' ) ).to.equal( 'left' ); + } ); + + it( 'should upcast text-align:center style', () => { + editor.setData( '
foo
' ); + const tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] ); + + expect( tableCell.getAttribute( 'horizontalAlignment' ) ).to.equal( 'center' ); + } ); + + it( 'should upcast text-align:justify style', () => { + editor.setData( '
foo
' ); + const tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] ); + + expect( tableCell.getAttribute( 'horizontalAlignment' ) ).to.equal( 'justify' ); + } ); + } ); } ); describe( 'downcast conversion', () => { @@ -774,6 +819,80 @@ describe( 'table cell properties', () => { assertTableCellStyle( editor, 'text-align:justify;' ); } ); + + describe( 'for RTL content language', () => { + let editor, model; + + beforeEach( async () => { + editor = await VirtualTestEditor.create( { + plugins: [ TableCellPropertiesEditing, Paragraph, TableEditing ], + language: 'ar' + } ); + + model = editor.model; + + setModelData( + model, + '' + + '' + + '' + + 'foo' + + '' + + '' + + '
' + ); + + tableCell = model.document.getRoot().getNodeByPath( [ 0, 0, 0 ] ); + } ); + + afterEach( async () => { + await editor.destroy(); + } ); + + it( 'should consume converted item\'s horizontalAlignment attribute', () => { + editor.conversion.for( 'downcast' ) + .add( dispatcher => dispatcher.on( 'attribute:horizontalAlignment:tableCell', ( evt, data, conversionApi ) => { + expect( conversionApi.consumable.consume( data.item, evt.name ) ).to.be.false; + } ) ); + + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'center', tableCell ) ); + } ); + + it( 'should be overridable', () => { + editor.conversion.for( 'downcast' ) + .add( dispatcher => dispatcher.on( 'attribute:horizontalAlignment:tableCell', ( evt, data, conversionApi ) => { + conversionApi.consumable.consume( data.item, evt.name ); + }, { priority: 'high' } ) ); + + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'center', tableCell ) ); + + assertTableCellStyle( editor, '' ); + } ); + + it( 'should not downcast horizontalAlignment=right', () => { + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'right', tableCell ) ); + + assertTableCellStyle( editor ); + } ); + + it( 'should downcast horizontalAlignment=left', () => { + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'left', tableCell ) ); + + assertTableCellStyle( editor, 'text-align:left;' ); + } ); + + it( 'should downcast horizontalAlignment=center', () => { + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'center', tableCell ) ); + + assertTableCellStyle( editor, 'text-align:center;' ); + } ); + + it( 'should downcast horizontalAlignment=justify', () => { + model.change( writer => writer.setAttribute( 'horizontalAlignment', 'justify', tableCell ) ); + + assertTableCellStyle( editor, 'text-align:justify;' ); + } ); + } ); } ); } );