Elevate td and tr elements to be parsed as cell type but cleaner and more robust code

erickok · erickok · commit fd0a32cc5e2b · 2020-11-20T11:25:00.000+01:00
diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -61,10 +61,10 @@ const htmlData = """
       </thead>
       <tbody>
       <tr>
-        <td rowspan='2'>Rowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\n</td><td>Data</td><td>Data</td>
+        <td rowspan='2'>Rowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan\nRowspan</td><td>Data</td><td>Data</td>
       </tr>
       <tr>
-        <td colspan="2">Colpsan</td>
+        <td colspan="2">Colpsan\nColpsan\nColpsan</td>
       </tr>
       </tbody>
       <tfoot>
diff --git a/lib/html_parser.dart b/lib/html_parser.dart
@@ -134,7 +134,9 @@ class HtmlParser extends StatelessWidget {
         return parseReplacedElement(node);
       } else if (LAYOUT_ELEMENTS.contains(node.localName)) {
         return parseLayoutElement(node, children);
-      } else if (TABLE_STYLE_ELEMENTS.contains(node.localName)) {
+      } else if (TABLE_CELL_ELEMENTS.contains(node.localName)) {
+        return parseTableCellElement(node, children);
+      } else if (TABLE_DEFINITION_ELEMENTS.contains(node.localName)) {
         return parseTableDefinitionElement(node, children);
       } else if (customRenderTags.contains(node.localName)) {
         return parseStyledElement(node, children);
diff --git a/lib/src/html_elements.dart b/lib/src/html_elements.dart
@@ -30,8 +30,6 @@ const STYLED_ELEMENTS = [
   "strong",
   "sub",
   "sup",
-  "td",
-  "th",
   "time",
   "tt",
   "u",
@@ -97,7 +95,9 @@ const LAYOUT_ELEMENTS = [
   "thead",
 ];
 
-const TABLE_STYLE_ELEMENTS = ["col", "colgroup"];
+const TABLE_CELL_ELEMENTS = ["th", "td"];
+
+const TABLE_DEFINITION_ELEMENTS = ["col", "colgroup"];
 
 /**
   Here is a list of elements with planned support:
diff --git a/lib/src/layout_element.dart b/lib/src/layout_element.dart
@@ -64,17 +64,12 @@ class TableLayoutElement extends LayoutElement {
     final rowSizes =
         List.generate(rows.length, (_) => IntrinsicContentTrackSize());
 
-    // Calculate column bounds to handle rowspan skipping
-    int columnMax = rows.map((row) {
-      return row.children
-          .where((tag) => tag.name == "th" || tag.name == "td")
-          .fold(0, (int value, child) {
-        final colspanText = child.attributes["colspan"];
-        final colspan =
-            colspanText == null ? 1 : int.tryParse(colspanText) ?? 1;
-        return value + colspan;
-      });
-    }).fold(0, max);
+    // Calculate column bounds
+    int columnMax = rows
+        .map((row) => row.children
+            .whereType<TableCellElement>()
+            .fold(0, (int value, child) => value + child.colspan))
+        .fold(0, max);
 
     final cells = <GridPlacement>[];
     final columnRowOffset = List.generate(columnMax + 1, (_) => 0);
@@ -86,13 +81,7 @@ class TableLayoutElement extends LayoutElement {
           columnRowOffset[columni] = columnRowOffset[columni] - 1;
           columni++;
         }
-        if (child.name == "th" || child.name == "td") {
-          final colspanText = child.attributes["colspan"];
-          final rowspanText = child.attributes["rowspan"];
-          final colspan =
-              colspanText == null ? 1 : int.tryParse(colspanText) ?? 1;
-          final rowspan =
-              rowspanText == null ? 1 : int.tryParse(rowspanText) ?? 1;
+        if (child is TableCellElement) {
           cells.add(GridPlacement(
             child: Container(
               width: double.infinity,
@@ -107,12 +96,12 @@ class TableLayoutElement extends LayoutElement {
               ),
             ),
             columnStart: columni,
-            columnSpan: colspan,
+            columnSpan: child.colspan,
             rowStart: rowi,
-            rowSpan: rowspan,
+            rowSpan: child.rowspan,
           ));
-          columnRowOffset[columni] = rowspan - 1;
-          columni += colspan;
+          columnRowOffset[columni] = child.rowspan - 1;
+          columni += child.colspan;
         }
       }
       rowi++;
@@ -163,6 +152,52 @@ class TableRowLayoutElement extends LayoutElement {
   }
 }
 
+class TableCellElement extends StyledElement {
+  int colspan = 1;
+  int rowspan = 1;
+
+  TableCellElement({
+    String name,
+    String elementId,
+    List<String> elementClasses,
+    @required List<StyledElement> children,
+    Style style,
+    dom.Element node,
+  }) : super(
+      name: name,
+      elementId: elementId,
+      elementClasses: elementClasses,
+      children: children,
+      style: style,
+      node: node) {
+    colspan = _parseSpan(this, "colspan");
+    rowspan = _parseSpan(this, "rowspan");
+  }
+
+  static int _parseSpan(StyledElement element, String attributeName) {
+    final spanValue = element.attributes[attributeName];
+    return spanValue == null ? 1 : int.tryParse(spanValue) ?? 1;
+  }
+}
+
+TableCellElement parseTableCellElement(dom.Element element,
+    List<StyledElement> children,
+) {
+  final cell = TableCellElement(
+    name: element.localName,
+    elementId: element.id,
+    elementClasses: element.classes.toList(),
+    children: children,
+    node: element,
+  );
+  if (element.localName == "th") {
+    cell.style = Style(
+      fontWeight: FontWeight.bold,
+    );
+  }
+  return cell;
+}
+
 class TableStyleElement extends StyledElement {
   TableStyleElement({
     String name,
diff --git a/lib/src/styled_element.dart b/lib/src/styled_element.dart
@@ -349,8 +349,6 @@ StyledElement parseStyledElement(
         verticalAlign: VerticalAlign.SUPER,
       );
       break;
-    case "th":
-      continue bold;
     case "tt":
       continue monospace;
     underline:
