How to use find.ancestor & descendant in flutter integration test to find elements?

Question

I have flutter widget created with below code, where Tabs are being created as shown below code snippet without having keys in it.

How to find Settings tab & click on it? Can this be done using ancestor or descendant?

Here is the image of the tabs

Here is the app code snippet.

// Imports...


class BottomNavigation extends StatelessWidget {
  final TabItem currentTab;
  final ValueChanged<TabItem> selectedTab;

  const BottomNavigation({
    super.key,
    required this.currentTab,
    required this.selectedTab,
  });

  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      currentIndex: TabItem.values.indexOf(currentTab),
      type: BottomNavigationBarType.fixed,
      items: [
        _buildItem(TabItem.home, context),
        _buildItem(TabItem.creditHealth, context),
        _buildItem(TabItem.setting, context),
      ],
      onTap: (index) => selectedTab(
        TabItem.values[index],
      ),
    );
  }

  BottomNavigationBarItem _buildItem(
    TabItem item,
    BuildContext context
    // var toolTip,
  ) {
    return BottomNavigationBarItem(
      // tooltip: toolTip,
      icon: SvgPicture.asset(
        svgF(tabIcons[item]!),
      ),
      label: context.translate(
        tabNameKeys[item]!,
      ),
    );
  }
}

Answer 1

You should be able to tap by text:

import 'package:flutter_test/flutter_test.dart'

void main() {
  testWidgets('signs up', (WidgetTester tester) async {
    await tester.pumpWidget(YourApp());
    await tester.tap(find.text('Settings'));
}

If you support languages other than English, then it's prudent to assign a key to the widgets you want to interact with, and then use these keys in tests.

// widget code
BottomNavigationBarItem(
  key: Key('settings'),
  icon: SvgPicture.asset(svgF(tabIcons[item]!)),
  label: context.translate(tabNameKeys[item]!),
);

// test code
await tester.tap(find.byKey(Key('settings')));