[web] [a11y] Focus in VoiceOver jumps back to first form control when navigating via context menu

Steps to reproduce

When trying to navigate via the VoiceOver context menu on Mac, the VoiceOver focus jumps back to the first form control instead of going to the form control I tried to navigate to.

This issue first arises in 3.29.0 (occurs until at least master 838d2dd (last tested at that commit))
The issue does not occur in 3.27.4 or below!

Start application in Web
Turn on VoiceOver on Mac
Use VoiceOver context menu by pressing CTRL+OPTION+U and jump to any form control other than the first one

Expected results

VoiceOver Focus jumps to selected element and stays there

Actual results

VoiceOver Focus jumps to first form control on the site

Code sample

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    var router = GoRouter(
      routes: [
        GoRoute(
          path: '/',
          name: 'home',
          builder: (_, __) => const MyHomePage(),
        ),
      ],
    );

    return MaterialApp.router(
      routeInformationParser: router.routeInformationParser,
      routeInformationProvider: router.routeInformationProvider,
      routerDelegate: router.routerDelegate,
      builder: (_, navigator) {
        return Column(
          verticalDirection: VerticalDirection.up,
          children: [
            Expanded(child: navigator ?? Container()),
            MyNavBar(),
          ],
        );
      },
    );
  }
}

class MyNavBar extends StatelessWidget {
  const MyNavBar({super.key});

  @override
  Widget build(BuildContext context) {
    return Semantics(
      label: 'NavBar',
      container: true,
      explicitChildNodes: true,
      child: Container(
        height: 80,
        width: double.infinity,
        color: Colors.green,
        child: Row(
          children: [
            ..._buildContent(true, '1'),
            ..._buildContent(true, '2'),
            ..._buildContent(true, '3'),
          ],
        ),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        ..._buildContent(false, '1'),
        ..._buildContent(false, '2'),
        ..._buildContent(false, '3'),
      ],
    );
  }
}

List<Widget> _buildContent(bool isNav, String number) {
  final text = isNav ? 'Nav' : 'Content';
  return [
    Text('$text Text $number'),
    ElevatedButton(
      onPressed: () {
        debugPrint('Pressed $text Button $number');
      },
      child: Text('$text Button $number'),
    )
  ];
}

name: a11y_focus_test
description: "A new Flutter project."
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

version: 1.0.0+1

environment:
  sdk: '>=3.6.0 < 4.0.0'

dependencies:
  flutter:
    sdk: flutter

  go_router: ^15.1.1

dev_dependencies:
  flutter_test:
    sdk: flutter

Screenshots or Video

Screenshots / Video demonstration 3.29.0 and after

Screen.Recording.2025-05-07.at.10.45.42.mov

Screenshots / Video demonstration 3.27.4 (works as expected)

non-issue-3_27_4.mov

Logs

No logs when navigating with VoiceOver

Flutter Doctor output

Doctor output

[✓] Flutter (Channel master, 3.32.0-1.0.pre.443, on macOS 15.4.1 24E263 darwin-arm64, locale en-DE) [2.3s]
    • Flutter version 3.32.0-1.0.pre.443 on channel master at /Users/m804808/dev/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 838d2ddaba (2 hours ago), 2025-05-07 01:39:09 -0400
    • Engine revision 838d2ddaba
    • Dart version 3.9.0 (build 3.9.0-97.0.dev)
    • DevTools version 2.46.0-dev.0
    • Pub download mirror <selfhosted artifactory url>

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) [1,254ms]
    • Android SDK at /Users/m804808/Library/Android/sdk
    • Emulator version 35.2.10.0 (build_id 12414864) (CL:N/A)
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Users/m804808/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
      This is the JDK bundled with the latest Android Studio installation on this machine.
      To manually set the JDK path, use: `flutter config --jdk-dir="path/to/jdk"`.
    • Java version OpenJDK Runtime Environment (build 21.0.3+-79915917-b509.11)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.2) [819ms]
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 16C5032a
    • CocoaPods version 1.16.2

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

[✓] Android Studio (version 2024.2) [97ms]
    • Android Studio at /Users/m804808/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 21.0.3+-79915917-b509.11)

[✓] IntelliJ IDEA Ultimate Edition (version 2024.2.4) [95ms]
    • IntelliJ at /Users/m804808/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 85.2.2
    • Dart plugin version 242.24931

[✓] VS Code (version 1.99.3) [12ms]
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension can be installed from:
      🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (2 available) [6.1s]
    • macOS (desktop)                             • macos                     • darwin-arm64   • macOS 15.4.1
      24E263 darwin-arm64
    • Chrome (web)                                • chrome                    • web-javascript • Google Chrome
      136.0.7103.49

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

• No issues found!

I am strongly under the impression that

return MaterialApp.router(
  ...
  builder: (_, navigator) {
    return Column(
      verticalDirection: VerticalDirection.up,
      children: [
        Expanded(child: navigator ?? Container()),
        MyNavBar(),
      ],
    );
  }
};

is part of where the issue comes from.
If I put MyNavBar first in the column, it is not rendered in the accessibility tree at all.

Thanks for the detailed report. I was able to replicate the reported behavior with latest sdk versions. The same behavior works as expected in previous stable (3.27.4).

stable : 3.29.3
master : 3.32.0-1.0.pre.442

I suspect the dom element may be stealing the focus back from the new focused item

[web] Fix VoiceOver child focus direction (flutter#188820)

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

[web] [a11y] Focus in VoiceOver jumps back to first form control when navigating via context menu #168458

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[web] [a11y] Focus in VoiceOver jumps back to first form control when navigating via context menu #168458

Description

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Activity

darshankawar commented on May 7, 2025

chunhtai commented on May 7, 2025

github-actions commented on Sep 17, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions