Steps to replicate the issue (include links if applicable):

• Add the literal following text: // Some text in front of the emoji, the emoji: 🖊️, some text after the emoji to a new line on an userscript page
  • for example to https://test.wikipedia.org/wiki/Special:MyPage/common.js
• place the cursor at the end of that line

What happens?:

• In the part of the line that follows the emoji, the position of the visible blinking cursor is one character off from the position where actual keystrokes (adding new characters, deleting with backspace or Del) happens

What should have happened instead?:

• the visible cursor (the black line) should be at the place where new characters are actually added/deleted from

Other information (browser name/version, screenshots, etc.):

• pasting multiple emojis increases the effect
• Can reproduce this both with Firefox 117 and Chromium 115
• this is probably due to the 🖊️ emoji being made out of two unicode symbols: U+1F58A and U+FE0F:
  • https://emojipedia.org/pen/
  • https://emojipedia.org/emoji/%EF%B8%8F/
  • https://emojipedia.org/variation-selector-16/
    • > An invisible codepoint which specifies that the preceding character should be displayed with emoji presentation. Only required if the preceding character defaults to text presentation.