Flutter Driver: Test BottomNavigationBarItem - dart

Question

how do I test BottomNavigationBarItems via FlutterDriver?
FlutterDriver allows accessing Widgets via text, byValueKey, byTooltip and byType.
But none of these methods work out for my App because of following reasons:
text: The App is localized and I need to test the App in multiple languages.
byValueKey: BottomNavigationBarItems do not have key properties.
byTooltip: BottomNavigationBarItems do not have toolTip properties.
byType: byType only returns the first match of the type and no list (needed because I have multiple tabs).
Thank you very much!
Cheers.

Answer 1

Not sure if you have found answer for this question, but I am going to post a solution here which works for me. Basically, BottomNavigationBar has a key property which you need to use. Once Flutter Driver identifies this key, then you can tell driver to tap on any of its child items ie BottomNavigationBarItem.
My screen has 2 bottomNavigationBarItems as shown below and I defined key for their parent widget ie BottomNavigationBar as:
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.shifting,
key: Key('bottom'),
items: [
BottomNavigationBarItem(
icon: Icon(Icons.ac_unit, color: Colors.green,),
title: Text('First', style: TextStyle(color: Colors.black),)
),
BottomNavigationBarItem(
icon: Icon(Icons.cast, color: Colors.yellow,),
title: Text('Second', style: TextStyle(color: Colors.black),)
)
],
),
And I wrote a flutter driver test to tap on both items which worked perfectly.
test('bottomnavigationbar test', () async {
await driver.waitFor(find.byValueKey('bottom'));
await driver.tap(find.text('First'));
print('clicked on first');
await driver.tap(find.text('Second'));
print('clicked on second too');
});
Result:

Answer 2

As mentioned by #bsr and #user12563357- you can use the key on Text widget:
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.shifting,
key: Key('bottom'),
items: [
BottomNavigationBarItem(
icon: Icon(Icons.ac_unit),
title: Text('First', key: Key('first'),)
),
BottomNavigationBarItem(
icon: Icon(Icons.cast),
title: Text('Second', key: Key('second'),)
)
],
),
and find the text to click on the bar item in test:
final firstItem = find.byValueKey('first');
await driver.tap(firstItem);
btw: you can also find BottomNavigationBarItem using find.ancestor
find.ancestor(of: firstItem, matching: find.byType("BottomNavigationBarItem"));
but you can't tap on it.

Answer 3

You have two options - byIcon or with text by getting the localization from the context.
You can get the state of any kind of StatefulWidget.
final MyWidgetState state = tester.state(find.byType(MyWidget));
with this you can get the context and with that the current localizaion.
final l10n = AppLocalizations.of(state.context);
await tester.tap(find.text(l10n.youTitle));
One other option is to get the widget by Icon:
await tester.tap(find.byIcon(Icons.your_icon));

Answer 4

bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.shifting,
key: Key(`bottom`),
items: [
BottomNavigationBarItem(
icon: Icon(Icons.ac_unit, color: Colors.green,),
title: InkWell(child:Text(`First`, style: TextStyle(color: Colors.black),key:Key(`First`)),)
),
BottomNavigationBarItem(
icon: Icon(Icons.cast, color: Colors.yellow,),
title: InkWell(child:Text(`Second`, style: TextStyle(color: Colors.black),key:Key(`Second`)),)
)
],
),
test(`bottomnavigationbar test`, () async {
await driver.waitFor(find.byValueKey(`bottom`));
await driver.tap(find.byValueKey(`First`));
print('clicked on first');
await driver.tap(find.byValueKey(`Second`));
print('clicked on second too');
});