fix: allow wide tables to scroll in RenderMode.listView (#1595)

Author: theSharpestTool

packages/core/lib/src/internal/ops/tag_table.dart

@@ -92,6 +92,7 @@ class TagTable {
             borderCollapse: borderCollapse == kCssBorderCollapseCollapse,
             borderSpacing: borderSpacing?.getValue(resolved) ?? 0.0,
             textDirection: resolved.directionOrLtr,
+            useSizingHint: tableTree.sizingInput != null,
             children: List.from(
               data.builders
                   .map((builder) => builder(context))

packages/core/lib/src/widgets/html_table.dart

@@ -26,19 +26,27 @@ class HtmlTable extends MultiChildRenderObjectWidget {
   /// Default: [TextDirection.ltr].
   final TextDirection textDirection;
 
+  /// Whether to use [CssSizingHint] for table layout.
+  ///
+  /// Default: `false`.
+  final bool useSizingHint;
+
   /// Creates a TABLE widget.
   const HtmlTable({
     this.border,
     this.borderCollapse = false,
     this.borderSpacing = 0.0,
     required super.children,
     this.textDirection = TextDirection.ltr,
+    this.useSizingHint = false,
     super.key,
   });
 
   @override
   RenderObject createRenderObject(BuildContext context) {
-    final hint = context.dependOnInheritedWidgetOfExactType<CssSizingHint>();
+    final hint = useSizingHint
+        ? context.dependOnInheritedWidgetOfExactType<CssSizingHint>()
+        : null;
     return _TableRenderObject(
       border,
       textDirection,
@@ -74,7 +82,9 @@ class HtmlTable extends MultiChildRenderObjectWidget {
 
   @override
   void updateRenderObject(BuildContext context, RenderObject renderObject) {
-    final hint = context.dependOnInheritedWidgetOfExactType<CssSizingHint>();
+    final hint = useSizingHint
+        ? context.dependOnInheritedWidgetOfExactType<CssSizingHint>()
+        : null;
     (renderObject as _TableRenderObject)
       ..setBorder(border)
       ..setBorderCollapse(borderCollapse)

packages/core/test/tag_table_test.dart

@@ -65,6 +65,43 @@ Future<void> main() async {
       // `HtmlTable` should not be put inside another one
       expect(explained, isNot(contains('SingleChildScrollView')));
     });
+
+    testWidgets('scrolls in ListView render mode', (WidgetTester tester) async {
+      await tester.pumpWidget(
+        const MaterialApp(
+          home: Scaffold(
+            body: SizedBox(
+              width: 100,
+              child: HtmlWidget(
+                '<table><tr>'
+                '<th>Header 1</th>'
+                '<th>Header 2</th>'
+                '<th>Header 3</th>'
+                '<th>Header 4</th>'
+                '<th>Header 5</th>'
+                '<th>Header 6</th>'
+                '<th>Header 7</th>'
+                '<th>Header 8</th>'
+                '<th>Header 9</th>'
+                '<th>Header 10</th>'
+                '<th>Header 11</th>'
+                '<th>Header 12</th>'
+                '</tr></table>',
+                renderMode: RenderMode.listView,
+              ),
+            ),
+          ),
+        ),
+      );
+
+      final horizontalScrollable = find.byWidgetPredicate(
+        (widget) =>
+            widget is Scrollable && widget.axisDirection == AxisDirection.right,
+      );
+      final scrollable = tester.state<ScrollableState>(horizontalScrollable);
+
+      expect(scrollable.position.maxScrollExtent, greaterThan(0));
+    });
   });
 
   group('rtl', () {