diff --git a/packages/flutter/lib/src/cupertino/bottom_tab_bar.dart b/packages/flutter/lib/src/cupertino/bottom_tab_bar.dart index 47d357531f..f1ab44d746 100644 --- a/packages/flutter/lib/src/cupertino/bottom_tab_bar.dart +++ b/packages/flutter/lib/src/cupertino/bottom_tab_bar.dart @@ -4,6 +4,8 @@ import 'dart:ui' show ImageFilter; +import 'package:flutter/foundation.dart'; +import 'package:flutter/rendering.dart'; import 'package:flutter/widgets.dart'; import 'colors.dart'; @@ -235,14 +237,17 @@ class CupertinoTabBar extends StatelessWidget implements PreferredSizeWidget { tabIndex: index + 1, tabCount: items.length, ), - child: GestureDetector( - behavior: HitTestBehavior.opaque, - onTap: onTap == null ? null : () { onTap!(index); }, - child: Padding( - padding: const EdgeInsets.only(bottom: 4.0), - child: Column( - mainAxisAlignment: MainAxisAlignment.end, - children: _buildSingleTabItem(items[index], active), + child: MouseRegion( + cursor: kIsWeb ? SystemMouseCursors.click : MouseCursor.defer, + child: GestureDetector( + behavior: HitTestBehavior.opaque, + onTap: onTap == null ? null : () { onTap!(index); }, + child: Padding( + padding: const EdgeInsets.only(bottom: 4.0), + child: Column( + mainAxisAlignment: MainAxisAlignment.end, + children: _buildSingleTabItem(items[index], active), + ), ), ), ), diff --git a/packages/flutter/test/cupertino/bottom_tab_bar_test.dart b/packages/flutter/test/cupertino/bottom_tab_bar_test.dart index f024aba864..cf97a6b9db 100644 --- a/packages/flutter/test/cupertino/bottom_tab_bar_test.dart +++ b/packages/flutter/test/cupertino/bottom_tab_bar_test.dart @@ -5,6 +5,8 @@ import 'dart:typed_data'; import 'package:flutter/cupertino.dart'; +import 'package:flutter/foundation.dart'; +import 'package:flutter/gestures.dart'; import 'package:flutter/rendering.dart'; import 'package:flutter_test/flutter_test.dart'; @@ -568,4 +570,41 @@ Future main() async { decoratedBoxHiddenBorder.decoration as BoxDecoration; expect(boxDecorationHiddenBorder.border, isNull); }); + + testWidgets('Hovering over tab bar item updates cursor to clickable on Web', (WidgetTester tester) async { + await pumpWidgetWithBoilerplate( + tester, + MediaQuery( + data: const MediaQueryData(), + child: Center( + child: CupertinoTabBar( + items: const [ + BottomNavigationBarItem( + icon: Icon(CupertinoIcons.alarm), + label: 'Tab 1', + ), + BottomNavigationBarItem( + icon: Icon(CupertinoIcons.app_badge), + label: 'Tab 2', + ), + ], + ), + ), + ), + ); + + final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse, pointer: 1); + await gesture.addPointer(location: const Offset(10, 10)); + await tester.pumpAndSettle(); + expect(RendererBinding.instance.mouseTracker.debugDeviceActiveCursor(1), SystemMouseCursors.basic); + + final Offset tabItem = tester.getCenter(find.text('Tab 1')); + await gesture.moveTo(tabItem); + addTearDown(gesture.removePointer); + await tester.pumpAndSettle(); + expect( + RendererBinding.instance.mouseTracker.debugDeviceActiveCursor(1), + kIsWeb ? SystemMouseCursors.click : SystemMouseCursors.basic, + ); + }); }