Tooltip doesn't disappear when wrapped inside MouseRegion (Web)

Is there an existing issue for this?

I have searched the existing issues
I have read the guide to filing a bug

Steps to reproduce

I am using MouseRegion to show an IconButton when the mouse enters the region and hides the button when the mouse exits the region. The IconButton has a tooltip and shows correctly, however, the tooltip doesn't disappear when moving the mouse vertically away from the tooltip.

Expected results

The tooltip disappears when moving the mouse vertically.

Actual results

The tooltip sticks until the same tooltip is shown again.

Code sample

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

  @override
  State<TooltipExamplePage> createState() => _TooltipExamplePageState();
}

class _TooltipExamplePageState extends State<TooltipExamplePage> {
  bool showButton = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        color: Colors.blueGrey,
        child: Center(
          child: MouseRegion(
              onEnter: (event) => _showButton(true),
              onExit: (event) => _showButton(false),
              child: Container(
                  color: Colors.white,
                  height: 50,
                  width: 100,
                  child: Stack(
                    children: [
                      const Center(child: Text('HOVER HERE')),
                      if (showButton)
                        Positioned(
                          top: 0,
                          right: 0,
                          child: IconButton(
                            onPressed: () {},
                            icon: const Icon(Icons.delete),
                            tooltip: 'Tooltip Example',
                          ),
                        )
                    ],
                  ))),
        ),
      ),
    );
  }

  void _showButton(bool show) {
    setState(() {
      showButton = show;
    });
  }
}

Screenshots or Video

No response

Logs

No response

Flutter Doctor output

Doctor output

[√] Flutter (Channel stable, 3.13.3, on Microsoft Windows [Version 10.0.22621.2283], locale en-US)
    • Flutter version 3.13.3 on channel stable at C:\Users\User\Documents\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 2524052335 (7 days ago), 2023-09-06 14:32:31 -0700
    • Engine revision b8d35810e9
    • Dart version 3.1.1
    • DevTools version 2.25.0

[√] Windows Version (Installed version of Windows is version 10 or higher)

[X] Android toolchain - develop for Android devices
    X Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/docs/get-started/install/windows#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.


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

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.6.2)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.6.33723.286
    • Windows 10 SDK version 10.0.22621.0

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/windows#android-setup for detailed instructions).

[√] VS Code, 64-bit edition (version 1.82.1)
    • VS Code at C:\Program Files\Microsoft VS Code
    • Flutter extension version 3.72.0

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

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

! Doctor found issues in 2 categories.

@marty-isync

Hi @marty-isync. Thanks for filing this. I can reproduce this on the latest master and stable channels. When the cursor is moved directly out of the button, the icon disappears but the Tooltip still shows. If cursor is moved from Icon to the button directly before moving out of the button, the tooltip disappears (video below). This isn't peculiar to web as I can reproduce on macOS as well.

Screen.Recording.2023-09-14.at.08.05.34.mov

stable, master flutter doctor -v

[✓] Flutter (Channel stable, 3.13.3, on macOS 13.0 22A380 darwin-arm64, locale
    en-NG)
    • Flutter version 3.13.3 on channel stable at
      /Users/damilolaalimi/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 2524052335 (7 days ago), 2023-09-06 14:32:31 -0700
    • Engine revision b8d35810e9
    • Dart version 3.1.1
    • DevTools version 2.25.0

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

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

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

[✓] Android Studio (version 2022.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
      17.0.6+0-17.0.6b802.4-9586694)

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

[✓] Connected device (4 available)
    • sdk gphone64 arm64 (mobile) • emulator-5554                        •
      android-arm64  • Android 14 (API 34) (emulator)
    • iPhone 13 Pro (mobile)      • 14B6FEE4-2F1C-401F-8804-A5115D7A6DA2 • ios
      • com.apple.CoreSimulator.SimRuntime.iOS-16-4 (simulator)
    • macOS (desktop)             • macos                                •
      darwin-arm64   • macOS 13.0 22A380 darwin-arm64
    • Chrome (web)                • chrome                               •
      web-javascript • Google Chrome 116.0.5845.187

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

• No issues found!

[✓] Flutter (Channel master, 3.14.0-14.0.pre.289, on macOS 13.0 22A380 darwin-arm64, locale en-NG)
    • Flutter version 3.14.0-14.0.pre.289 on channel master at /Users/damilolaalimi/fvm/versions/master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 4db47db177 (2 hours ago), 2023-09-13 20:39:58 -0700
    • Engine revision cd90cc8469
    • Dart version 3.2.0 (build 3.2.0-140.0.dev)
    • DevTools version 2.27.0

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

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

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

[✓] Android Studio (version 2022.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 17.0.6+0-17.0.6b802.4-9586694)

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

[✓] Connected device (4 available)
    • sdk gphone64 arm64 (mobile) • emulator-5554                        • android-arm64  • Android 14 (API 34) (emulator)
    • iPhone 13 Pro (mobile)      • 14B6FEE4-2F1C-401F-8804-A5115D7A6DA2 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-16-4 (simulator)
    • macOS (desktop)             • macos                                • darwin-arm64   • macOS 13.0 22A380 darwin-arm64
    • Chrome (web)                • chrome                               • web-javascript • Google Chrome 116.0.5845.187

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

• No issues found!

This is more like a Tooltip than MouseRegion's issue. The issue doesn't seem to belong to MouseRegion as I can reproduce the issue with Listener instead:

Listener(
    onPointerDown: (event) => _showButton(true),
    onPointerUp: (event) => _showButton(false),

Call `markNeedsPaint` when adding overlayChild to `Overlay` (#135941)

Call `markNeedsPaint` when adding overlayChild to `Overlay` (flutter#…

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.

Call `markNeedsPaint` when adding overlayChild to `Overlay` (#135941)

Navigation Menu

Repository navigation

Tooltip doesn't disappear when wrapped inside MouseRegion (Web) #134656

Is there an existing issue for this?

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Tooltip doesn't disappear when wrapped inside MouseRegion (Web) #134656

Description

Is there an existing issue for this?

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Activity

dam-ease commented on Sep 14, 2023

huycozy commented on Sep 20, 2023

github-actions commented on Oct 23, 2023

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions