fix: word selection issue (#1219)

* feat: select whole words when double-click then drag on desktop

Double-clicking a word and holding to drag now extends the selection by
whole words in either direction, keeping the initial word fully selected,
instead of starting a character-level drag from the pointer.

* fix: skip underscore italic for intra-word underscores

Auto-italic on typing a closing underscore now only triggers when the
opening underscore starts a word (at the line start or preceded by
whitespace), so `a_b_c` is no longer italicized. Asterisk formatting is
unaffected.

Author: LucasXu0

lib/src/editor/editor_component/service/selection/desktop_selection_service.dart

@@ -2,6 +2,7 @@ import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:appflowy_editor/src/editor/editor_component/service/selection/mobile_selection_service.dart';
 import 'package:appflowy_editor/src/editor/editor_component/service/selection/shared.dart';
 import 'package:appflowy_editor/src/service/selection/selection_gesture.dart';
+import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:provider/provider.dart';
@@ -51,6 +52,17 @@ class _DesktopSelectionServiceWidgetState
 
   Position? _panStartPosition;
 
+  /// The word selected by a double-tap. When non-null, the pan that immediately
+  /// follows the double-tap extends the selection by whole words instead of by
+  /// characters, keeping this word fully selected. Cleared on a plain tap,
+  /// triple-tap, or when the pan ends.
+  Selection? _wordSelectionAnchor;
+
+  /// The global offset of the double-tap that produced [_wordSelectionAnchor].
+  /// A following pan only enters word mode when it starts at (essentially) the
+  /// same point, so a stale anchor cannot hijack an unrelated later drag.
+  Offset? _wordSelectionAnchorOffset;
+
   bool _isDraggingSelection = false;
   Offset? _lastPanOffset;
 
@@ -162,6 +174,8 @@ class _DesktopSelectionServiceWidgetState
     _panStartScrollDy = null;
     _panStartPosition = null;
     _lastPanOffset = null;
+    _wordSelectionAnchor = null;
+    _wordSelectionAnchorOffset = null;
   }
 
   void _clearContextMenu() {
@@ -251,6 +265,10 @@ class _DesktopSelectionServiceWidgetState
   void _onTapDown(TapDownDetails details) {
     _clearContextMenu();
 
+    // A plain tap starts a fresh gesture; drop any pending word-drag anchor.
+    _wordSelectionAnchor = null;
+    _wordSelectionAnchorOffset = null;
+
     final canTap = _interceptors.every(
       (element) => element.canTap?.call(details) ?? true,
     );
@@ -297,9 +315,15 @@ class _DesktopSelectionServiceWidgetState
     final node = getNodeInOffset(offset);
     final selection = node?.selectable?.getWordBoundaryInOffset(offset);
     if (selection == null) {
+      _wordSelectionAnchor = null;
+      _wordSelectionAnchorOffset = null;
       clearSelection();
       return;
     }
+    // Arm word-drag mode: the pan that continues from this double-tap will
+    // extend the selection by whole words, keeping this word fully selected.
+    _wordSelectionAnchor = selection.normalized;
+    _wordSelectionAnchorOffset = offset;
     updateSelection(selection);
   }
 
@@ -311,6 +335,9 @@ class _DesktopSelectionServiceWidgetState
     if (!canTripleTap) {
       return updateSelection(null);
     }
+    // Triple-tap is not word-drag mode.
+    _wordSelectionAnchor = null;
+    _wordSelectionAnchorOffset = null;
     final offset = details.globalPosition;
     final node = getNodeInOffset(offset);
     final selectable = node?.selectable;
@@ -372,7 +399,19 @@ class _DesktopSelectionServiceWidgetState
   }
 
   void _onPanStart(DragStartDetails details) {
-    clearSelection();
+    // In word-drag mode (a pan that continues from a double-tap) keep the
+    // double-tapped word selected; the drag extends it by whole words. The pan
+    // shares the double-tap's pointer-down, so it must start at essentially the
+    // same point — otherwise a stale anchor is dropped and this is a plain drag.
+    final anchorOffset = _wordSelectionAnchorOffset;
+    final isWordSelectionDrag = _wordSelectionAnchor != null &&
+        anchorOffset != null &&
+        (details.globalPosition - anchorOffset).distance <= kDoubleTapSlop;
+    if (!isWordSelectionDrag) {
+      _wordSelectionAnchor = null;
+      _wordSelectionAnchorOffset = null;
+      clearSelection();
+    }
 
     final canPanStart = _interceptors.every(
       (interceptor) => interceptor.canPanStart?.call(details) ?? true,
@@ -440,6 +479,26 @@ class _DesktopSelectionServiceWidgetState
       return;
     }
 
+    final selectable = getNodeInOffset(panEndOffset)?.selectable;
+    if (selectable == null) {
+      return;
+    }
+
+    final Selection? selection = _wordSelectionAnchor != null
+        ? _wordSelectionDuringDrag(selectable, panEndOffset)
+        : _characterSelectionDuringDrag(selectable, panEndOffset);
+
+    if (selection != null && selection != currentSelection.value) {
+      updateSelection(selection);
+    }
+  }
+
+  /// Character-level drag selection: the anchor is the exact character position
+  /// where the pan started and the extent tracks the cursor character.
+  Selection? _characterSelectionDuringDrag(
+    SelectableMixin selectable,
+    Offset panEndOffset,
+  ) {
     final double? currentDy = editorState.service.scrollService?.dy;
     final Offset panStartOffset = currentDy == null || _panStartScrollDy == null
         ? _panStartOffset!
@@ -448,12 +507,7 @@ class _DesktopSelectionServiceWidgetState
             _panStartScrollDy! - currentDy,
           );
 
