From: Vladimír Vondruš <mosra@centrum.cz>
Date: Wed, 5 Jan 2022 20:51:15 +0000 (+0100)
Subject: m.htmlsanity: render TOC as a <nav> instead of <aside>.
X-Git-Url: https://www.chiark.greenend.org.uk/ucgi/~cjwatson/git?a=commitdiff_plain;h=295131dc8fa25a28914dccc8adb362cb81a7fdcc;p=blog.git

m.htmlsanity: render TOC as a <nav> instead of <aside>.
---

diff --git a/doc/plugins/htmlsanity.rst b/doc/plugins/htmlsanity.rst
index d338bd0e..9b778baf 100644
--- a/doc/plugins/htmlsanity.rst
+++ b/doc/plugins/htmlsanity.rst
@@ -117,7 +117,8 @@ horrible, right?) with a custom HTML5 writer derived from
 -   Even the Docutils HTML5 writer was putting *frightening* :html:`<colgroup>`
     things into HTML tables. Not anymore.
 -   Topics are using HTML5 :html:`<aside>` tag, topic headers are using
-    :html:`<h3>` instead of a nondescript :html:`<div>`
+    :html:`<h3>` instead of a nondescript :html:`<div>`. A special case is
+    Table of Contents, which is a :html:`<nav>` instead of :html:`<aside>`
 -   Line blocks are simply :html:`<p>` elements with lines delimited using
     :html:`<br>`
 -   The :html:`<abbr>` tag now properly includes a ``title`` attribute
diff --git a/plugins/m/htmlsanity.py b/plugins/m/htmlsanity.py
index 4709d9df..bfb40487 100644
--- a/plugins/m/htmlsanity.py
+++ b/plugins/m/htmlsanity.py
@@ -382,13 +382,22 @@ class SaneHtmlTranslator(HTMLTranslator):
             self.body.append('\n')
         self.in_mailto = False
 
-    # Use <aside> instead of a meaningless <div>
+    # Use <aside> for general topics, <nav> for table of contents (but drop the
+    # contents class and ID)
     def visit_topic(self, node):
-        self.body.append(self.starttag(node, 'aside'))
         self.topic_classes = node['classes']
 
+        if 'contents' in node['classes']:
+            node.html_tagname = 'nav'
+            node['classes'].remove('contents')
+            node['ids'].remove('contents')
+        else:
+            node.html_tagname = 'aside'
+
+        self.body.append(self.starttag(node, node.html_tagname))
+
     def depart_topic(self, node):
-        self.body.append('</aside>\n')
+        self.body.append('</{}>\n'.format(node.html_tagname))
         self.topic_classes = []
 
     # Don't use <colgroup> or other shit in tables
diff --git a/plugins/m/test/htmlsanity_content/page.html b/plugins/m/test/htmlsanity_content/page.html
index a9b3ce79..2ef5c60e 100644
--- a/plugins/m/test/htmlsanity_content/page.html
+++ b/plugins/m/test/htmlsanity_content/page.html
@@ -23,7 +23,7 @@
       <div class="m-col-l-10 m-push-l-1">
         <h1>A page</h1>
 <!-- content -->
-<aside class="contents m-block m-default" id="contents">
+<nav class="m-block m-default">
 <h3>Contents</h3>
 <ul>
 <li><a href="#section-title" id="id6">Section title</a><ul>
@@ -32,7 +32,7 @@
 </li>
 <li><a href="#section-after" id="id8">Section after</a></li>
 </ul>
-</aside>
+</nav>
 <p>A paragraph.</p>
 <blockquote>
 A block quote.</blockquote>