[canvaskit] Correctly get the directionality of the text boxes (flutter#34264)

Author: Harry Terkelsen

lib/web_ui/lib/src/engine/canvaskit/text.dart

@@ -7,6 +7,7 @@ import 'dart:typed_data';
 import 'package:meta/meta.dart';
 import 'package:ui/ui.dart' as ui;
 
+import '../safe_browser_api.dart';
 import '../util.dart';
 import 'canvaskit_api.dart';
 import 'font_fallbacks.dart';
@@ -44,7 +45,6 @@ class CkParagraphStyle implements ui.ParagraphStyle {
           ellipsis,
           locale,
         ),
-        _textDirection = textDirection ?? ui.TextDirection.ltr,
         _fontFamily = ui.debugEmulateFlutterTesterEnvironment ? 'Ahem' : fontFamily,
         _fontSize = fontSize,
         _height = height,
@@ -53,7 +53,6 @@ class CkParagraphStyle implements ui.ParagraphStyle {
         _fontStyle = fontStyle;
 
   final SkParagraphStyle skParagraphStyle;
-  final ui.TextDirection? _textDirection;
   final String? _fontFamily;
   final double? _fontSize;
   final double? _height;
@@ -729,12 +728,14 @@ class CkParagraph extends SkiaObject<SkParagraph> implements ui.Paragraph {
 
     for (int i = 0; i < skRects.length; i++) {
       final Float32List rect = skRects[i];
+      final int skTextDirection =
+          getJsProperty(getJsProperty(rect, 'direction'), 'value');
       result.add(ui.TextBox.fromLTRBD(
         rect[0],
         rect[1],
         rect[2],
         rect[3],
-        _paragraphStyle._textDirection!,
+        ui.TextDirection.values[skTextDirection],
       ));
     }
 

lib/web_ui/test/canvaskit/text_test.dart

@@ -54,6 +54,22 @@ void testMain() {
         expect(paragraph, isNotNull);
       }
     });
+
+    // Regression test for https://github.com/flutter/flutter/issues/78550
+    test('getBoxesForRange works for LTR text in an RTL paragraph', () {
+      // Create builder for an RTL paragraph.
+      final ui.ParagraphBuilder builder = ui.ParagraphBuilder(
+          ui.ParagraphStyle(fontSize: 16, textDirection: ui.TextDirection.rtl));
+      builder.addText('hello');
+      final ui.Paragraph paragraph = builder.build();
+      paragraph.layout(const ui.ParagraphConstraints(width: 100));
+      expect(paragraph, isNotNull);
+      final List<ui.TextBox> boxes = paragraph.getBoxesForRange(0, 1);
+      expect(boxes, hasLength(1));
+      // The direction for this span is LTR even though the paragraph is RTL
+      // because the directionality of the 'h' is LTR.
+      expect(boxes.single.direction, equals(ui.TextDirection.ltr));
+    });
     // TODO(hterkelsen): https://github.com/flutter/flutter/issues/60040
   }, skip: isIosSafari);
 }