Stack backend config dialog actions on narrow screens

The Test/Cancel/Save row was scaled down uniformly by a FittedBox on
narrow phones, making the buttons tiny. Lay them out at full size in a
Row on wide screens and stack them vertically (Test, Save, Cancel) on
narrow ones.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
rzuasti
2026-06-22 11:56:10 -04:00
co-authored by Claude Opus 4.8
parent a052c67eb6
commit ecc9a34504
2 changed files with 119 additions and 56 deletions
@@ -159,6 +159,31 @@ void main() {
expect(PrefUtil.getValue('base_url', ''), 'http://my.server/api');
});
testWidgets('stacks full-size action buttons on a narrow screen', (
tester,
) async {
// Pump on a narrow phone surface so the three-button action row can't fit.
await pumpScreen(tester, const Settings(), size: const Size(360, 800));
await tester.pump(const Duration(milliseconds: 10));
await tester.tap(find.widgetWithText(TextButton, 'Re-configure'));
await tester.pumpAndSettle();
final testButton = find.widgetWithText(FilledButton, 'Test');
final saveButton = find.widgetWithText(FilledButton, 'Save');
// Test on top, Save below it: the buttons are stacked, not squeezed into a
// single shrunken row.
expect(
tester.getTopLeft(testButton).dy,
lessThan(tester.getTopLeft(saveButton).dy),
);
// Each button is laid out at a comfortable, full-size width rather than
// being scaled down to a tiny sliver.
expect(tester.getSize(saveButton).width, greaterThan(200));
expect(tester.getSize(testButton).width, greaterThan(200));
});
testWidgets('first run auto-opens a non-dismissible dialog', (tester) async {
await PrefUtil.setValue('base_url', '');
await pumpScreen(tester, const Settings());