add the ability to configure table roles

Iota-School · Feb 18, 2024 · 552067f · 552067f
1 parent 01e259b
commit 552067f
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 21 deletions.
diff --git a/nbconvert_a11y/exporter.py b/nbconvert_a11y/exporter.py
@@ -30,6 +30,38 @@
 SCHEMA = nbformat.validator._get_schema_json(nbformat.v4)
 
 
+class Roles:
+    """different aria settings for the notebook respresentation"""
+
+    options = "Presentation", "Group", "Region", "List", "Table"
+
+    class Presentation:
+        table = "none"
+        rowgroup = "none"
+        row = "none"
+        columnheader = "none"
+        rowheader = "none"
+        cell = "none"
+
+    class Group(Presentation):
+        row = "group"
+
+    class Region(Presentation):
+        row = "region"
+
+    class List(Presentation):
+        rowgroup = "list"
+        row = "listitem"
+
+    class Table:
+        table = "table"
+        rowgroup = "rowgroup"
+        row = "row"
+        columnheader = "columnheader"
+        rowheader = "rowheader"
+        cell = "cell"
+
+
 THEMES = {
     "a11y": "a11y-{}",
     "a11y-high-contrast": "a11y-high-contrast-{}",
@@ -53,8 +85,7 @@ def from_notebook_node(self, nb, resources=None, **kw):
         html = self.post_process_html(html) or html
         return html, resources
 
-    def post_process_html(self, body):
-        ...
+    def post_process_html(self, body): ...
 
 
 class A11yExporter(PostProcess, HTMLExporter):
@@ -97,6 +128,11 @@ class A11yExporter(PostProcess, HTMLExporter):
     code_theme = Enum(list(THEMES), "gh-high", help="an accessible pygments dark/light theme").tag(
         config=True
     )
+    table_pattern = Enum(
+        list(Roles.options),
+        "List",
+        help="the presentation format of the cells to assistive technology",
+    ).tag(config=True)
     # TF: id love for these definitions to have their own parent class.
     prompt_in = CUnicode("In").tag(config=True)
     prompt_out = CUnicode("Out").tag(config=True)
@@ -156,6 +192,7 @@ def init_resources(self, resources=None):
         resources["prompt_right"] = self.prompt_right
         resources["exclude_anchor_links"] = self.exclude_anchor_links
         resources["hide_anchor_links"] = self.hide_anchor_links
+        resources["table_pattern"] = getattr(Roles, self.table_pattern)
         return resources
 
     def from_notebook_node(self, nb, resources=None, **kw):
@@ -320,9 +357,9 @@ def describe_main(soup):
     """Add REFIDs to aria-describedby"""
     x = soup.select_one("#toc > details > summary")
     if x:
-        x.attrs["aria-describedby"] = soup.select_one("main").attrs[
-            "aria-describedby"
-        ] = "nb-cells-count-label nb-cells-label nb-code-cells nb-code-cells-label nb-ordered nb-loc nb-loc-label"
+        x.attrs["aria-describedby"] = soup.select_one("main").attrs["aria-describedby"] = (
+            "nb-cells-count-label nb-cells-label nb-code-cells nb-code-cells-label nb-ordered nb-loc nb-loc-label"
+        )
 
 
 def ordered(nb) -> str:

diff --git a/nbconvert_a11y/templates/a11y/static/style.css b/nbconvert_a11y/templates/a11y/static/style.css
@@ -118,8 +118,10 @@ li.cell {
 
 /* ## notebook components layout */
 
-td[role="none"]:not([hidden]) {
+td[role="none"]:not([hidden]),
+th[role="none"]:not([hidden]) {
     display: unset;
+    text-align: unset;
 }
 
 table {

diff --git a/nbconvert_a11y/templates/a11y/table.html.j2 b/nbconvert_a11y/templates/a11y/table.html.j2
@@ -25,30 +25,30 @@ or cell.metadata.get("transient",{}).get("remove_source", false) -%}
 or not cell.metadata.get("jupyter", {}).get("outputs_hidden", False)-%}
 {%- endif -%}
 {%- set slide_type = cell.get("metadata", {}).get("slide_type") -%}
-<tr role="listitem" class="cell {{cell.cell_type}}" aria-labelledby="nb-cell-label {{index}} cell-{{index}}-cell_type"
+<tr role="{{resources.table_pattern.row}}" class="cell {{cell.cell_type}}" aria-labelledby="nb-cell-label {{index}} cell-{{index}}-cell_type"
     data-loc="{{cell.source.splitlines().__len__()}}" {% if cell.cell_type=="code" %} {% endif %} data-index="{{index}}"
     {% if slide_type %} data-slide_type="{{slide_type}}" {% endif %}>
-    <td role="none" class="nb-anchor">{{cell_anchor(index, cell.cell_type, cell.execution_count, cell.outputs)}}</td>
-    <td role="none" class="nb-execution_count" {{hide(cell.cell_type=="markdown" or cell.execution_count==None or not
+    <th role="{{resources.table_pattern.rowheader}}" class="nb-anchor" scope="row">{{cell_anchor(index, cell.cell_type, cell.execution_count, cell.outputs)}}</td>
+    <td role="{{resources.table_pattern.cell}}" class="nb-execution_count" {{hide(cell.cell_type=="markdown" or cell.execution_count==None or not
         resources.global_content_filter.include_input_prompt)}}>
         {{cell_execution_count(index, cell.execution_count)}}
     </td>
-    <td role="none" class="nb-cell_type" hidden>{{cell_cell_type(index, cell.cell_type)}}</td>
-    <td role="none" class="nb-toolbar" hidden>{{cell_form(index)}}</td>
-    <td role="none" class="nb-start" id="cell-{{index}}-start" hidden>
+    <td role="{{resources.table_pattern.cell}}" class="nb-cell_type" hidden>{{cell_cell_type(index, cell.cell_type)}}</td>
+    <td role="{{resources.table_pattern.cell}}" class="nb-toolbar" hidden>{{cell_form(index)}}</td>
+    <td role="{{resources.table_pattern.cell}}" class="nb-start" id="cell-{{index}}-start" hidden>
         {% set t0 = cell.get("metadata", {}).get("execution", {}).get("iopub.execute_input", "") %}
         {{time(t0)}}</td>
-    <td role="none" class="nb-end" id="cell-{{index}}-end" hidden>
+    <td role="{{resources.table_pattern.cell}}" class="nb-end" id="cell-{{index}}-end" hidden>
         {% set t1 = cell.get("metadata", {}).get("execution", {}).get("shell.execute_reply", "") %}
         {{time(t1)}}
     </td>
-    <td role="none" class="nb-source" {{hide(cell.cell_type=="markdown" or not include_input)}}>{{cell_source(index,
+    <td role="{{resources.table_pattern.cell}}" class="nb-source" {{hide(cell.cell_type=="markdown" or not include_input)}}>{{cell_source(index,
         cell.source, cell.cell_type, cell.execution_count)}}</td>
-    <td role="none" class="nb-metadata" hidden>{{cell_metadata(index, cell.get("metadata", {}))}}</td>
+    <td role="{{resources.table_pattern.cell}}" class="nb-metadata" hidden>{{cell_metadata(index, cell.get("metadata", {}))}}</td>
     {# it was noted in a video that lines of code were helpful in assistive descriptions.
     lines of code are part of the gestalt of code forms. #}
-    <td role="none" class="nb-loc" id="cell-{{index}}-loc" hidden>{{loc(cell)}}</td>
-    <td role="none" class="nb-outputs" {{hide(not include_outputs)}}>{{cell_output(index, cell, cell.source,
+    <td role="{{resources.table_pattern.cell}}" class="nb-loc" id="cell-{{index}}-loc" hidden>{{loc(cell)}}</td>
+    <td role="{{resources.table_pattern.cell}}" class="nb-outputs" {{hide(not include_outputs)}}>{{cell_output(index, cell, cell.source,
         cell.outputs,
         cell.cell_type,
         cell.execution_count)}}</td>
@@ -57,16 +57,16 @@ or not cell.metadata.get("jupyter", {}).get("outputs_hidden", False)-%}
 
 {% block body_loop %}
 {# the most consistent implementation would connect the input visibility to a form #}
-<table id="cells" role="presentation">
+<table id="cells" role="{{resources.table_pattern.table}}">
     <colgroup>
         {% for col in COLUMNS %}
         <col class="nb-{{col}}">
         {% endfor %}
     </colgroup>
-    <tbody role="list" aria-labelledby="nb-notebook-label nb-cells-label">
-        <tr hidden>
+    <tbody role="{{resources.table_pattern.rowgroup}}" aria-labelledby="nb-notebook-label nb-cells-label">
+        <tr role="{{resources.table_pattern.row}}" hidden>
             {% for col in COLUMNS %}
-            <th scope="col">{{col}}</th>
+            <th role="{{resources.table_pattern.columnheader}}" scope="col">{{col}}</th>
             {% endfor %}
         </tr>
         {%- for cell in nb.cells -%}