Edit Link modal fix (#5551)

facebook · Jan 30, 2024 · 3177f77 · 3177f77
1 parent 0cb7f1e
commit 3177f77
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 8 deletions.
diff --git a/packages/lexical-playground/__tests__/e2e/Links.spec.mjs b/packages/lexical-playground/__tests__/e2e/Links.spec.mjs
@@ -1771,8 +1771,8 @@ test.describe('Links', () => {
       await assertSelection(page, {
         anchorOffset: 5,
         anchorPath: [0, 1, 0, 0],
-        focusOffset: 6,
-        focusPath: [0, 0, 0],
+        focusOffset: 0,
+        focusPath: [0, 1],
       });
     } else {
       await assertSelection(page, {
@@ -1815,7 +1815,7 @@ test.describe('Links', () => {
         anchorOffset: 5,
         anchorPath: [0, 1, 0, 0],
         focusOffset: 0,
-        focusPath: [0, 1],
+        focusPath: [0, 1, 0, 0],
       });
     } else {
       await assertSelection(page, {
@@ -1913,7 +1913,6 @@ test.describe('Links', () => {
     await selectAll(page);
 
     await click(page, '.link');
-    await click(page, '.link-confirm');
 
     await assertHTML(
       page,

diff --git a/packages/lexical-playground/src/plugins/FloatingLinkEditorPlugin/index.tsx b/packages/lexical-playground/src/plugins/FloatingLinkEditorPlugin/index.tsx
@@ -17,6 +17,7 @@ import {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext';
 import {$findMatchingParent, mergeRegister} from '@lexical/utils';
 import {
   $getSelection,
+  $isLineBreakNode,
   $isRangeSelection,
   BaseSelection,
   CLICK_COMMAND,
@@ -294,10 +295,30 @@ function useFloatingLinkEditorToolbar(
     function updateToolbar() {
       const selection = $getSelection();
       if ($isRangeSelection(selection)) {
-        const node = getSelectedNode(selection);
-        const linkParent = $findMatchingParent(node, $isLinkNode);
-        const autoLinkParent = $findMatchingParent(node, $isAutoLinkNode);
-        if (linkParent !== null || autoLinkParent !== null) {
+        const focusNode = getSelectedNode(selection);
+        const focusLinkNode = $findMatchingParent(focusNode, $isLinkNode);
+        const focusAutoLinkNode = $findMatchingParent(
+          focusNode,
+          $isAutoLinkNode,
+        );
+        if (!(focusLinkNode || focusAutoLinkNode)) {
+          setIsLink(false);
+          return;
+        }
+        const badNode = selection.getNodes().find((node) => {
+          const linkNode = $findMatchingParent(node, $isLinkNode);
+          const autoLinkNode = $findMatchingParent(node, $isAutoLinkNode);
+          if (
+            !linkNode?.is(focusLinkNode) &&
+            !autoLinkNode?.is(focusAutoLinkNode) &&
+            !linkNode &&
+            !autoLinkNode &&
+            !$isLineBreakNode(node)
+          ) {
+            return node;
+          }
+        });
+        if (!badNode) {
           setIsLink(true);
         } else {
           setIsLink(false);