Files
apidash/test/providers/ui_providers_test.dart
2024-10-21 09:44:58 +05:30

691 lines
22 KiB
Dart

//import 'package:spot/spot.dart';
import 'package:apidash/providers/providers.dart';
import 'package:apidash/screens/common_widgets/common_widgets.dart';
import 'package:apidash/screens/dashboard.dart';
import 'package:apidash/screens/envvar/environment_page.dart';
import 'package:apidash/screens/home_page/collection_pane.dart';
import 'package:apidash/screens/home_page/editor_pane/details_card/response_pane.dart';
import 'package:apidash/screens/home_page/editor_pane/editor_default.dart';
import 'package:apidash/screens/home_page/editor_pane/editor_pane.dart';
import 'package:apidash/screens/home_page/editor_pane/url_card.dart';
import 'package:apidash/screens/home_page/home_page.dart';
import 'package:apidash/screens/settings_page.dart';
import 'package:apidash/screens/history/history_page.dart';
import 'package:apidash/widgets/widgets.dart';
import 'package:extended_text_field/extended_text_field.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
// import 'package:flutter/services.dart';
import 'package:flutter_portal/flutter_portal.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_test/flutter_test.dart';
import '../extensions/widget_tester_extensions.dart';
import '../test_consts.dart';
import 'helpers.dart';
void main() {
TestWidgetsFlutterBinding.ensureInitialized();
setUp(() async {
await testSetUpTempDirForHive();
// FIXME: Font file moved to design system so this must be fixed if spot screenshot is used
// final flamante = rootBundle.load('google_fonts/OpenSans-Medium.ttf');
// final fontLoader = FontLoader('OpenSans')..addFont(flamante);
// await fontLoader.load();
});
group('Testing navRailIndexStateProvider', () {
testWidgets('Dashboard should display correct initial page',
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: Dashboard(),
),
),
);
// Verify that the HomePage is displayed initially
expect(find.byType(HomePage), findsOneWidget);
expect(find.byType(EnvironmentPage), findsNothing);
expect(find.byType(HistoryPage), findsNothing);
expect(find.byType(SettingsPage), findsNothing);
});
testWidgets(
"Dashboard should display EnvironmentPage when navRailIndexStateProvider is 1",
(WidgetTester tester) async {
await tester.pumpWidget(
ProviderScope(
overrides: [
navRailIndexStateProvider.overrideWith((ref) => 1),
],
child: const MaterialApp(
home: Dashboard(),
),
),
);
// Verify that the EnvironmentPage is displayed
expect(find.byType(HomePage), findsNothing);
expect(find.byType(EnvironmentPage), findsOneWidget);
expect(find.byType(HistoryPage), findsNothing);
expect(find.byType(SettingsPage), findsNothing);
});
testWidgets(
"Dashboard should display HistorPage when navRailIndexStateProvider is 2",
(WidgetTester tester) async {
await tester.pumpWidget(
ProviderScope(
overrides: [
navRailIndexStateProvider.overrideWith((ref) => 2),
],
child: const Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Verify that the SettingsPage is displayed
expect(find.byType(HomePage), findsNothing);
expect(find.byType(EnvironmentPage), findsNothing);
expect(find.byType(HistoryPage), findsOneWidget);
expect(find.byType(SettingsPage), findsNothing);
});
testWidgets(
"Dashboard should display SettingsPage when navRailIndexStateProvider is 3",
(WidgetTester tester) async {
await tester.pumpWidget(
ProviderScope(
overrides: [
navRailIndexStateProvider.overrideWith((ref) => 3),
],
child: const Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Verify that the SettingsPage is displayed
expect(find.byType(HomePage), findsNothing);
expect(find.byType(EnvironmentPage), findsNothing);
expect(find.byType(HistoryPage), findsNothing);
expect(find.byType(SettingsPage), findsOneWidget);
});
testWidgets(
'navRailIndexStateProvider should update when icon button is pressed',
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Tap on the Settings icon
await tester.tap(find.byIcon(Icons.settings_outlined));
await tester.pump();
// Verify that the navRailIndexStateProvider is updated
final dashboard = tester.element(find.byType(Dashboard));
final container = ProviderScope.containerOf(dashboard);
expect(container.read(navRailIndexStateProvider), 3);
});
testWidgets(
'navRailIndexStateProvider should persist across widget rebuilds',
(tester) async {
// Pump the initial widget tree
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Tap on the Settings icon to change the index to 3
await tester.tap(find.byIcon(Icons.settings_outlined));
await tester.pump();
// Rebuild the widget tree with the same ProviderScope
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Verify that the navRailIndexStateProvider still has the updated value
final dashboard = tester.element(find.byType(Dashboard));
final container = ProviderScope.containerOf(dashboard);
expect(container.read(navRailIndexStateProvider), 3);
// Verify that the SettingsPage is still displayed after the rebuild
expect(find.byType(SettingsPage), findsOneWidget);
expect(find.byType(HomePage), findsNothing);
expect(find.byType(EnvironmentPage), findsNothing);
});
testWidgets(
'UI should update correctly when navRailIndexStateProvider changes',
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Grab the Dashboard widget and its ProviderContainer
final dashboard = tester.element(find.byType(Dashboard));
final container = ProviderScope.containerOf(dashboard);
// Go to EnvironmentPage
container.read(navRailIndexStateProvider.notifier).state = 1;
await tester.pump();
// Verify that the EnvironmentPage is displayed
expect(find.byType(EnvironmentPage), findsOneWidget);
// Verify that the selected icon is the filled version (selectedIcon)
expect(find.byIcon(Icons.laptop_windows), findsOneWidget);
// Go to HistoryPage
container.read(navRailIndexStateProvider.notifier).state = 2;
await tester.pump();
// Verify that the HistoryPage is displayed
expect(find.byType(HistoryPage), findsOneWidget);
// Verify that the selected icon is the filled version (selectedIcon)
expect(find.byIcon(Icons.history_rounded), findsOneWidget);
// Go to SettingsPage
container.read(navRailIndexStateProvider.notifier).state = 3;
await tester.pump();
// Verify that the SettingsPage is displayed
expect(find.byType(SettingsPage), findsOneWidget);
// Verify that the selected icon is the filled version (selectedIcon)
expect(find.byIcon(Icons.settings), findsOneWidget);
});
testWidgets(
'navRailIndexStateProvider should be disposed when Dashboard is removed',
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Dashboard(),
),
),
),
);
// Grab the Dashboard widget and its ProviderContainer
final dashboard = tester.element(find.byType(Dashboard));
final container = ProviderScope.containerOf(dashboard);
// Pumping a different widget to remove the Dashboard from the widget tree
await tester.pumpWidget(
const MaterialApp(
home: Scaffold(body: Text('Different Widget')),
),
);
// Verify that the ProviderContainer has been disposed
// by trying to read from disposed container
bool isDisposed = false;
try {
container.read(navRailIndexStateProvider);
} catch (e) {
isDisposed = true;
}
expect(isDisposed, true);
});
});
group("Testing selectedIdEditStateProvider", () {
testWidgets('It should have an initial value of null', (tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: Scaffold(
body: CollectionPane(),
),
),
),
);
// Verify that the initial value is null
final collectionPane = tester.element(find.byType(CollectionPane));
final container = ProviderScope.containerOf(collectionPane);
expect(container.read(selectedIdEditStateProvider), null);
});
testWidgets(
'selectedIdEditStateProvider should not be null after Duplicate button has been tapped',
(tester) async {
await tester.pumpWidget(
ProviderScope(
child: MaterialApp(
theme: ThemeData(
fontFamily: 'OpenSans',
),
home: const Scaffold(
body: CollectionPane(),
),
),
),
);
final collectionPane = tester.element(find.byType(CollectionPane));
final container = ProviderScope.containerOf(collectionPane);
var orig = container.read(selectedIdStateProvider);
expect(orig, isNotNull);
// Tap on the three dots to open the request card menu
await tester.tap(find.byType(RequestList));
await tester.pump();
await tester.tap(find.byType(RequestItem));
await tester.pump();
//await tester.tap(find.byIcon(Icons.more_vert).at(1));
await tester.tap(
find.byType(RequestItem),
buttons: kSecondaryButton,
);
await tester.pumpAndSettle();
// Tap on the "Duplicate" option in the menu
var byType = find.text('Duplicate', findRichText: true);
expect(byType, findsOneWidget);
await tester.tap(byType);
await tester.pumpAndSettle();
// INFO: Screenshot using spot
// await takeScreenshot();
var dupId = container.read(selectedIdStateProvider);
expect(dupId, isNotNull);
expect(dupId.runtimeType, String);
expect(dupId != orig, isTrue);
});
testWidgets(
'It should be set back to null when user taps outside name editor',
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: Scaffold(
body: CollectionPane(),
),
),
),
);
// Grab the CollectionPane widget and its ProviderContainer
final collectionPane = tester.element(find.byType(CollectionPane));
final container = ProviderScope.containerOf(collectionPane);
// Tap on the three dots to open the request card menu
await tester.tap(find.byType(RequestList));
await tester.pump();
await tester.tap(find.byType(RequestItem));
await tester.pump();
await tester.tap(find.byIcon(Icons.more_vert).at(1));
await tester.pumpAndSettle();
// Tap on the "Rename" option in the menu
await tester.tap(find.text('Rename'));
await tester.pumpAndSettle();
// Verify that the selectedIdEditStateProvider is not null
expect(container.read(selectedIdEditStateProvider), isNotNull);
expect((container.read(selectedIdEditStateProvider)).runtimeType, String);
// Tap on the screen to simulate tapping outside the name editor
await tester.tap(find.byType(CollectionPane));
await tester.pumpAndSettle();
// Verify that the selectedIdEditStateProvider is null
expect(container.read(selectedIdEditStateProvider), null);
});
testWidgets("It should be properly disposed", (tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: Scaffold(
body: CollectionPane(),
),
),
),
);
// Grab the Dashboard widget and its ProviderContainer
final collectionPane = tester.element(find.byType(CollectionPane));
final container = ProviderScope.containerOf(collectionPane);
// Pumping a different widget to remove the CollectionPane from the widget tree
await tester.pumpWidget(
const MaterialApp(
home: Scaffold(body: Text('Foo')),
),
);
// Verify that the ProviderContainer has been disposed
// by trying to read from disposed container
bool isDisposed = false;
try {
container.read(selectedIdEditStateProvider);
} catch (e) {
isDisposed = true;
}
expect(isDisposed, true);
});
});
group('Testing codePaneVisibleStateProvider', () {
testWidgets("It should have have an initial value of false",
(tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: RequestEditorPane(),
),
),
);
// Verify that the initial value is false
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
expect(container.read(codePaneVisibleStateProvider), false);
});
testWidgets("When state is false ResponsePane should be visible",
(tester) async {
await tester.setScreenSize(largeWidthDevice);
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Material(
child: RequestEditorPane(),
),
),
),
),
);
expect(find.byType(RequestEditorDefault), findsOneWidget);
// Tap on the "Plus New" button
Finder plusNewButton = find.descendant(
of: find.byType(RequestEditorDefault),
matching: find.byType(ElevatedButton),
);
await tester.tap(plusNewButton);
await tester.pump();
// Verify that NotSentWidget is visible
expect(find.byType(NotSentWidget), findsOneWidget);
// Add some data in URLTextField
Finder field = find.descendant(
of: find.byType(EnvURLField),
matching: find.byType(ExtendedTextField),
);
await tester.tap(field);
tester.testTextInput.enterText(kTestUrl);
await tester.pump();
// Tap on the "Send" button
Finder sendButton = find.byType(SendRequestButton);
await tester.tap(sendButton);
await tester.pump();
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
expect(container.read(codePaneVisibleStateProvider), false);
expect(find.byType(ResponsePane), findsOneWidget);
});
testWidgets("When state is true CodePane should be visible",
(tester) async {
await tester.setScreenSize(largeWidthDevice);
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Scaffold(
body: RequestEditorPane(),
),
),
),
),
);
expect(find.byType(RequestEditorDefault), findsOneWidget);
// Tap on the "Plus New" button
Finder plusNewButton = find.descendant(
of: find.byType(RequestEditorDefault),
matching: find.byType(ElevatedButton),
);
await tester.tap(plusNewButton);
await tester.pump();
// Verify that NotSentWidget is visible
expect(find.byType(NotSentWidget), findsOneWidget);
// Add some data in URLTextField
Finder field = find.descendant(
of: find.byType(EnvURLField),
matching: find.byType(ExtendedTextField),
);
await tester.tap(field);
tester.testTextInput.enterText(kTestUrl);
await tester.pump();
// Tap on the "Send" button
Finder sendButton = find.byType(SendRequestButton);
await tester.tap(sendButton);
await tester.pump();
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
// Change codePaneVisibleStateProvider state to true
container.read(codePaneVisibleStateProvider.notifier).state = true;
await tester.pump();
// Verify that the CodePane is visible
expect(container.read(codePaneVisibleStateProvider), true);
expect(find.byType(CodePane), findsOneWidget);
});
testWidgets("Hide/View Code button toggles the state", (tester) async {
await tester.setScreenSize(largeWidthDevice);
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Scaffold(
body: RequestEditorPane(),
),
),
),
),
);
expect(find.byType(RequestEditorDefault), findsOneWidget);
// Tap on the "Plus New" button
Finder plusNewButton = find.descendant(
of: find.byType(RequestEditorDefault),
matching: find.byType(ElevatedButton),
);
await tester.tap(plusNewButton);
await tester.pump();
// Verify that NotSentWidget is visible
expect(find.byType(NotSentWidget), findsOneWidget);
// Add some data in URLTextField
Finder field = find.descendant(
of: find.byType(EnvURLField),
matching: find.byType(ExtendedTextField),
);
await tester.tap(field);
tester.testTextInput.enterText(kTestUrl);
await tester.pump();
// Tap on the "Send" button
Finder sendButton = find.byType(SendRequestButton);
await tester.tap(sendButton);
await tester.pump();
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
final bool currentValue = container.read(codePaneVisibleStateProvider);
// Click on View Code button
await tester.tap(find.byIcon(Icons.code_rounded));
await tester.pump();
// Verify that the state value has changed
expect(container.read(codePaneVisibleStateProvider), !currentValue);
final bool newValue = container.read(codePaneVisibleStateProvider);
// Click on Hide Code button
await tester.tap(find.byIcon(Icons.code_off_rounded));
await tester.pump();
// Verify that the state value has changed
expect(container.read(codePaneVisibleStateProvider), !newValue);
});
testWidgets("That state persists across widget rebuilds", (tester) async {
await tester.setScreenSize(largeWidthDevice);
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Scaffold(
body: RequestEditorPane(),
),
),
),
),
);
expect(find.byType(RequestEditorDefault), findsOneWidget);
// Tap on the "Plus New" button
Finder plusNewButton = find.descendant(
of: find.byType(RequestEditorDefault),
matching: find.byType(ElevatedButton),
);
await tester.tap(plusNewButton);
await tester.pump();
// Verify that NotSentWidget is visible
expect(find.byType(NotSentWidget), findsOneWidget);
// Add some data in URLTextField
Finder field = find.descendant(
of: find.byType(EnvURLField),
matching: find.byType(ExtendedTextField),
);
await tester.tap(field);
tester.testTextInput.enterText(kTestUrl);
await tester.pump();
// Tap on the "Send" button
Finder sendButton = find.byType(SendRequestButton);
await tester.tap(sendButton);
await tester.pump();
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
final bool currentValue = container.read(codePaneVisibleStateProvider);
// Click on View Code button
await tester.tap(find.byIcon(Icons.code_rounded));
await tester.pump();
// Verify that the state value has changed
expect(container.read(codePaneVisibleStateProvider), !currentValue);
bool matcher = !currentValue;
// Rebuild the widget tree
await tester.pumpWidget(
const ProviderScope(
child: Portal(
child: MaterialApp(
home: Scaffold(
body: RequestEditorPane(),
),
),
),
),
);
// Verify that the value of codePaneVisibleStateProvider is still true
final containerAfterRebuild = ProviderScope.containerOf(editorPane);
bool actual = containerAfterRebuild.read(codePaneVisibleStateProvider);
expect(actual, matcher);
});
testWidgets("That it is properly disposed", (tester) async {
await tester.pumpWidget(
const ProviderScope(
child: MaterialApp(
home: Scaffold(
body: RequestEditorPane(),
),
),
),
);
// Verify that codePaneVisibleStateProvider is present
final editorPane = tester.element(find.byType(RequestEditorPane));
final container = ProviderScope.containerOf(editorPane);
expect(container.read(codePaneVisibleStateProvider).runtimeType, bool);
// Update the widget tree to dispose the provider
await tester.pumpWidget(const MaterialApp());
// Verify that the provider was disposed
expect(() => container.read(codePaneVisibleStateProvider),
throwsA(isA<StateError>()));
expect(
() => container.read(codePaneVisibleStateProvider),
throwsA(
isA<StateError>().having(
(e) => e.message,
'message',
contains('was already disposed'),
),
),
);
});
});
}