diff --git a/packages/rich-text/src/apply-format.js b/packages/rich-text/src/apply-format.js index c2b96af10d6002..892eb39c2dedca 100644 --- a/packages/rich-text/src/apply-format.js +++ b/packages/rich-text/src/apply-format.js @@ -59,13 +59,6 @@ export function applyFormat( replace( newFormats[ endIndex ], index, format ); endIndex++; } - // Otherwise, insert a placeholder with the format so new input appears - // with the format applied. - } else { - return { - ...value, - activeFormats: [ ...activeFormats, format ], - }; } } else { // Determine the highest position the new format can be inserted at. @@ -92,5 +85,12 @@ export function applyFormat( } } - return normaliseFormats( { ...value, formats: newFormats } ); + return normaliseFormats( { + ...value, + formats: newFormats, + // Always revise active formats. This serves as a placeholder for new + // inputs with the format so new input appears with the format applied, + // and ensures a format of the same type uses the latest values. + activeFormats: [ format, ...activeFormats ], + } ); } diff --git a/packages/rich-text/src/test/apply-format.js b/packages/rich-text/src/test/apply-format.js index 67d2c3ff082971..f203b032553e53 100644 --- a/packages/rich-text/src/test/apply-format.js +++ b/packages/rich-text/src/test/apply-format.js @@ -23,6 +23,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ em ], formats: [ [ em ], [ em ], [ em ], [ em ] ], }; const result = applyFormat( deepFreeze( record ), em, 0, 4 ); @@ -39,6 +40,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ em ], formats: [ [ strong, em ], [ strong, em ], [ strong, em ], [ strong, em ] ], }; const result = applyFormat( deepFreeze( record ), em, 0, 4 ); @@ -55,6 +57,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ em ], formats: [ [ strong, em ], [ strong, em ], [ strong, em ], [ strong, em ] ], }; const result = applyFormat( deepFreeze( record ), em, 0, 4 ); @@ -71,6 +74,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ strong ], formats: [ [ strong ], [ strong, em ], [ strong, em ], [ strong ] ], }; const result = applyFormat( deepFreeze( record ), strong, 0, 4 ); @@ -87,6 +91,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ strong ], formats: [ [ strong ], [ strong, em ], [ strong, em ], , ], }; const result = applyFormat( deepFreeze( record ), strong, 0, 3 ); @@ -103,6 +108,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ strong ], formats: [ , [ strong, em ], [ strong, em ], [ strong ] ], }; const result = applyFormat( deepFreeze( record ), strong, 1, 4 ); @@ -119,6 +125,7 @@ describe( 'applyFormat', () => { }; const expected = { ...record, + activeFormats: [ strong ], formats: [ , [ strong, em ], [ strong ], [ strong, em ] ], }; const result = applyFormat( deepFreeze( record ), strong, 1, 4 ); @@ -134,6 +141,7 @@ describe( 'applyFormat', () => { text: 'one two three', }; const expected = { + activeFormats: [ strong ], formats: [ , , , [ strong ], [ strong, em ], [ strong, em ], [ em ], , , , , , , ], text: 'one two three', }; @@ -152,6 +160,7 @@ describe( 'applyFormat', () => { end: 6, }; const expected = { + activeFormats: [ strong ], formats: [ , , , [ strong ], [ strong, em ], [ strong, em ], [ em ], , , , , , , ], text: 'one two three', start: 3, @@ -190,6 +199,7 @@ describe( 'applyFormat', () => { end: 4, }; const expected = { + activeFormats: [ a2 ], formats: [ , , , , [ a2 ], [ a2 ], [ a2 ], , , , , , , ], text: 'one two three', start: 4,