Build status Pub package License: MIT

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

Usage

To use Netwolf, wrap NetwolfWidget with your home widget.

void main() {
  runApp(
    const MaterialApp(
      home: NetwolfWidget(
        child: HomePage(),
      ),
    ),
  );
}

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(),
      ),
    ),
  );
}

Supported clients

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;
}

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 {}

or, in GoRouter

final router = GoRouter(
  routes: [
    ShellRoute(
      builder: (_, __, child) => NetwolfWidget(child: child),
      routes: [
        GoRoute(path: '/', builder: (_, __) => const HomePage()),
        // Other pages...
      ],
    ),
  ],
);

Libraries

netwolf