[web] set the "dialog" ARIA role unconditionally (flutter/engine#54761)

Previously the "dialog" ARIA role was only set if the route or any of its descendants had the `namesRoute` flag. This PR sets the ARIA role unconditionally. Although it's always a good idea to have a label on the route, a missing label doesn't change the fact that the route is a route, so the ARIA role should still be set.

Fixes https://github.com/flutter/flutter/issues/153791
This commit is contained in:
Yegor 2024-08-26 11:36:32 -07:00 committed by GitHub
parent 374cc27f5e
commit dce257d97f
2 changed files with 9 additions and 16 deletions

View File

@ -41,6 +41,13 @@ class SemanticRoute extends SemanticRole {
// Case 2: nothing requested explicit focus. Focus on the first descendant. // Case 2: nothing requested explicit focus. Focus on the first descendant.
_setDefaultFocus(); _setDefaultFocus();
}); });
// Lacking any more specific information, ARIA role "dialog" is the
// closest thing to Flutter's route. This can be revisited if better
// options become available, especially if the framework volunteers more
// specific information about the route. Other attributes in the vicinity
// of routes include: "alertdialog", `aria-modal`, "menu", "tooltip".
setAriaRole('dialog');
} }
void _setDefaultFocus() { void _setDefaultFocus() {
@ -79,7 +86,6 @@ class SemanticRoute extends SemanticRole {
}()); }());
setAttribute('aria-label', label ?? ''); setAttribute('aria-label', label ?? '');
_assignRole();
} }
} }
@ -91,22 +97,12 @@ class SemanticRoute extends SemanticRole {
return; return;
} }
_assignRole();
setAttribute( setAttribute(
'aria-describedby', 'aria-describedby',
routeName.semanticsObject.element.id, routeName.semanticsObject.element.id,
); );
} }
void _assignRole() {
// Lacking any more specific information, ARIA role "dialog" is the
// closest thing to Flutter's route. This can be revisited if better
// options become available, especially if the framework volunteers more
// specific information about the route. Other attributes in the vicinity
// of routes include: "alertdialog", `aria-modal`, "menu", "tooltip".
setAriaRole('dialog');
}
@override @override
bool focusAsRouteDefault() { bool focusAsRouteDefault() {
// Routes are the ones that look inside themselves to find elements to // Routes are the ones that look inside themselves to find elements to

View File

@ -3110,10 +3110,7 @@ void _testRoute() {
semantics().semanticsEnabled = false; semantics().semanticsEnabled = false;
}); });
test('scopesRoute alone sets the SemanticRoute role with no label', () { test('scopesRoute alone sets the SemanticRoute role and "dialog" ARIA role with no label', () {
final List<String> warnings = <String>[];
printWarning = warnings.add;
semantics() semantics()
..debugOverrideTimestampFunction(() => _testTime) ..debugOverrideTimestampFunction(() => _testTime)
..semanticsEnabled = true; ..semanticsEnabled = true;
@ -3127,7 +3124,7 @@ void _testRoute() {
tester.apply(); tester.apply();
expectSemanticsTree(owner(), ''' expectSemanticsTree(owner(), '''
<sem></sem> <sem role="dialog"></sem>
'''); ''');
expect( expect(