diff --git a/packages/lexical-selection/src/__tests__/unit/LexicalSelection.test.js b/packages/lexical-selection/src/__tests__/unit/LexicalSelection.test.js index 0473cdf18f4..b926170c368 100644 --- a/packages/lexical-selection/src/__tests__/unit/LexicalSelection.test.js +++ b/packages/lexical-selection/src/__tests__/unit/LexicalSelection.test.js @@ -1732,5 +1732,36 @@ describe('LexicalSelection tests', () => { '
Hello awesome
beautiful world
', ); }); + + it('adjust offset for inline elements text formatting', async () => { + init(); + await editor.update(() => { + const root = $getRoot(); + const text1 = $createTextNode('--'); + const text2 = $createTextNode('abc'); + const text3 = $createTextNode('--'); + root.append( + $createParagraphNode().append( + text1, + $createLinkNode('http://lexical.dev').append(text2), + text3, + ), + ); + + setAnchorPoint({ + key: text1.getKey(), + offset: 2, + type: 'text', + }); + setFocusPoint({ + key: text3.getKey(), + offset: 0, + type: 'text', + }); + const selection = $getSelection(); + selection.formatText('bold'); + expect(text2.hasFormat('bold')).toBe(true); + }); + }); }); }); diff --git a/packages/lexical/src/LexicalSelection.js b/packages/lexical/src/LexicalSelection.js index 110ed2209aa..d5b58ea67e5 100644 --- a/packages/lexical/src/LexicalSelection.js +++ b/packages/lexical/src/LexicalSelection.js @@ -1001,7 +1001,11 @@ export class RangeSelection implements BaseSelection { // This is the case where the user only selected the very end of the // first node so we don't want to include it in the formatting change. if (startOffset === firstNode.getTextContentSize()) { - const nextSibling = firstNode.getNextSibling(); + let nextSibling = firstNode.getNextSibling(); + + if ($isElementNode(nextSibling) && nextSibling.isInline()) { + nextSibling = nextSibling.getFirstChild(); + } if ($isTextNode(nextSibling)) { // we basically make the second node the firstNode, changing offsets accordingly