Skip to content

F
Front-End
Unverified Commit f3a7485b authored by Taha Tesser's avatar Taha Tesser Committed by GitHub
Browse files
Options

Update `RadioListTile` tests to M3 (#129718) 

This updates the `RadioListTile` test which was modified in https://github.com/flutter/flutter/pull/128839

### Description
- Update the layout to the proper order `MaterialApp` -> `Material` -> `RadioListTile`
- Add M3 overlay test. (fixed problem faced in https://github.com/flutter/flutter/pull/128839)
- Separate the M2  overlay test.
parent cd97b439
Hide whitespace changes
Inline Side-by-side
Showing with 220 additions and 48 deletions
packages/flutter/test/material/radio_list_tile_test.dart
View file @ f3a7485b
...@@ -1016,8 +1016,7 @@ void main() { ...@@ -1016,8 +1016,7 @@ void main() {
tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional; tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional;
int? groupValue = 0; int? groupValue = 0;
final Color? hoverColor = Colors.orange[500]; final Color? hoverColor = Colors.orange[500];
final ThemeData theme = ThemeData(); final ThemeData theme = ThemeData(useMaterial3: true);
final bool material3 = theme.useMaterial3;
Widget buildApp({bool enabled = true}) { Widget buildApp({bool enabled = true}) {
return wrap( return wrap(
child: MaterialApp( child: MaterialApp(
...@@ -1045,8 +1044,8 @@ void main() { ...@@ -1045,8 +1044,8 @@ void main() {
Material.of(tester.element(find.byType(Radio<int>))), Material.of(tester.element(find.byType(Radio<int>))),
paints paints
..rect() ..rect()
..circle(color: material3 ? theme.colorScheme.primary : const Color(0xff2196f3)) ..circle(color: theme.colorScheme.primary)
..circle(color: material3 ? theme.colorScheme.primary : const Color(0xff2196f3)), ..circle(color: theme.colorScheme.primary),
); );
// Start hovering // Start hovering
...@@ -1074,8 +1073,8 @@ void main() { ...@@ -1074,8 +1073,8 @@ void main() {
Material.of(tester.element(find.byType(Radio<int>))), Material.of(tester.element(find.byType(Radio<int>))),
paints paints
..rect() ..rect()
..circle(color: material3 ? theme.colorScheme.onSurface.withOpacity(0.38) : const Color(0x61000000)) ..circle(color: theme.colorScheme.onSurface.withOpacity(0.38))
..circle(color: material3 ? theme.colorScheme.onSurface.withOpacity(0.38) : const Color(0x61000000)), ..circle(color: theme.colorScheme.onSurface.withOpacity(0.38)),
); );
}); });
...@@ -1101,13 +1100,11 @@ void main() { ...@@ -1101,13 +1100,11 @@ void main() {
return null; return null;
} }
final ThemeData theme = ThemeData(useMaterial3: false);
final bool material3 = theme.useMaterial3;
Widget buildRadio({bool active = false, bool useOverlay = true}) { Widget buildRadio({bool active = false, bool useOverlay = true}) {
return wrap( return MaterialApp(
child: MaterialApp( theme: ThemeData(useMaterial3: true),
theme: theme, home: Material(
home: RadioListTile<bool>( child: RadioListTile<bool>(
value: active, value: active,
groupValue: true, groupValue: true,
onChanged: (_) { }, onChanged: (_) { },
...@@ -1125,13 +1122,13 @@ void main() { ...@@ -1125,13 +1122,13 @@ void main() {
expect( expect(
Material.of(tester.element(find.byType(Radio<bool>))), Material.of(tester.element(find.byType(Radio<bool>))),
material3 ? (paints..circle( paints
color: fillColor.withAlpha(kRadialReactionAlpha), ..rect(color: const Color(0x00000000))
radius: 20, ..rect(color: const Color(0x66bcbcbc))
)) : (paints..circle()..circle( ..circle(
color: fillColor.withAlpha(kRadialReactionAlpha), color: fillColor.withAlpha(kRadialReactionAlpha),
radius: 20, radius: 20.0,
)), ),
reason: 'Default inactive pressed Radio should have overlay color from fillColor', reason: 'Default inactive pressed Radio should have overlay color from fillColor',
); );
...@@ -1141,13 +1138,13 @@ void main() { ...@@ -1141,13 +1138,13 @@ void main() {
expect( expect(
Material.of(tester.element(find.byType(Radio<bool>))), Material.of(tester.element(find.byType(Radio<bool>))),
material3 ? (paints..circle( paints
color: fillColor.withAlpha(kRadialReactionAlpha), ..rect(color: const Color(0x00000000))
radius: 20, ..rect(color: const Color(0x66bcbcbc))
)) : (paints..circle()..circle( ..circle(
color: fillColor.withAlpha(kRadialReactionAlpha), color: fillColor.withAlpha(kRadialReactionAlpha),
radius: 20, radius: 20.0,
)), ),
reason: 'Default active pressed Radio should have overlay color from fillColor', reason: 'Default active pressed Radio should have overlay color from fillColor',
); );
...@@ -1157,13 +1154,13 @@ void main() { ...@@ -1157,13 +1154,13 @@ void main() {
expect( expect(
Material.of(tester.element(find.byType(Radio<bool>))), Material.of(tester.element(find.byType(Radio<bool>))),
material3 ? (paints..circle( paints
color: inactivePressedOverlayColor, ..rect(color: const Color(0x00000000))
radius: 20, ..rect(color: const Color(0x66bcbcbc))
)) : (paints..circle()..circle( ..circle(
color: inactivePressedOverlayColor, color: inactivePressedOverlayColor,
radius: 20, radius: 20.0,
)), ),
reason: 'Inactive pressed Radio should have overlay color: $inactivePressedOverlayColor', reason: 'Inactive pressed Radio should have overlay color: $inactivePressedOverlayColor',
); );
...@@ -1173,17 +1170,17 @@ void main() { ...@@ -1173,17 +1170,17 @@ void main() {
expect( expect(
Material.of(tester.element(find.byType(Radio<bool>))), Material.of(tester.element(find.byType(Radio<bool>))),
material3 ? (paints..circle( paints
color: activePressedOverlayColor, ..rect(color: const Color(0x00000000))
radius: 20, ..rect(color: const Color(0x66bcbcbc))
)) : (paints..circle()..circle( ..circle(
color: activePressedOverlayColor, color: activePressedOverlayColor,
radius: 20, radius: 20.0,
)), ),
reason: 'Active pressed Radio should have overlay color: $activePressedOverlayColor', reason: 'Active pressed Radio should have overlay color: $activePressedOverlayColor',
); );
// Start hovering // Start hovering.
final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse); final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse);
await gesture.addPointer(); await gesture.addPointer();
await gesture.moveTo(tester.getCenter(find.byType(Radio<bool>))); await gesture.moveTo(tester.getCenter(find.byType(Radio<bool>)));
...@@ -1195,13 +1192,13 @@ void main() { ...@@ -1195,13 +1192,13 @@ void main() {
expect( expect(
Material.of(tester.element(find.byType(Radio<bool>))), Material.of(tester.element(find.byType(Radio<bool>))),
material3 ? (paints..circle( paints
color: hoverOverlayColor, ..rect(color: const Color(0x00000000))
radius: 20, ..rect(color: const Color(0x0a000000))
)) : (paints..circle( ..circle(
color: hoverOverlayColor, color: hoverOverlayColor,
radius: 20, radius: 20.0,
)), ),
reason: 'Hovered Radio should use overlay color $hoverOverlayColor over $hoverColor', reason: 'Hovered Radio should use overlay color $hoverOverlayColor over $hoverColor',
); );
}); });
...@@ -1336,4 +1333,179 @@ void main() { ...@@ -1336,4 +1333,179 @@ void main() {
expect(feedback.hapticCount, 0); expect(feedback.hapticCount, 0);
}); });
}); });
group('Material 2', () {
// These tests are only relevant for Material 2. Once Material 2
// support is deprecated and the APIs are removed, these tests
// can be deleted.
testWidgets('RadioListTile respects overlayColor in active/pressed/hovered states', (WidgetTester tester) async {
tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional;
const Color fillColor = Color(0xFF000000);
const Color activePressedOverlayColor = Color(0xFF000001);
const Color inactivePressedOverlayColor = Color(0xFF000002);
const Color hoverOverlayColor = Color(0xFF000003);
const Color hoverColor = Color(0xFF000005);
Color? getOverlayColor(Set<MaterialState> states) {
if (states.contains(MaterialState.pressed)) {
if (states.contains(MaterialState.selected)) {
return activePressedOverlayColor;
}
return inactivePressedOverlayColor;
}
if (states.contains(MaterialState.hovered)) {
return hoverOverlayColor;
}
return null;
}
Widget buildRadio({bool active = false, bool useOverlay = true}) {
return MaterialApp(
theme: ThemeData(useMaterial3: false),
home: Material(
child: RadioListTile<bool>(
value: active,
groupValue: true,
onChanged: (_) { },
fillColor: const MaterialStatePropertyAll<Color>(fillColor),
overlayColor: useOverlay ? MaterialStateProperty.resolveWith(getOverlayColor) : null,
hoverColor: hoverColor,
),
),
);
}
await tester.pumpWidget(buildRadio(useOverlay: false));
await tester.press(find.byType(Radio<bool>));
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<bool>))),
paints
..circle()
..circle(
color: fillColor.withAlpha(kRadialReactionAlpha),
radius: 20,
),
reason: 'Default inactive pressed Radio should have overlay color from fillColor',
);
await tester.pumpWidget(buildRadio(active: true, useOverlay: false));
await tester.press(find.byType(Radio<bool>));
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<bool>))),
paints
..circle()
..circle(
color: fillColor.withAlpha(kRadialReactionAlpha),
radius: 20,
),
reason: 'Default active pressed Radio should have overlay color from fillColor',
);
await tester.pumpWidget(buildRadio());
await tester.press(find.byType(Radio<bool>));
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<bool>))),
paints
..circle()
..circle(
color: inactivePressedOverlayColor,
radius: 20,
),
reason: 'Inactive pressed Radio should have overlay color: $inactivePressedOverlayColor',
);
// Start hovering.
final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse);
await gesture.addPointer();
await gesture.moveTo(tester.getCenter(find.byType(Radio<bool>)));
await tester.pumpAndSettle();
await tester.pumpWidget(Container());
await tester.pumpWidget(buildRadio());
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<bool>))),
paints
..circle(
color: hoverOverlayColor,
radius: 20,
),
reason: 'Hovered Radio should use overlay color $hoverOverlayColor over $hoverColor',
);
});
testWidgets('RadioListTile respects hoverColor', (WidgetTester tester) async {
tester.binding.focusManager.highlightStrategy = FocusHighlightStrategy.alwaysTraditional;
int? groupValue = 0;
final Color? hoverColor = Colors.orange[500];
Widget buildApp({bool enabled = true}) {
return wrap(
child: MaterialApp(
theme: ThemeData(useMaterial3: false),
home: StatefulBuilder(builder: (BuildContext context, StateSetter setState) {
return RadioListTile<int>(
value: 0,
onChanged: enabled ? (int? newValue) {
setState(() {
groupValue = newValue;
});
} : null,
hoverColor: hoverColor,
groupValue: groupValue,
);
}),
),
);
}
await tester.pumpWidget(buildApp());
await tester.pump();
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<int>))),
paints
..rect()
..circle(color:const Color(0xff2196f3))
..circle(color:const Color(0xff2196f3)),
);
// Start hovering
final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse);
await gesture.moveTo(tester.getCenter(find.byType(Radio<int>)));
// Check when the radio isn't selected.
groupValue = 1;
await tester.pumpWidget(buildApp());
await tester.pump();
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<int>))),
paints
..rect()
..circle(color: hoverColor)
);
// Check when the radio is selected, but disabled.
groupValue = 0;
await tester.pumpWidget(buildApp(enabled: false));
await tester.pump();
await tester.pumpAndSettle();
expect(
Material.of(tester.element(find.byType(Radio<int>))),
paints
..rect()
..circle(color:const Color(0x61000000))
..circle(color:const Color(0x61000000)),
);
});
});
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

HIAST - GitLab