Testing in Flutter

Previously you have written tests to test the Change Notifier. In this episode, you will write tests to test the API requests. API requests are an integral part of any app. And we may have some bugs in the HTTPS function. Testing API requests is essential.

Head over to quotes_api_test.dart file and write the test below the quotes json test.

test('Quotes Service MOCK API Test', () async{

});

First, we must create an API service to call the API. Let’s create a variable named apiService and assign it to the QuotesService class inside the test function.

final apiService = QuotesService();

The quotes service class takes a client as an argument. So we will need to create a mock client. We will use the MockClient class from the HTTP package. So import the HTTP testing package and create a mock client.

import 'package:http/http.dart';
import 'package:http/testing.dart';

final client = MockClient();

The mock client takes a function as an argument. This function will be called when the client makes a request. So let us create a function named _mockHTTP, which takes a request as an argument, returns a response, passes this function as an argument to the mock client, and calls the getQuotes function.

Future<Response> _mockHTTP(Request request) async {
  // Todo write mock http function.
}
final client = (MockClient(_mockHttp));
final apiService = QuotesService(client);
final quotes = await apiService.getQuotes();

Now let us write a function that will mock the HTTP function. We will provide the HTTP function mock data, which it will return when the request is made so that we can test it.

Inside the _mockHttp, write the following code.

if (request.url.toString().startsWith('https://dummyjson.com/quotes')) {
        return Response(mockQuotes, 200,
            headers: {HttpHeaders.contentTypeHeader: 'application/json'});
      }

return throw Exception('failed');

The above code will check if the request URL starts with the API URL. If it does, it will return the mock data. Else it will throw an exception.

Now let us write the mock data. Create a variable named mockQuotes in the constant file and assign it to the following JSON data.

final mockQuotes = jsonEncode(data);

final data = {
  "quotes": [
    {"id": 1, "quote": "I am best", "author": "Shree"}
  ],
};

The final step uses the expect function to check if the quote values are equal to the mock data.

Here comes another challenge for you. You know the drill, and you know the mock data. So pause the video and complete the challenge.

Okay, so I guess you have completed the challenge. Let’s see how to do it.

expect(quotes.first.id, 1);
expect(quotes.first.author, 'Shree');
expect(quotes.first.quote, 'I am best');

Now run the test and see if it passes. It should pass. If it fails, check your JSON data and the test code.

The complete code for the test is given below.

test('Quotes Service MOCK API Test', () async {
      

  Future<Response> _mockHttp(Request request) async {
    if (request.url.toString().startsWith('https://dummyjson.com/quotes')) {
      return Response(mockQuotes, 200,
          headers: {HttpHeaders.contentTypeHeader: 'application/json'});
    }

    return throw Exception('failed');
  }
  final client = (MockClient(_mockHttp));
  final apiService = QuotesService(client);

  final quotes = await apiService.getQuotes();

  expect(quotes.first.id, 1);
  expect(quotes.first.author, 'Shree');
  expect(quotes.first.quote, 'I am best');
});