Skip to content

Developers should be discouraged from having unlabeled leaf a11y nodes #94485

Description

@dnfield

For example, the following should trigger a test error:

await tester.pumpWidget(
  MaterialApp(
    home: Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          const Text(
            'You have pushed the button this many times:',
          ),
          Text(
            '5',
            style: Theme.of(context).textTheme.headline4,
          ),
          Image.network('https://via.placeholder.com/150'),
        ],
       ),
    ),
  ),
);

The error should tell the developer that they should either provide a semantic label for the image, or exclude it from semantics. Otherwise screen readers may focus on the image and not have an appropriate thing to read out, which is frustrating for a11y users.

I think we should do this in testWidgets, with a walk of the a11y tree that checks for unlabeled/hinted/valued leaf nodes. It could be done as an a11y matcher, but ideally this is something tests would get opted into to catch errors that developers tend to miss in this regard.

/cc @goderbauer @chunhtai

Metadata

Metadata

Assignees

Labels

P3Issues that are less important to the Flutter projecta: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)a: tests"flutter test", flutter_test, or one of our testsc: new featureNothing broken; request for a new capabilityframeworkflutter/packages/flutter repository. See also f: labels.team-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions