Last active
September 13, 2020 01:07
-
-
Save Nash0x7E2/ed4788a52174c1df9ec2047671a85d3f to your computer and use it in GitHub Desktop.
Sample code for meant to demonstrating writing simple widget test for your applications. Code used as part of an upcoming Flutter testing talk by @mkiisoft and myself.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
const kBreakpoint = 860.0; | |
extension Width on BuildContext { | |
double get width => MediaQuery.of(this).size.width; | |
} | |
void main() { | |
runApp( | |
MaterialApp( | |
home: ExamplePage(), | |
), | |
); | |
} | |
class ExamplePage extends StatelessWidget { | |
final GlobalKey<ScaffoldState> scaffoldKey = GlobalKey(); | |
final List<String> _items = [ | |
"Item One", | |
"Item Two", | |
]; | |
Widget _buildNavItem(String item) { | |
return Padding( | |
padding: const EdgeInsets.all(8.0), | |
child: RaisedButton( | |
color: Colors.redAccent, | |
onPressed: () {}, | |
child: Text( | |
item, | |
style: TextStyle(color: Colors.white), | |
), | |
), | |
); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
key: scaffoldKey, | |
appBar: ExampleAppBar( | |
scaffoldKey: scaffoldKey, | |
menuItems: _items.map((item) => _buildNavItem(item)).toList(), | |
), | |
body: Container( | |
child: Center( | |
child: Text("Hello"), | |
), | |
), | |
drawer: context.width <= kBreakpoint | |
? Drawer( | |
child: Column( | |
children: _items | |
.map( | |
(item) => ListTile( | |
title: Text(item), | |
), | |
) | |
.toList(), | |
), | |
) | |
: null, | |
); | |
} | |
} | |
class ExampleAppBar extends StatefulWidget implements PreferredSizeWidget { | |
const ExampleAppBar({ | |
Key key, | |
@required this.menuItems, | |
@required this.scaffoldKey, | |
}) : assert(menuItems != null), | |
assert(menuItems.length > 1), | |
super(key: key); | |
final List<Widget> menuItems; | |
final GlobalKey<ScaffoldState> scaffoldKey; | |
@override | |
ExampleAppBarState createState() => ExampleAppBarState(); | |
@override | |
Size get preferredSize => Size.fromHeight(80.0); | |
} | |
class ExampleAppBarState extends State<ExampleAppBar> { | |
@override | |
Widget build(BuildContext context) { | |
return LayoutBuilder( | |
builder: (context, dimens) { | |
return Container( | |
color: Colors.redAccent, | |
padding: const EdgeInsets.all(12), | |
child: Row( | |
children: [ | |
if (context.width > kBreakpoint) ...widget.menuItems, | |
if (context.width <= kBreakpoint) | |
IconButton( | |
icon: Icon(Icons.subject), | |
color: Colors.white, | |
onPressed: () => widget.scaffoldKey.currentState.openDrawer(), | |
), | |
Spacer(), | |
AnimatedSwitcher( | |
duration: const Duration(milliseconds: 300), | |
child: InkWell( | |
onTap: () {}, | |
child: Icon( | |
Icons.account_circle, | |
color: Colors.white, | |
size: 36.0, | |
), | |
), | |
) | |
], | |
), | |
); | |
}, | |
); | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
import 'package:flutter_sandbox/responsive_appbar/appbar_example.dart'; | |
import 'package:flutter_test/flutter_test.dart'; | |
Widget materialWidget(Widget child) { | |
return MaterialApp( | |
home: child, | |
); | |
} | |
void main() { | |
group( | |
"AppBar", | |
() { | |
testWidgets( | |
"AppBar item shows on large devices", | |
(WidgetTester tester) async { | |
final widget = MediaQuery( | |
data: MediaQueryData(size: Size(900.0, 1200.0)), | |
child: ExamplePage(), | |
); | |
// First build | |
await tester.pumpWidget(materialWidget(widget)); | |
// Create finders | |
final Finder firstItemFinder = find.text("Item One"); | |
final Finder secondItemFinder = find.text("Item Two"); | |
// Expectations | |
expect(firstItemFinder, findsOneWidget); | |
expect(secondItemFinder, findsOneWidget); | |
}, | |
); | |
testWidgets( | |
"AppBar item does not show on small devices", | |
(WidgetTester tester) async { | |
final widget = MediaQuery( | |
data: MediaQueryData(size: Size(600.0, 600.0)), | |
child: ExamplePage(), | |
); | |
await tester.pumpWidget(materialWidget(widget)); | |
final Finder firstItemFinder = find.text("Item One"); | |
final Finder secondItemFinder = find.text("Item Two"); | |
expect(firstItemFinder, findsNothing); | |
expect(secondItemFinder, findsNothing); | |
}, | |
); | |
}, | |
); | |
group( | |
"Page drawer", | |
() { | |
testWidgets( | |
"Drawer icon is not visible on large screens", | |
(WidgetTester tester) async { | |
final widget = MediaQuery( | |
data: MediaQueryData(size: Size(900.0, 1200.0)), | |
child: ExamplePage(), | |
); | |
await tester.pumpWidget(materialWidget(widget)); | |
final Finder iconFinder = find.byIcon(Icons.subject); | |
expect(iconFinder, findsNothing); | |
}, | |
); | |
testWidgets( | |
"Drawer icon is visible on large screens", | |
(WidgetTester tester) async { | |
final widget = MediaQuery( | |
data: MediaQueryData(size: Size(600.0, 600.0)), | |
child: ExamplePage(), | |
); | |
await tester.pumpWidget(materialWidget(widget)); | |
final Finder iconFinder = find.byIcon(Icons.subject); | |
expect(iconFinder, findsOneWidget); | |
}, | |
); | |
testWidgets( | |
"Drawer items is visible on large screens", | |
(WidgetTester tester) async { | |
final widget = MediaQuery( | |
data: MediaQueryData(size: Size(600.0, 600.0)), | |
child: ExamplePage(), | |
); | |
await tester.pumpWidget(materialWidget(widget)); | |
final Finder iconFinder = find.byIcon(Icons.subject); | |
await tester.tap(iconFinder); | |
await tester.pumpAndSettle(); | |
final Finder firstItemFinder = find.text("Item One"); | |
final Finder secondItemFinder = find.text("Item Two"); | |
expect(firstItemFinder, findsOneWidget); | |
expect(secondItemFinder, findsOneWidget); | |
}, | |
); | |
}, | |
); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment