netwolf

Description:

netwolf

Inspired by Netfox on iOS. Netwolf allows for easy debugging of network requests made in your app via the use of interceptors (see Supported clients).
Overview #
https://user-images.githubusercontent.com/31680656/215766013-24dbfd34-292f-4448-bd4d-76858ce97933.mp4
Installation #
Add the following line to your pubspec.yaml file.
netwolf: ^0.3.0
copied to clipboard
Usage #
To use Netwolf, wrap NetwolfWidget with your home widget.
void main() {
runApp(
const MaterialApp(
home: NetwolfWidget(
child: HomePage(),
),
),
);
}
copied to clipboard
To display Netwolf, tap anywhere (that is not a GestureDetector) 5 times or call NetwolfController.instance.show().
By default, Netwolf is only enabled for debug mode. Taping it 5 times or calling NetwolfController.instance.show() does nothing if NetwolfWidget.enabled is false. To change this behaviour, set the behaviour in NetwolfWidget's constructor.
void main() {
runApp(
const MaterialApp(
home: NetwolfWidget(
enabled: true,
child: HomePage(),
),
),
);
}
copied to clipboard
Supported clients #

Dio via NetwolfDioInterceptor.
http with http_interceptor via NetwolfHttpInterceptor (planned).

Adding responses manually #
For unsupported clients, you can manually log the response using NetwolfController.instance.addResponse. For example,
try {
NetwolfController.instance.addRequest(
someWayOfIdentifyingThisRequest,
method: HttpRequestMethod.get,
url:'path/to/api',
requestHeaders: null,
requestBody: null,
);

final response = await client.get('path/to/api');

NetwolfController.instance.addResponse(
someWayOfIdentifyingThisRequest,
responseCode: response.statusCode,
responseHeaders: response.headers,
responseBody: response.data,
method: null,
url: null,
requestHeaders: null,
requestBody: null,
);

return response.data;
} on NetworkException catch (e) {
NetwolfController.instance.addResponse(
someWayOfIdentifyingThisRequest,
responseCode: e.statusCode,
responseHeaders: e.headers,
responseBody: e.data,
method: null,
url: null,
requestHeaders: null,
requestBody: null,
);

return null;
}
copied to clipboard
Usage with MaterialApp.router #
To use Netwolf with MaterialApp.router, you will need to create an empty page/shell route that contains the NetwolfWidget wrapped around the main widget. For AutoRoute, it would look something like this
class NetwolfAutoRouteEmptyPage extends EmptyRouterPage with AutoRouteWrapper {
const NetwolfAutoRouteEmptyPage({super.key});

@override
Widget wrappedRoute(BuildContext context) {
return NetwolfWidget(child: this);
}
}

@MaterialAutoRouter(
replaceInRouteName: 'Page,Route',
routes: <AutoRoute>[
AutoRoute<void>(
page: NetwolfAutoRouteEmptyPage,
initial: true,
children: [
AutoRoute<void>(page: HomePage, initial: true),
// Other pages...
],
),
],
)
class AppRouter extends _$AppRouter {}
copied to clipboard
or, in GoRouter
final router = GoRouter(
routes: [
ShellRoute(
builder: (_, __, child) => NetwolfWidget(child: child),
routes: [
GoRoute(path: '/', builder: (_, __) => const HomePage()),
// Other pages...
],
),
],
);
copied to clipboard