fix: in the case of multiple selections, the highlighted state does not meet expectations. #948

Author: LucasXu0

frontend/app_flowy/packages/appflowy_editor/lib/src/extensions/text_node_extensions.dart

@@ -162,23 +162,34 @@ extension TextNodesExtension on List<TextNode> {
         final node = this[i];
         final Selection newSelection;
         if (i == 0 && pathEquals(node.path, selection.start.path)) {
-          newSelection = selection.copyWith(
-            end: Position(path: node.path, offset: node.toRawString().length),
-          );
+          if (selection.isBackward) {
+            newSelection = selection.copyWith(
+              end: Position(path: node.path, offset: node.toRawString().length),
+            );
+          } else {
+            newSelection = selection.copyWith(
+              end: Position(path: node.path, offset: 0),
+            );
+          }
         } else if (i == length - 1 &&
             pathEquals(node.path, selection.end.path)) {
-          newSelection = selection.copyWith(
-            start: Position(path: node.path, offset: 0),
-          );
+          if (selection.isBackward) {
+            newSelection = selection.copyWith(
+              start: Position(path: node.path, offset: 0),
+            );
+          } else {
+            newSelection = selection.copyWith(
+              start:
+                  Position(path: node.path, offset: node.toRawString().length),
+            );
+          }
         } else {
           newSelection = Selection(
             start: Position(path: node.path, offset: 0),
             end: Position(path: node.path, offset: node.toRawString().length),
           );
         }
-        if (!node.allSatisfyInSelection(newSelection, styleKey, (value) {
-          return test(value);
-        })) {
+        if (!node.allSatisfyInSelection(newSelection, styleKey, test)) {
           return false;
         }
       }

frontend/app_flowy/packages/appflowy_editor/test/service/toolbar_service_test.dart

@@ -154,6 +154,67 @@ void main() async {
       itemWidget = _itemWidgetForId(tester, 'appflowy.toolbar.bulleted_list');
       expect(itemWidget.isHighlight, true);
     });
+
+    testWidgets('Test toolbar service in multi text selection', (tester) async {
+      const text = 'Welcome to Appflowy 😁';
+
+      /// [h1][bold] Welcome to Appflowy 😁
+      /// [EmptyLine]
+      /// Welcome to Appflowy 😁
+      final editor = tester.editor
+        ..insertTextNode(
+          null,
+          attributes: {
+            StyleKey.subtype: StyleKey.heading,
+            StyleKey.heading: StyleKey.h1,
+          },
+          delta: Delta([
+            TextInsert(text, {
+              StyleKey.bold: true,
+            })
+          ]),
+        )
+        ..insertTextNode(null)
+        ..insertTextNode(text);
+      await editor.startTesting();
+
+      await editor.updateSelection(
+        Selection.single(path: [2], startOffset: text.length, endOffset: 0),
+      );
+      expect(find.byType(ToolbarWidget), findsOneWidget);
+      expect(
+        _itemWidgetForId(tester, 'appflowy.toolbar.h1').isHighlight,
+        false,
+      );
+      expect(
+        _itemWidgetForId(tester, 'appflowy.toolbar.bold').isHighlight,
+        false,
+      );
+
+      await editor.updateSelection(
+        Selection(
+          start: Position(path: [2], offset: text.length),
+          end: Position(path: [1], offset: 0),
+        ),
+      );
+      expect(find.byType(ToolbarWidget), findsOneWidget);
+      expect(
+        _itemWidgetForId(tester, 'appflowy.toolbar.bold').isHighlight,
+        false,
+      );
+
+      await editor.updateSelection(
+        Selection(
+          start: Position(path: [2], offset: text.length),
+          end: Position(path: [0], offset: 0),
+        ),
+      );
+      expect(find.byType(ToolbarWidget), findsOneWidget);
+      expect(
+        _itemWidgetForId(tester, 'appflowy.toolbar.bold').isHighlight,
+        false,
+      );
+    });
   });
 }