TextField context menus do not show after focus switch

@Feichtmeier

When you change the focus away from a textfield and focus it again the context menu does not show up on the first try. You need either to refocus it again or making a small edit like adding a letter or removing it:

Minimal example code:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  const Home({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: SizedBox(
              width: 100,
              child: Column(
                children: const [
                  TextField(),
                  TextField(),
                ],
              ))),
    );
  }
}

Ubuntu 21.10
Flutter installed from git
frederik@carbon:~$ flutter channel
Flutter channels:
  master
* beta
  stable
frederik@carbon:~$ flutter --version
Flutter 2.11.0-0.1.pre • channel beta • https://github.com/flutter/flutter.git
Framework • revision b101bfe32f (vor 11 Tagen) • 2022-02-16 07:36:54 -0800
Engine • revision e355993572
Tools • Dart 2.17.0 (build 2.17.0-69.2.beta) • DevTools 2.10.0-dev.1
frederik@carbon:~$

Originally posted by @Feichtmeier in #90563 (comment)

CC @justinmc

@Feichtmeier

Hi @Feichtmeier, thanks for filing the issue. I am able to reproduce the issue on stable and the master channel, The context menu doesn't show up when the user removes and regains focus on the TextField. This is reproducible on mac and windows too. This is a desktop specific issue since context menus are not available on web and it works fine on mobile platforms.

path_provider_sample.2022-03-08.13-58-06_Trim.mp4

flutter doctor -v (windows)

[√] Flutter (Channel stable, 2.10.3, on Microsoft Windows [Version 10.0.19044.1526], locale en-US)
    • Flutter version 2.10.3 at C:\flutter_sdk\stable
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 7e9793dee1 (14 hours ago), 2022-03-02 11:23:12 -0600
    • Engine revision bd539267b4
    • Dart version 2.16.1
    • DevTools version 2.9.2

[√] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at C:\Users\mahesh\AppData\Local\Android\sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.4)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community
    • Visual Studio Community 2019 version 16.11.31727.386
    • Windows 10 SDK version 10.0.19041.0

[√] Android Studio (version 2020.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • 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 11.0.10+0-b96-7249189)

[√] VS Code (version 1.64.2)
    • VS Code at C:\Users\mahesh\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.36.0

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.19044.1526]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 98.0.4758.102
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 98.0.1108.56

[√] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

[√] Flutter (Channel master, 2.11.0-0.0.pre.752, on Microsoft Windows [Version 10.0.19044.1526], locale en-US)
    • Flutter version 2.11.0-0.0.pre.752 at C:\flutter_sdk\master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision a786f65700 (in the future), 2022-03-03 03:01:22 -0500
    • Engine revision 993285f64d
    • Dart version 2.17.0 (build 2.17.0-165.0.dev)
    • DevTools version 2.11.1

[√] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at C:\Users\mahesh\AppData\Local\Android\sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.4)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community
    • Visual Studio Community 2019 version 16.11.31727.386
    • Windows 10 SDK version 10.0.19041.0

[√] Android Studio (version 2020.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • 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 11.0.10+0-b96-7249189)

[√] VS Code (version 1.64.2)
    • VS Code at C:\Users\mahesh\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.36.0

[√] Connected device (4 available)
    • Windows (desktop)       • windows • windows-x64     • Microsoft Windows [Version 10.0.19044.1526]
    • Windows (UWP) (desktop) • winuwp  • windows-uwp-x64 • 
    • Chrome (web)            • chrome  • web-javascript  • Google Chrome 98.0.4758.102
    • Edge (web)              • edge    • web-javascript  • Microsoft Edge 98.0.1108.56

[√] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

flutter doctor -v (mac)

[✓] Flutter (Channel stable, 2.10.3, on macOS 12.1 21C52 darwin-arm, locale en-GB)
    • Flutter version 2.10.3 at /Users/mahesh/Documents/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 7e9793dee1 (20 hours ago), 2022-03-02 11:23:12 -0600
    • Engine revision bd539267b4
    • Dart version 2.16.1
    • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/mahesh/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • ANDROID_HOME = /Users/mahesh/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.10.2

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

[✓] Android Studio (version 4.2)
    • 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 11.0.8+10-b944.6916264)

[✓] IntelliJ IDEA Community Edition (version 2021.2.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 61.2.4
    • Dart plugin version 212.5080.8

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

[✓] Connected device (3 available)
    • Redmi K20 Pro (mobile) • 192.168.1.5:5555 • android-arm64  • Android 11 (API 30)
    • macOS (desktop)        • macos            • darwin-arm64   • macOS 12.1 21C52 darwin-arm
    • Chrome (web)           • chrome           • web-javascript • Google Chrome 99.0.4844.51

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

[✓] Flutter (Channel master, 2.11.0-0.0.pre.715, on macOS 12.1 21C52 darwin-arm, locale en-GB)
    • Flutter version 2.11.0-0.0.pre.715 at /Users/mahesh/Documents/flutter_master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 8b95cd6f35 (7 hours ago), 2022-02-28 16:31:12 -0800
    • Engine revision 615a60512c
    • Dart version 2.17.0 (build 2.17.0-150.0.dev)
    • DevTools version 2.11.1

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/mahesh/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • ANDROID_HOME = /Users/mahesh/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)
    • All Android licenses accepted.

[!] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! CocoaPods 1.10.2 out of date (1.11.0 is recommended).
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on
        the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To upgrade see https://guides.cocoapods.org/using/getting-started.html#installation for instructions.

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

[✓] Android Studio (version 4.2)
    • 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 11.0.8+10-b944.6916264)

[✓] IntelliJ IDEA Community Edition (version 2021.2.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 61.2.4
    • Dart plugin version 212.5080.8

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

[✓] Connected device (4 available)
    • Redmi K20 Pro (mobile) • 192.168.1.2:5555                     • android-arm64  • Android 11 (API 30)
    • iPhone 13 Pro (mobile) • CBEF6BFA-D3DC-4680-8900-E01C62A4B04C • ios            •
      com.apple.CoreSimulator.SimRuntime.iOS-15-2 (simulator)
    • macOS (desktop)        • macos                                • darwin-arm64   • macOS 12.1 21C52 darwin-arm
    • Chrome (web)           • chrome                               • web-javascript • Google Chrome 98.0.4758.109

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

This regressed from #86796

Seems like because the selection does not change the selection overlay is not recreated when re-focusing after it gets dismissed when un-focusing.

@LongCatIsLooong

cc @LongCatIsLooong should the overlay not always be disposed when unfocused or should it be recreated when null in _handleFocusChanged? (the latter causes a bunch of test failures due to No Overlay widget exists above EditableText)

@markusaksli-nc

@markusaksli-nc I think @justinmc has a design that may resolve this?

Yes I'm currently reworking these menus according to this design doc. I'll have to try this issue out as I get farther along in my work.

If there's not an easy fix right now before my work then I would wait until my changes come.

Seems related #95588
FYI I didn't find an easy fix for this.

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

TextField context menus do not show after focus switch #99707

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

TextField context menus do not show after focus switch #99707

Description

Activity

maheshj01 commented on Mar 8, 2022

markusaksli-nc commented on Apr 29, 2022

markusaksli-nc commented on Apr 29, 2022

LongCatIsLooong commented on Apr 30, 2022

justinmc commented on May 2, 2022

markusaksli-nc commented on May 6, 2022

github-actions commented on Jun 2, 2022

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions