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( '
' );
+ 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( '' );
+ 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( '' );
+ 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( '' );
+ 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;' );
+ } );
+ } );
} );
} );