[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

1 files changed, 14 insertions, 14 deletions

diff --git a/addons/web/static/tests/widgets/data_export_tests.js b/addons/web/static/tests/widgets/data_export_tests.js
index 4569a5a6290..4948db07474 100644
--- a/addons/web/static/tests/widgets/data_export_tests.js
+++ b/addons/web/static/tests/widgets/data_export_tests.js
@@ -107,15 +107,15 @@ QUnit.module('widgets', {
         list.$('thead th.o_list_record_selector input').click();
         list.sidebar.$('a:contains(Export)').click();
 
-        assert.strictEqual($('.modal').length, 1, "a modal dialog should be open");
+        assert.strictEqual($('[role="dialog"]').length, 1, "a modal dialog should be open");
         assert.strictEqual($('span.o_tree_column:contains(Activities)').length, 1,
             "the Activities field should be in the list of exportable fields");
 
         // select the field Description, click on add, then export and close
-        $('.modal span:contains(Description)').click();
-        $('.modal .o_add_field').click();
-        $('.modal span:contains(Export To File)').click();
-        $('.modal span:contains(Close)').click();
+        $('[role="dialog"] span:contains(Description)').click();
+        $('[role="dialog"] .o_add_field').click();
+        $('[role="dialog"] span:contains(Export To File)').click();
+        $('[role="dialog"] span:contains(Close)').click();
 
         list.destroy();
         framework.blockUI = blockUI;
@@ -185,26 +185,26 @@ QUnit.module('widgets', {
         // Open the export modal
         list.$('thead th.o_list_record_selector input').click();
         list.sidebar.$('a:contains(Export)').click();
-        assert.strictEqual($('.modal').length, 1,
+        assert.strictEqual($('[role="dialog"]').length, 1,
             "a modal dialog should be open");
 
         // Select 'Activities' in fields to export
-        assert.strictEqual($('.modal select.o_fields_list option').length, 0,
+        assert.strictEqual($('[role="dialog"] select.o_fields_list option').length, 0,
             "the fields list should be empty");
-        $('.modal .o_export_tree_item:contains(Activities)').click();
-        $('.modal button:contains(Add)').click();
-        assert.strictEqual($('.modal select.o_fields_list option').length, 1,
+        $('[role="dialog"] .o_export_tree_item:contains(Activities)').click();
+        $('[role="dialog"] button:contains(Add)').click();
+        assert.strictEqual($('[role="dialog"] select.o_fields_list option').length, 1,
             "there should be one item in the fields list");
 
         // Save fields list
-        $('.modal a:contains(Save fields list)').click();
-        $('.modal .o_save_list > input').val('fields list').trigger('input');
-        $('.modal .o_save_list > button').click();
+        $('[role="dialog"] a:contains(Save fields list)').click();
+        $('[role="dialog"] .o_save_list > input').val('fields list').trigger('input');
+        $('[role="dialog"] .o_save_list > button').click();
         assert.verifySteps(['build_search_data', 'create'],
             "create should have been called");
 
         // Close the modal and destroy list
-        $('.modal button span:contains(Close)').click();
+        $('[role="dialog"] button span:contains(Close)').click();
         list.destroy();
 
         // restore create function