[IMP] Improve compatibility with screen readers (accessibility) (#24574)

Today, Odoo is really tricky to use without seeing the screen, it must be improved to be usable.

This PR forbid to use labels without a "for" attribute, add some title, rule and aria attributes in HTML. With that, Odoo will be fully usable with a screen reader.


* [IMP] Labels must have a for attribute. Improve accessibility.
* [IMP] Better error message when trying to read a missing cached value
* [FIX] Add some aria-label and title attributes for screen readers.
* [FIX] Template name is not included in the error message in case of SyntaxError in QWeb
* [FIX] Improve the Tour failed at step error message to be more explicit.
* [IMP] Add aria-labels
* [FIX] Add missing aria-label on failing test
* [IMP] aria-hidden means hidden. Fix all bad aria-hidden and hide aria-hidden for all.
* [IMP] Color names on kanban views and many2many tags
* [IMP] Add some checks on views for accessibility.
* [IMP] Add `alt` attribute on `img` tags.
* [IMP] Add aria-label and title on non-described icons
* [IMP] Add button role to widgets with btn class
* [IMP] Translate aria and formatted attributes.
* [IMP] Remove wrong aria-labelledby
* [IMP] Add menu role on dropdowns
* [IMP] Buttons must be focusable
* [IMP] Add aria attributes on progress bars
* [IMP] Improve accessibility of basic widgets
* [IMP] Change main layout to more semantic tags
* [IMP] Add menuitem role when missing
* [IMP] Remove wrong role='presentation'
* [IMP] Improve accessibility of tab panels
* [IMP] Add aria-invalid on invalid fields
* [IMP] Add aria-sort on ordered columns
* [IMP] Add role on alerts
* [IMP] Use dialog role, header, main and footer tags for modals
* [IMP] Add labels on o_status
* [IMP] Improve accessibility of kanban view with feeds and articles
* [IMP] Add alerts in case of new messages
* [IMP] Add widget, navigation or img role to aria-labelled items

2 files changed, 13 insertions, 5 deletions

diff --git a/addons/web_tour/static/src/js/tour_manager.js b/addons/web_tour/static/src/js/tour_manager.js
index 628493a6cb2..c9206d06ec2 100644
--- a/addons/web_tour/static/src/js/tour_manager.js
+++ b/addons/web_tour/static/src/js/tour_manager.js
@@ -160,7 +160,7 @@ return core.Class.extend(mixins.EventDispatcherMixin, ServicesMixin, {
     update: function (tour_name) {
         if (this.paused) return;
 
-        this.$modal_displayed = $('.modal:visible').last();
+        this.$modal_displayed = $('[role="dialog"]:visible').last();
 
         tour_name = this.running_tour || tour_name;
         if (tour_name) {
@@ -325,7 +325,14 @@ return core.Class.extend(mixins.EventDispatcherMixin, ServicesMixin, {
     _set_running_tour_timeout: function (tour_name, step) {
         this._stop_running_tour_timeout();
         this.running_tour_timeout = setTimeout((function() {
-            this._consume_tour(tour_name, _.str.sprintf("Tour %s failed at step %s", tour_name, step.trigger));
+            var message;
+            if (step.extra_trigger) {
+                message = _.str.sprintf('Tour %s failed at step "%s" with trigger "%s" and extra trigger "%s"',
+                    tour_name, step.content, step.trigger, step.extra_trigger);
+            } else {
+                message = _.str.sprintf('Tour %s failed at step "%s" with trigger "%s"', tour_name, step.content, step.trigger);
+            }
+            this._consume_tour(tour_name, message);
         }).bind(this), (step.timeout || RUNNING_TOUR_TIMEOUT) + this.running_step_delay);
     },
     _stop_running_tour_timeout: function () {
@@ -357,11 +364,12 @@ return core.Class.extend(mixins.EventDispatcherMixin, ServicesMixin, {
     STEPS: {
         MENU_MORE: {
             edition: "community",
-            trigger: "body > nav",
+            trigger: "body > header > nav",
+            content: _t('Click on the <i>More icon</i> to show hidden apps.'),
             position: "bottom",
             auto: true,
             run: function (actions) {
-                actions.auto("#menu_more_container > a");
+                actions.auto("#more_menu_button");
             },
         },
 
diff --git a/addons/web_tour/static/src/xml/debug_manager.xml b/addons/web_tour/static/src/xml/debug_manager.xml
index 5ec3aa9e748..11c259e9944 100644
--- a/addons/web_tour/static/src/xml/debug_manager.xml
+++ b/addons/web_tour/static/src/xml/debug_manager.xml
@@ -26,7 +26,7 @@
             <tr t-foreach="tours" t-as="tour">
                 <td><t t-esc="tour"/></td>
                 <td><t t-esc="tours[tour].url"/></td>
-                <td><button type="button" class="btn btn-sm btn-primary fa fa-play o_start_tour" t-att-data-name="tour"/></td>
+                <td><button type="button" class="btn btn-sm btn-primary fa fa-play o_start_tour" t-att-data-name="tour" aria-label="Tour" title="Tour"/></td>
             </tr>
         </table>
     </div>