feature: html table implemented

as envisioned by mistltoe developers

renderer/fifty_ohm_html_renderer.py

@@ -215,17 +215,14 @@ class FiftyOhmHtmlRenderer(HtmlRenderer):
             return f"<{type}>{cell}</{type}>"
 
     def render_table(self, token):
-        data = token.table
         alignment = token.alignment
-
         table = "<table>"
-
-        for i, row in enumerate(data):
+        
+        for i, row in enumerate(token.children):
             content = ""
-            for j, cell in enumerate(row[0]):
-                content += self.render_cell_helper(cell, alignment[j], ("th" if i==0 else "td"))
+            for j, cell in enumerate(row.children):
+                content += self.render_cell_helper(self.render_inner(cell), alignment[j], ("th" if i==0 else "td"))
             table += self.render_row_helper(content)
-            
         table += "</table>"
 
         return table

renderer/table.py

@@ -1,4 +1,5 @@
 
+from mistletoe import span_token
 from mistletoe.block_token import BlockToken
 
 
@@ -8,20 +9,40 @@ class Table(BlockToken):
         return '|' in line
 
     @classmethod
-    def parseHeader(self, line):
+    def parseHeader(cls, line): 
+        # Parse header, extract alignment and make an ordinary row out of it
         line = line.strip().strip('|') # Remove leading/trailing whitespace and pipes
         columns = [col.strip() for col in line.split('|')] # Split by pipe |
 
         alignment = []
-        data = []
+        header = "| "
 
         for column in columns:
             attr, val = column.split(':')
             alignment.append(attr)
-            data.append(val)
+            header += val + " | "
         
-        return data, alignment
+        return header, alignment
 
+    @classmethod
+    def read(cls, lines):
+        header = next(lines)
+        header, alignment = cls.parseHeader(header)
+        rows = [TableRow(header)]
+
+        for line in lines:
+            if "|" not in line :
+                break
+            else :
+                rows.append(TableRow(line))
+
+        return alignment, rows
+
+    def __init__(self, match):
+        self.alignment, self.children = match
+
+
+class TableRow(BlockToken):
     @classmethod
     def parseRow(self, line):
         line = line.strip().strip('|')
@@ -30,29 +51,13 @@ class Table(BlockToken):
         data = []
 
         for column in columns:
-            data.append(column)
+            data.append(TableCell(column))
 
         return data
 
-    @classmethod
-    def read(self, lines):
-
-        table = []
-
-        header = next(lines)
-
-        data, alignment = self.parseHeader(header)
-        table.append([data])
-
-        for line in lines:
-            if "|" not in line:
-                break
-            data = self.parseRow(line)
-            table.append([data])
-
-        return [table, alignment]
-
     def __init__(self, match):
-        self.table = match[0]
-        self.alignment = match[1]
-        print("init")
+        self.children = self.parseRow(match)
+
+class TableCell(BlockToken) :
+    def __init__(self, match):
+        super().__init__(match, span_token.tokenize_inner)

test/test_table.py

@@ -5,15 +5,17 @@ from renderer.fifty_ohm_html_renderer import FiftyOhmHtmlRenderer
 
 
 @pytest.mark.html
-def test_question_html():
+def test_table_html():
     assertions = {
-        "| l: abc | r: abc | X: abc |\n| 123 | 456 | 789 | \n | 987 | 654 | 321 | ": "<table><tr><th style='text-align: left;'> abc</th><th style='text-align: right;'> abc</th><th> abc</th></tr><tr><td style='text-align: left;'>123</td><td style='text-align: right;'>456</td><td>789</td></tr><tr><td style='text-align: left;'>987</td><td style='text-align: right;'>654</td><td>321</td></tr></table>\n",
-        "text\n| l: abc | r: abc | X: abc |\n| 123 | 456 | 789 | \n | 987 | 654 | 321 |\ntext": "text\n<table><tr><th style='text-align: left;'> abc</th><th style='text-align: right;'> abc</th><th> abc</th></tr><tr><td style='text-align: left;'>123</td><td style='text-align: right;'>456</td><td>789</td></tr><tr><td style='text-align: left;'>987</td><td style='text-align: right;'>654</td><td>321</td></tr></table>\ntext\n",
+        "| l: a |" : "<table><tr><th style='text-align: left;'>a</th></tr></table>\n",
+        "| r: a |" : "<table><tr><th style='text-align: right;'>a</th></tr></table>\n",
+        "| l: a |\n| *b* |" : "<table><tr><th style='text-align: left;'>a</th></tr><tr><td style='text-align: left;'><em>b</em></td></tr></table>\n",
+        "| l: *a* |" : "<table><tr><th style='text-align: left;'><em>a</em></th></tr></table>\n",
+        "| l: a |\n| [morse:a] |" : "<table><tr><th style=\'text-align: left;\'>a</th></tr><tr><td style=\'text-align: left;\'><span class=\"morse\"><span class=\"morse_char\">\n<span class=\"morse_char\">\n▄</span>\n<span class=\"morse_char\">\n▄▄▄</span>\n</span>\n</span></td></tr></table>\n",
+        "| l: a |\n| b |" : "<table><tr><th style='text-align: left;'>a</th></tr><tr><td style='text-align: left;'>b</td></tr></table>\n",
+        "| l: abc | r: abc | X: abc |\n| 123 | 456 | 789 | \n | 987 | 654 | 321 | ": "<table><tr><th style='text-align: left;'>abc</th><th style='text-align: right;'>abc</th><th>abc</th></tr><tr><td style='text-align: left;'>123</td><td style='text-align: right;'>456</td><td>789</td></tr><tr><td style='text-align: left;'>987</td><td style='text-align: right;'>654</td><td>321</td></tr></table>\n",
     }
 
-    def test_function(input):
-        return f"{input}"
-
-    with FiftyOhmHtmlRenderer(test_function) as renderer:
+    with FiftyOhmHtmlRenderer() as renderer:
         for assertion in assertions:
             assert renderer.render(Document(assertion)) == assertions[assertion]