I have widget that act as a home layout. The layout is simple, its just a navigation bar on bottom for mobile and side for web. Thats why I need to test which nav bar are rendered based on those condition.
class HomeLayout extends StatelessWidget {
const HomeLayout({
Key? key,
this.child,
}) : super(key: key);
final Widget? child;
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (_, constraints) {
if (constraints.maxWidth >= 600) {
return _WideDeviceLayout(child: child); // render NavigationRail
}
return _ThinDeviceLayout(child: child); // render BottomNavigationBar
},
);
}
}
I already trying to use tester.view.physicalSize
to stub the tester view. It works on the first test, but the second test will fail because the BottomNavigationBar
keeps rendered.
group('HomeLayout widget', () {
group('on Thin Device (width < 600)', () {
testWidgets('should render BottomNavigationBar', (tester) async {
await tester.pumpWidget(testWidget);
tester.view.physicalSize = const Size(412, 915);
await tester.pumpAndSettle();
expect(
tester.widget(_WidgetFinders.navBar),
isA<BottomNavigationBar>(),
);
});
});
group('on Wide Device (width >= 600)', () {
testWidgets('should render NavigationRail', (tester) async {
await tester.pumpWidget(testWidget);
tester.view.physicalSize = const Size(1024, 600);
await tester.pumpAndSettle();
expect(tester.widget(_WidgetFinders.navBar), isA<NavigationRail>());
});
});
});
Before using the tester.view.physicalSize
(just directly expect with just pumpWidget
), the first test will fail and the second test will succeed. That means the tester default Size.width
is above 600.
Is there something wrong on my test file?