fix(editor): can not move carte at the end of inline element (#11558)

Close [BS-2922](https://linear.app/affine-design/issue/BS-2922/【移动端-ios】文档添加linked-page后，无法删除)

tests/blocksuite/e2e/inline/inline-editor.spec.ts

@@ -2,6 +2,13 @@ import type { InlineEditor, InlineRange } from '@blocksuite/affine/std/inline';
 import type { DeltaInsert } from '@blocksuite/affine/store';
 import { expect, type Page, test } from '@playwright/test';
 
+import { pressArrowLeft, pressEnter } from '../utils/actions/keyboard.js';
+import {
+  enterPlaygroundRoom,
+  focusRichText,
+  initEmptyParagraphState,
+} from '../utils/actions/misc.js';
+import { assertRichTextInlineDeltas } from '../utils/asserts.js';
 import { ZERO_WIDTH_SPACE } from '../utils/inline-editor.js';
 // FIXME(mirone): copy paste from framework/inline/__tests__/utils.ts
 const defaultPlaygroundURL = new URL(
@@ -1124,3 +1131,41 @@ test('triple click to select line', async ({ page }) => {
   await press(page, 'Backspace');
   expect(await editorA.innerText()).toBe('abc\n' + ZERO_WIDTH_SPACE + '\nabc');
 });
+
+test('caret should move correctly when inline elements are exist', async ({
+  page,
+}) => {
+  await enterPlaygroundRoom(page);
+  await initEmptyParagraphState(page);
+  await focusRichText(page, 0);
+
+  // hello 'link doc' world
+  await type(page, 'hello ');
+  await press(page, '@');
+  await type(page, 'link doc');
+  await pressEnter(page);
+  await type(page, ' world');
+
+  await pressArrowLeft(page, ' world'.length);
+  await pressArrowLeft(page); // on 'linked doc'
+  await pressArrowLeft(page); // on the left side of 'linked doc'
+  await type(page, 'test');
+
+  await assertRichTextInlineDeltas(page, [
+    {
+      insert: 'hello test',
+    },
+    {
+      attributes: {
+        reference: {
+          pageId: '3',
+          type: 'LinkedPage',
+        },
+      },
+      insert: ' ',
+    },
+    {
+      insert: ' world',
+    },
+  ]);
+});

tests/blocksuite/e2e/utils/actions/misc.ts

@@ -14,6 +14,7 @@ import { expect } from '@playwright/test';
 import stringify from 'json-stable-stringify';
 import lz from 'lz-string';
 
+import { ZERO_WIDTH_SPACE } from '../inline-editor.js';
 import { currentEditorIndex } from '../multiple-editor.js';
 import {
   pressArrowRight,
@@ -1053,7 +1054,7 @@ export async function getIndexCoordinate(
 }
 
 export function inlineEditorInnerTextToString(innerText: string): string {
-  return innerText.replace('\u200B', '').trim();
+  return innerText.replace(ZERO_WIDTH_SPACE, '').trim();
 }
 
 export async function focusTitle(page: Page) {

tests/blocksuite/e2e/utils/inline-editor.ts

@@ -22,8 +22,4 @@ export async function getStringFromRichText(
 }
 
 // Why? we can't import from `@blocksuite/affine/std/inline` because playwright will throw an error
-export const ZERO_WIDTH_SPACE = /Apple Computer/.test(
-  globalThis.navigator?.vendor
-)
-  ? '\u200C'
-  : '\u200B';
+export const ZERO_WIDTH_SPACE = '\u200C';