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$text>]'
+ );
+ } );
+
+ 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$text>]'
+ );
+ } );
+
+ // 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$text>]'
+ );
+ } );
} );
describe( 'isEnabled', () => {