From 9a21e79ff88e13d83c81d01f620313a4ddf16b14 Mon Sep 17 00:00:00 2001
From: Matt Westcott <matt@west.co.tt>
Date: Sun, 29 Sep 2019 16:27:21 +0100
Subject: [PATCH] Add role="table" to TableBlock output

As per https://twitter.com/SaraSoueidan/status/1177622630763028480, certain browsers apply heuristics to decide whether `<table>` elements exist for layout or data purposes, and adjust the behaviour of their accessibility features accordingly. Given that TableBlock intentionally doesn't allow markup within cells, we can be reasonably sure that any tables created with it are genuine data tables, and should therefore indicate that using `role="table"`.
---
 CHANGELOG.txt                                    |  1 +
 docs/releases/2.7.rst                            |  1 +
 .../templates/table_block/blocks/table.html      |  2 +-
 wagtail/contrib/table_block/tests.py             | 16 ++++++++--------
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/CHANGELOG.txt b/CHANGELOG.txt
index b43cc186d..848ccbe97 100644
--- a/CHANGELOG.txt
+++ b/CHANGELOG.txt
@@ -21,6 +21,7 @@ Changelog
  * Add `WAGTAILDOCS_SERVE_METHOD` setting to determine how document downloads will be linked to and served (Tobias McNulty, Matt Westcott)
  * Add `WAGTAIL_MODERATION_ENABLED` setting to enable / disable the 'Submit for Moderation' option (Jacob Topp-Mugglestone)
  * Added settings to customise pagination page size for the Images admin area (Brian Whitton)
+ * Added ARIA role to TableBlock output (Matt Westcott)
  * Fix: Added line breaks to long filenames on multiple image / document uploader (Kevin Howbrook)
  * Fix: Added https support for Scribd oEmbed provider (Rodrigo)
  * Fix: Changed StreamField group labels color so labels are visible (Catherine Farman)
diff --git a/docs/releases/2.7.rst b/docs/releases/2.7.rst
index 7af5696ba..d4ac1d046 100644
--- a/docs/releases/2.7.rst
+++ b/docs/releases/2.7.rst
@@ -40,6 +40,7 @@ Other features
  * Add ``WAGTAILDOCS_SERVE_METHOD`` setting to determine how document downloads will be linked to and served (Tobias McNulty, Matt Westcott)
  * Add ``WAGTAIL_MODERATION_ENABLED`` setting to enable / disable the 'Submit for Moderation' option (Jacob Topp-Mugglestone)
  * Added settings to customise pagination page size for the Images admin area (Brian Whitton)
+ * Added ARIA role to TableBlock output (Matt Westcott)
 
 
 Bug fixes
diff --git a/wagtail/contrib/table_block/templates/table_block/blocks/table.html b/wagtail/contrib/table_block/templates/table_block/blocks/table.html
index 524eae814..6ac4ec9cd 100644
--- a/wagtail/contrib/table_block/templates/table_block/blocks/table.html
+++ b/wagtail/contrib/table_block/templates/table_block/blocks/table.html
@@ -1,6 +1,6 @@
 {% load table_block_tags %}
 
-<table>
+<table role="table">
     {% if table_caption %}
        <caption>{{ table_caption }}</caption>
     {% endif %}
diff --git a/wagtail/contrib/table_block/tests.py b/wagtail/contrib/table_block/tests.py
index 63967d32b..b7b8ab908 100644
--- a/wagtail/contrib/table_block/tests.py
+++ b/wagtail/contrib/table_block/tests.py
@@ -37,7 +37,7 @@ class TestTableBlock(TestCase):
         block = TableBlock()
         result = block.render(value)
         expected = """
-            <table>
+            <table role="table">
                 <tbody>
                     <tr><td>Test 1</td><td>Test 2</td><td>Test 3</td></tr>
                     <tr><td></td><td></td><td></td></tr>
@@ -61,7 +61,7 @@ class TestTableBlock(TestCase):
         block = TableBlock()
         result = block.render(value)
         expected = """
-            <table>
+            <table role="table">
                 <thead>
                     <tr><th>Test 1</th><th class="htLeft">Test 2</th><th>Test 3</th></tr>
                 </thead>
@@ -90,7 +90,7 @@ class TestTableBlock(TestCase):
             ]
         })
         expected = """
-            <table>
+            <table role="table">
                 <tbody>
                     <tr><td></td><td></td><td></td></tr>
                     <tr><td></td><td></td><td></td></tr>
@@ -110,7 +110,7 @@ class TestTableBlock(TestCase):
                           [None, None, None]]}
 
         expected = """
-            <table>
+            <table role="table">
                 <tbody>
                     <tr><td>&lt;p&gt;&lt;strong&gt;Test&lt;/strong&gt;&lt;/p&gt;</td><td></td><td></td></tr>
                     <tr><td></td><td></td><td></td></tr>
@@ -131,7 +131,7 @@ class TestTableBlock(TestCase):
                  'data': [['Foo', 'Bar', 'Baz'], [None, None, None], [None, None, None]]}
 
         expected = """
-            <table>
+            <table role="table">
                 <thead>
                     <tr><th>Foo</th><th>Bar</th><th>Baz</th></tr>
                 </thead>
@@ -153,7 +153,7 @@ class TestTableBlock(TestCase):
                  'data': [['Foo', 'Bar', 'Baz'], ['one', 'two', 'three'], ['four', 'five', 'six']]}
 
         expected = """
-            <table>
+            <table role="table">
                 <tbody>
                     <tr><th>Foo</th><td>Bar</td><td>Baz</td></tr>
                     <tr><th>one</th><td>two</td><td>three</td></tr>
@@ -173,7 +173,7 @@ class TestTableBlock(TestCase):
                  'data': [['Foo', 'Bar', 'Baz'], ['one', 'two', 'three'], ['four', 'five', 'six']]}
 
         expected = """
-            <table>
+            <table role="table">
                 <thead>
                     <tr><th>Foo</th><th>Bar</th><th>Baz</th></tr>
                 </thead>
@@ -252,7 +252,7 @@ class TestTableBlock(TestCase):
         block = TableBlock()
         result = block.render(value)
         expected = """
-            <table>
+            <table role="table">
                 <caption>caption</caption>
                 <tbody>
                     <tr><td>Test 1</td><td>Test 2</td><td>Test 3</td></tr>