diff --git a/packages/ckeditor5-style/src/stylecommand.js b/packages/ckeditor5-style/src/stylecommand.js index 7c59d41e47f..9c4af15b0bb 100644 --- a/packages/ckeditor5-style/src/stylecommand.js +++ b/packages/ckeditor5-style/src/stylecommand.js @@ -161,12 +161,12 @@ export default class StyleCommand extends Command { * @param {module:engine/model/selection~Selection} selection */ _prepareNewInlineElementValue( value, selection ) { - let newValue = []; + let newValue = [ ...value ]; const attributes = selection.getAttributes(); for ( const [ attribute ] of attributes ) { - newValue = [ ...value, ...this._getAttributeValue( attribute ) ]; + newValue = [ ...newValue, ...this._getAttributeValue( attribute ) ]; } return newValue; diff --git a/packages/ckeditor5-style/tests/stylecommand.js b/packages/ckeditor5-style/tests/stylecommand.js index 4e577f3728b..8ac98a5b661 100644 --- a/packages/ckeditor5-style/tests/stylecommand.js +++ b/packages/ckeditor5-style/tests/stylecommand.js @@ -78,6 +78,46 @@ describe( 'StyleCommand', () => { } ); describe( 'value', () => { + it( 'should detect applied inline style', () => { + setData( model, '[foobar]' ); + + model.change( writer => { + writer.setAttribute( 'htmlSpan', { classes: [ 'marker' ] }, root.getChild( 0 ).getChild( 0 ) ); + } ); + + expect( command.value ).to.deep.equal( [ 'Marker' ] ); + expect( getData( model ) ).to.equal( + '[<$text htmlSpan="{"classes":["marker"]}">foobar]' + ); + } ); + + it( 'should detect applied multiple inline styles', () => { + setData( model, '[foobar]' ); + + model.change( writer => { + writer.setAttribute( 'htmlSpan', { classes: [ 'marker', 'typewriter' ] }, root.getChild( 0 ).getChild( 0 ) ); + } ); + + expect( command.value ).to.deep.equal( [ 'Marker', 'Typewriter' ] ); + expect( getData( model ) ).to.equal( + '[<$text htmlSpan="{"classes":["marker","typewriter"]}">foobar]' + ); + } ); + + // https://github.com/ckeditor/ckeditor5/issues/11588 + it( 'should detect applied multiple inline styles x', () => { + setData( model, '[foobar]' ); + + model.change( writer => { + writer.setAttribute( 'htmlSpan', { classes: [ 'marker' ] }, root.getChild( 0 ).getChild( 0 ) ); + writer.setAttribute( 'bold', true, root.getChild( 0 ).getChild( 0 ) ); + } ); + + expect( command.value ).to.deep.equal( [ 'Marker' ] ); + expect( getData( model ) ).to.equal( + '[<$text bold="true" htmlSpan="{"classes":["marker"]}">foobar]' + ); + } ); } ); describe( 'isEnabled', () => {