-    final selectable = getNodeInOffset(panEndOffset)?.selectable;
-    if (selectable == null) {
-      return;
-    }
-
-    final Selection selection = Selection(
+    return Selection(
       start: _panStartPosition!,
       end: selectable
           .getSelectionInRange(
@@ -462,10 +516,42 @@ class _DesktopSelectionServiceWidgetState
           )
           .end,
     );
+  }
 
-    if (selection != currentSelection.value) {
-      updateSelection(selection);
+  /// Word-level drag selection (double-tap then drag): the double-tapped word
+  /// stays fully selected while the selection extends to the whole word under
+  /// the cursor, in either direction.
+  Selection? _wordSelectionDuringDrag(
+    SelectableMixin selectable,
+    Offset panEndOffset,
+  ) {
+    final anchor = _wordSelectionAnchor;
+    if (anchor == null) {
+      return null;
+    }
+
+    final focus = selectable.getWordBoundaryInOffset(panEndOffset)?.normalized;
+    if (focus == null) {
+      return null;
+    }
+
+    // If the focus word starts before the anchor word, the drag goes backward:
+    // keep the anchor word's end as the base and extend to the focus word's
+    // start. Otherwise the drag goes forward (or stays on the same word).
+    if (_comparePosition(focus.start, anchor.start) < 0) {
+      return Selection(start: anchor.end, end: focus.start);
+    }
+    return Selection(start: anchor.start, end: focus.end);
+  }
+
+  /// Compares two positions in document order.
+  /// Returns a negative value if [a] is before [b], zero if equal, and a
+  /// positive value if [a] is after [b].
+  int _comparePosition(Position a, Position b) {
+    if (a.path.equals(b.path)) {
+      return a.offset.compareTo(b.offset);
     }
+    return a.path < b.path ? -1 : 1;
   }
 
   void _handleAutoScrollWhileDragging() {

lib/src/editor/editor_component/service/shortcuts/character/format_single_character/format_single_character.dart

@@ -116,6 +116,18 @@ class CheckSingleFormatFormatResult {
     return (false, null);
   }
 
+  // 6. For underscore italic, only auto-format when the opening underscore
+  // starts a word, i.e. it is at the very start or preceded by whitespace.
+  // This prevents intra-word underscores like `a_b_c` from being italicized,
+  // matching the common markdown behavior (asterisks are unaffected).
+  if (character == '_') {
+    final openingIndex = startIndex + lastCharIndex;
+    if (openingIndex > 0 &&
+        rawPlainText[openingIndex - 1].trim().isNotEmpty) {
+      return (false, null);
+    }
+  }
+
   return (
     true,
     CheckSingleFormatFormatResult(

test/new/service/shortcuts/character_shortcut_events/format_by_wrapping_with_single_char/format_italic_test.dart

@@ -35,9 +35,9 @@ void main() async {
 
       // Before
       // App_Flowy|
-      // After
-      // App[italic]Flowy
-      test('App_Flowy_ to App[italic]Flowy', () async {
+      // After (unchanged): the opening underscore is not preceded by
+      // whitespace, so an intra-word underscore like `a_b_` is not italicized.
+      test('App_Flowy_ does not italicize (intra-word underscore)', () async {
         const text1 = 'App';
         const text2 = 'Flowy';
         final document = Document.blank().addParagraphs(
@@ -54,11 +54,43 @@ void main() async {
 
         final result = await formatUnderscoreToItalic.execute(editorState);
 
+        expect(result, false);
+        final after = editorState.getNodeAtPath([0])!;
+        expect(after.delta!.toPlainText(), '${text1}_$text2');
+        final isItalic = after.delta!
+            .everyAttributes((element) => element['italic'] == true);
+        expect(isItalic, false);
+      });
+
+      // Before
+      // hi _AppFlowy|
+      // After
+      // hi [italic]AppFlowy
+      // The opening underscore is preceded by whitespace, so it still formats.
+      test('hi _AppFlowy_ italicizes AppFlowy (underscore after space)',
+          () async {
+        const prefix = 'hi ';
+        const text = 'AppFlowy';
+        final document = Document.blank().addParagraphs(
+          1,
+          builder: (index) => Delta()..insert('${prefix}_$text'),
+        );
+
+        final editorState = EditorState(document: document);
+
+        final selection = Selection.collapsed(
+          Position(path: [0], offset: prefix.length + text.length + 1),
+        );
+        editorState.selection = selection;
+
+        final result = await formatUnderscoreToItalic.execute(editorState);
+
         expect(result, true);
         final after = editorState.getNodeAtPath([0])!;
-        expect(after.delta!.toPlainText(), '$text1$text2');
-        expect(after.delta!.toList()[0].attributes, null);
-        expect(after.delta!.toList()[1].attributes, {'italic': true});
+        expect(after.delta!.toPlainText(), '$prefix$text');
+        final deltaList = after.delta!.toList();
+        expect(deltaList[0].attributes, null);
+        expect(deltaList[1].attributes, {'italic': true});
       });
 
       // Before

test/service/selection_service_test.dart

@@ -59,6 +59,98 @@ void main() async {
       await editor.dispose();
     });
 
+    testWidgets('Test double tap then drag forward selects whole words',
+        (tester) async {
+      const text = 'Welcome to Appflowy 😁';
+      final editor = tester.editor..addParagraphs(3, initialText: text);
+      await editor.startTesting();
+
+      final secondNode = editor.nodeAtPath([1]);
+      final finder = find.byKey(secondNode!.key);
+      final rect = tester.getRect(finder);
+
+      // Press inside the first word "Welcome" (not at its start).
+      final startPos = rect.centerLeft + const Offset(10.0, 0.0);
+
+      // First tap of the double-tap.
+      await tester.tapAt(startPos);
+      // Second tap: press down, hold briefly (so the double-tap is recognized),
+      // then drag to the end of the line.
+      final gesture = await tester.startGesture(
+        startPos,
+        kind: PointerDeviceKind.mouse,
+      );
+      await tester.pump(const Duration(milliseconds: 150));
+      // A small move starts the drag, then extend to the end of the line.
+      await gesture.moveTo(startPos + const Offset(30.0, 0.0));
+      await tester.pump();
+      await gesture.moveTo(rect.centerRight);
+      await tester.pump();
+      await gesture.up();
+      await tester.pump();
+
+      // The whole first word stays selected (start at offset 0, not mid-word)
+      // and the selection extends by whole words to the end of the line.
+      expect(
+        editor.selection?.normalized,
+        Selection.single(path: [1], startOffset: 0, endOffset: text.length),
+      );
+
+      await editor.dispose();
+    });
+
+    testWidgets('Test double tap then drag backward keeps the anchor word',
+        (tester) async {
+      const text = 'Welcome to Appflowy 😁';
+      final editor = tester.editor..addParagraphs(3, initialText: text);
+      await editor.startTesting();
+
+      final secondNode = editor.nodeAtPath([1]);
+      final finder = find.byKey(secondNode!.key);
+      final rect = tester.getRect(finder);
+
+      // Probe which word lives further along the line so the assertion does not
+      // depend on exact glyph widths.
+      final probePos = rect.centerLeft + const Offset(120.0, 0.0);
+      await tester.tapAt(probePos);
+      await tester.tapAt(probePos);
+      await tester.pump();
+      final probeWord = editor.selection!.normalized;
+      expect(probeWord.start.offset, greaterThan(0));
+
+      // Reset with a plain tap (also clears any pending word-drag anchor).
+      await tester.tapAt(rect.centerLeft);
+      await tester.pump();
+
+      // Double-tap that later word, then hold and drag back to the start.
+      await tester.tapAt(probePos);
+      final gesture = await tester.startGesture(
+        probePos,
+        kind: PointerDeviceKind.mouse,
+      );
+      await tester.pump(const Duration(milliseconds: 150));
+      // A small move starts the drag, then extend back to the start of the line.
+      await gesture.moveTo(probePos - const Offset(30.0, 0.0));
+      await tester.pump();
+      await gesture.moveTo(rect.centerLeft);
+      await tester.pump();
+      await gesture.up();
+      await tester.pump();
+
+      // The double-tapped word's end stays selected and the selection extends
+      // by whole words back to the start of the line.
+      expect(
+        editor.selection?.normalized,
+        Selection.single(
+          path: [1],
+          startOffset: 0,
+          endOffset: probeWord.end.offset,
+        ),
+      );
+
+      await editor.dispose();
+    });
+
     testWidgets('Test triple tap', (tester) async {
       const text = 'Welcome to Appflowy 😁';
       final editor = tester.editor..addParagraphs(3, initialText: text);