Add a wrapper element for tables

Author: javiereguiluz

src/Templates/default/html/table.html.twig

@@ -0,0 +1,24 @@
+<div class="table-wrapper">
+<table{% if tableNode.classes %} class="{{ tableNode.classesString }}"{% endif %}>
+    {% if tableHeaderRows is not empty %}
+        <thead>
+            {% for tableHeaderRow in tableHeaderRows %}
+                <tr>
+                    {% for column in tableHeaderRow.columns %}
+                        <th{% if column.colspan > 1 %} colspan="{{ column.colspan }}"{% endif %}>{{ column.render|raw }}</th>
+                    {% endfor %}
+                </tr>
+            {% endfor %}
+        </thead>
+    {% endif %}
+    <tbody>
+        {% for tableRow in tableRows %}
+            <tr>
+                {% for column in tableRow.columns %}
+                    <td{% if column.colSpan > 1 %} colspan="{{ column.colSpan }}"{% endif %}{% if column.rowSpan > 1 %} rowspan="{{ column.rowSpan }}"{% endif %}>{{ column.render|raw }}</td>
+                {% endfor %}
+            </tr>
+        {% endfor %}
+    </tbody>
+</table>
+</div>

tests/fixtures/expected/blocks/nodes/tables.html

@@ -1,5 +1,6 @@
 <p>Simple table with head:</p>
 
+<div class="table-wrapper">
 <table>
             <thead>
                             <tr>
@@ -21,9 +22,11 @@
                             </tr>
             </tbody>
 </table>
+</div>
 
 <p>Simple table headless:</p>
 
+<div class="table-wrapper">
 <table>
     <tbody>
         <tr>
@@ -38,9 +41,11 @@
         </tr>
     </tbody>
 </table>
+</div>
 
 <p>Grid table:</p>
 
+<div class="table-wrapper">
 <table>
         <tbody>
                     <tr>
@@ -58,9 +63,11 @@
                             </tr>
             </tbody>
 </table>
+</div>
 
 <p>Grid table with head:</p>
 
+<div class="table-wrapper">
 <table>
             <thead>
                             <tr>
@@ -80,9 +87,11 @@
                             </tr>
             </tbody>
 </table>
+</div>
 
 <p>Grid table with head and multi-line cells:</p>
 
+<div class="table-wrapper">
 <table>
             <thead>
                             <tr>
@@ -110,3 +119,4 @@
                             </tr>
             </tbody>
 </table>
+</div>