Accessibility Finder issue for the widgets that are just before NestedNavigator(Navigator) in web

Steps to reproduce

Add SemanticsBinding.instance.ensureSemantics(); to the main function.
Inspect the below-given code snippet in Chrome(any web browser) for Accessibility.

Expected results

The Widgets before using Navigator should be visible in the accessibility tree.

Actual results

The Widgets before using Navigator are not visible in the accessibility tree.

Code sample

import 'package:flutter/material.dart';
import 'package:flutter/semantics.dart';

void main() {
  runApp(const MyApp());
  SemanticsBinding.instance.ensureSemantics();
}

class MyApp extends StatelessWidget {
  const MyApp({
    super.key,
  });
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: TestingAccessibility(),
    );
  }
}

class TestingAccessibility extends StatefulWidget {
  const TestingAccessibility({super.key});

  @override
  State<TestingAccessibility> createState() => _TestingAccesabilityState();
}

class _TestingAccesabilityState extends State<TestingAccessibility> {
  final GlobalKey<NavigatorState> navigationKey = GlobalKey<NavigatorState>();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: Row(
      mainAxisSize: MainAxisSize.min,
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        Text("Some text in Left 1"),
        Padding(
          padding: EdgeInsets.all(8.0),
        ),
        Text("Some text in Left 2"),
        Expanded(
          child: Container(
              decoration:
                  BoxDecoration(border: Border.all(color: Colors.blueAccent)),
              child: NestedNavigator(
                navigationKey: navigationKey,
                initialRoute: '/',
                routes: {
                  // default route as '/' is necessary!
                  '/': (context) => Text("Some text in center")
                },
              )),
        ),
        Expanded(child: Text("Some text in Right")),
      ],
    )));
  }
}

class NestedNavigator extends StatelessWidget {
  final GlobalKey<NavigatorState> navigationKey;
  final String initialRoute;
  final Map<String, WidgetBuilder> routes;

  const NestedNavigator({
    super.key,
    required this.navigationKey,
    required this.initialRoute,
    required this.routes,
  });

  @override
  Widget build(BuildContext context) {
    return PopScope(
      child: Navigator(
        key: navigationKey,
        initialRoute: initialRoute,
        onGenerateRoute: (RouteSettings routeSettings) {
          WidgetBuilder builder = routes[routeSettings.name]!;
          if (routeSettings.name == "/") {
            return PageRouteBuilder(
              pageBuilder: (context, __, ___) => builder(context),
              settings: routeSettings,
            );
          } else {
            return MaterialPageRoute(
              builder: builder,
              settings: routeSettings,
            );
          }
        },
      ),
      onPopInvoked: (bool b) {
        if (navigationKey.currentState!.canPop()) {
          navigationKey.currentState!.pop();
        }
      },
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

Logs

No Logs

Flutter Doctor output

Doctor output

[!] Flutter (Channel [user-branch], 3.19.6, on macOS 14.5 23F79 darwin-arm64, locale en-IN)
    ! Flutter version 3.19.6 on channel [user-branch] at /Users/piyushanand/development/FlutterSDK/flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at https://flutter.dev/docs/get-started/install.
    ! Upstream repository unknown source is not a standard remote.
      Set environment variable "FLUTTER_GIT_URL" to unknown source to dismiss this error.
    • Framework revision 54e66469a9 (2 months ago), 2024-04-17 13:08:03 -0700
    • Engine revision c4cd48e186
    • Dart version 3.3.4
    • DevTools version 2.31.1
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/piyushanand/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/piyushanand/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15F31d
    • CocoaPods version 1.14.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)

[✓] VS Code (version 1.90.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.90.0

[✓] Connected device (5 available)
    • sdk gphone64 arm64 (mobile) • emulator-5556                        • android-arm64  • Android 13 (API 33) (emulator)
    • Piyush’s iPhone (mobile)    • 00008020-001C78690E80402E            • ios            • iOS 17.5.1 21F90
    • iPhone 15 Pro Max (mobile)  • E9C45BE5-1DF1-43F6-83F7-EA52F935226F • ios            • com.apple.CoreSimulator.SimRuntime.iOS-17-5 (simulator)
    • macOS (desktop)             • macos                                • darwin-arm64   • macOS 14.5 23F79 darwin-arm64
    • Chrome (web)                • chrome                               • web-javascript • Google Chrome 126.0.6478.127
    ! Error: Browsing on the local area network for iPhone . Ensure the device is unlocked and attached with a cable or associated with the same local area network as
      this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

@creatorpiyush

@creatorpiyush
Seems you are custom implementation or third party package such as getx looking at GetMaterialApp class. Please provide us only minimal but complete runnable code without external implementation that still shows the reported behavior.

@darshankawar

Hello @darshankawar,
I have updated and checked this with MaterialApp instead of GetMaterialApp, and we still have the same issue.

Thanks for the updated code. What's the expected result are you looking for ?
Also, can you upgrade to latest stable and re-run your scenario to check if the behavior persists or not ?

@darshankawar

Hello @darshankawar,
As mentioned when we are using Navigator in the above example to make redirections to the next happen in a particular boundary box, any widget that is before the NestedNavigator[which is nothing just using Navigator] as used above is not visible in the Accessibility inspector and even for some cases like TextField it is also not responsive, that you can't add text to a text field when SemanticsBinding.instance.ensureSemantics(); is added and that TextField is before NestedNavigator.

For the second point yes I have also tried updating my Flutter version to the latest stable 3.22.2, and I got the same results.

Thanks

Thanks for the update. Keeping the issue open and labeling for team's attention.

It is not working on other platforms too, as I have mentioned above for Android and iOS

If multiple platforms are affected, I'm going to remove team-web for now, and re-assign to team-framework.

ah this is because isBlockingSemanticsOfPreviouslyPaintedNodes incorrectly blocking none sibling node if the parent merge upward. yes this is a framework bug.

You can workaround this issue by adding a semantics(container: true) around the navigator

@chunhtai

Hello @chunhtai, any update on this issue?

[go_router] Fix ShellRoute chrome dropped from semantics tree by Moda…

Navigation Menu

Repository navigation

Accessibility Finder issue for the widgets that are just before NestedNavigator(Navigator) in web #150978

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

4 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Accessibility Finder issue for the widgets that are just before NestedNavigator(Navigator) in web #150978

Description

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Activity

darshankawar commented on Jun 28, 2024

creatorpiyush commented on Jun 28, 2024

darshankawar commented on Jul 1, 2024

creatorpiyush commented on Jul 4, 2024

darshankawar commented on Jul 4, 2024

4 remaining items

ditman commented on Jul 26, 2024

chunhtai commented on Aug 13, 2024

creatorpiyush commented on Nov 21, 2024

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions