[FIX] web: Aria attributes on buttons Export All & optional columns

Some aria attributes were missing or incorrectly set on these new
buttons:
- The button "Export All" was missing an `aria-label` attribute
- The button to show/hide optional columns was also missing an
  `aria-label` attribute, and its menu items (checkboxes to show/hide
  columns) were missing a proper role
- Ever since the debug manager was added in frontend on 73327db0656b,
  the `aria-label` attribute was not being rendered correctly on the
  button to open developer tools

closes odoo/odoo#70390

X-original-commit: 620e4cc28cefed6f4a3b5ca89b11cc37222acfaf
Signed-off-by: Nicolas Lempereur (nle) <nle@odoo.com>

5 files changed, 25 insertions, 3 deletions

diff --git a/addons/web/i18n/web.pot b/addons/web/i18n/web.pot
index 8586334aa9e..45a2f74099a 100644
--- a/addons/web/i18n/web.pot
+++ b/addons/web/i18n/web.pot
@@ -2887,6 +2887,13 @@ msgstr ""
 #. openerp-web
 #: code:addons/web/static/src/xml/debug.xml:0
 #, python-format
+msgid "Open Developer Tools"
+msgstr ""
+
+#. module: web
+#. openerp-web
+#: code:addons/web/static/src/xml/debug.xml:0
+#, python-format
 msgid "Open Developer Tools#{widget.debug_mode_help}"
 msgstr ""
 
@@ -2938,6 +2945,13 @@ msgstr ""
 
 #. module: web
 #. openerp-web
+#: code:addons/web/static/src/js/views/list/list_renderer.js:0
+#, python-format
+msgid "Optional columns"
+msgstr ""
+
+#. module: web
+#. openerp-web
 #: code:addons/web/static/src/js/fields/basic_fields.js:0
 #: code:addons/web/static/src/xml/base.xml:0
 #: code:addons/web/static/src/xml/base.xml:0
diff --git a/addons/web/static/src/js/core/dom.js b/addons/web/static/src/js/core/dom.js
index b14684e4acd..4f1696b43ea 100644
--- a/addons/web/static/src/js/core/dom.js
+++ b/addons/web/static/src/js/core/dom.js
@@ -485,6 +485,9 @@ var dom = {
         if (options && options.prop) {
             $input.prop(options.prop);
         }
+        if (options && options.role) {
+            $input.attr('role', options.role);
+        }
         return $container.append($input, $label);
     },
     /**
diff --git a/addons/web/static/src/js/views/list/list_renderer.js b/addons/web/static/src/js/views/list/list_renderer.js
index cda4e07e5b4..93fb8ea68d2 100644
--- a/addons/web/static/src/js/views/list/list_renderer.js
+++ b/addons/web/static/src/js/views/list/list_renderer.js
@@ -983,6 +983,7 @@ var ListRenderer = BasicRenderer.extend({
             'data-toggle': "dropdown",
             'data-display': "static",
             'aria-expanded': false,
+            'aria-label': _t('Optional columns'),
         });
         $a.appendTo($optionalColumnsDropdown);
 
@@ -1001,6 +1002,7 @@ var ListRenderer = BasicRenderer.extend({
                 (config.isDebug() ? (' (' + col.attrs.name + ')') : '');
             var $checkbox = dom.renderCheckbox({
                 text: txt,
+                role: "menuitemcheckbox",
                 prop: {
                     name: col.attrs.name,
                     checked: _.contains(self.optionalColumnsEnabled, col.attrs.name),
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 36b63c852ad..e18890ac188 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -824,7 +824,7 @@
             </button>
         </t>
         <t t-if="widget.is_action_enabled('export_xlsx') and widget.isExportEnable">
-            <button type="button" class="btn btn-secondary fa fa-download o_list_export_xlsx" title="Export All"/>
+            <button type="button" class="btn btn-secondary fa fa-download o_list_export_xlsx" title="Export All" aria-label="Export All"/>
         </t>
     </div>
 </t>
diff --git a/addons/web/static/src/xml/debug.xml b/addons/web/static/src/xml/debug.xml
index 0caf3da010e..3c5f593a24e 100644
--- a/addons/web/static/src/xml/debug.xml
+++ b/addons/web/static/src/xml/debug.xml
@@ -3,8 +3,11 @@
 
 <t t-name="WebClient.DebugManager">
     <li class="o_debug_manager" role="menuitem">
-        <a role="button" href="#" class="o_debug_mode" t-attf-title="Open Developer Tools#{widget.debug_mode_help}"
-                         t-att-data-debug-mode="widget.debug_mode" aria-label="Open Developer Tools#{widget.debug_mode_help}"
+        <t t-set="_devtool_button_title">Open Developer Tools</t>
+        <a role="button" href="#" class="o_debug_mode"
+                         t-att-title="_devtool_button_title + widget.debug_mode_help"
+                         t-att-aria-label="_devtool_button_title + widget.debug_mode_help"
+                         t-att-data-debug-mode="widget.debug_mode"
                          data-toggle="dropdown" aria-expanded="false" tabindex="-1" data-display="static">
             <span class="fa fa-bug"/>
         </a>