Cover RequestService with tests.

Author: trekhleb

.env.production

@@ -6,3 +6,6 @@ REACT_APP_GIPHY_API_KEY=CdRKiCMbTnt9CkZTZ0lGukSczk6iT4Z6
 
 # GIPHY API Host.
 REACT_APP_GIPHY_API_HOST=https://api.giphy.com
+
+# HTTP request timeout in milliseconds.
+HTTP_REQUEST_TIMEOUT=1000

.env.test

@@ -6,3 +6,6 @@ REACT_APP_GIPHY_API_KEY=CdRKiCMbTnt9CkZTZ0lGukSczk6iT4Z6
 
 # GIPHY API Host.
 REACT_APP_GIPHY_API_HOST=https://api.giphy.com
+
+# HTTP request timeout in milliseconds.
+HTTP_REQUEST_TIMEOUT=1000

package-lock.json

@@ -33,6 +33,7 @@
     "not op_mini all"
   ],
   "devDependencies": {
+    "axios-mock-adapter": "^1.16.0",
     "eslint-config-airbnb": "^17.1.0",
     "gh-pages": "^2.0.1",
     "husky": "^1.3.1",

package.json

@@ -10,5 +10,8 @@ export const GIPHY_API_KEY = env.REACT_APP_GIPHY_API_KEY;
 // GIPHY API Host.
 export const GIPHY_API_HOST = env.REACT_APP_GIPHY_API_HOST;
 
+// HTTP request timeout in milliseconds.
+export const REQUEST_TIMEOUT = env.HTTP_REQUEST_TIMEOUT;
+
 // How many Gif images we want to request per each HTTP request.
 export const SEARCH_BATCH_SIZE = 30;

src/config.js

@@ -1,4 +1,5 @@
 import axios from 'axios';
+import { REQUEST_TIMEOUT } from '../config';
 
 // RequestService is created as a wrapper on top of axios. This is done in order to be able to
 // switch to new http-requests library if needed. Utilizing interfaces might be a good option here.
@@ -14,6 +15,8 @@ export class RequestService {
   // Generate default Axios configuration for requests.
   // We may put here default timeouts etc.
   static getDefaultAxiosConfig() {
-    return {};
+    return {
+      timeout: REQUEST_TIMEOUT,
+    };
   }
 }

src/services/RequestService.js

@@ -0,0 +1,52 @@
+import axios from 'axios';
+import AxiosMockAdapter from 'axios-mock-adapter';
+import { RequestService } from '../RequestService';
+
+describe('RequestService', () => {
+  it('should perform successful GET requests', (done) => {
+    const testUrl = 'http://localhost';
+    const testResponse = { testData: 'Test response data' };
+
+    const testParams = {
+      param1: 'Param #1 value',
+      param2: 'Param #2 value',
+    };
+    const mock = new AxiosMockAdapter(axios);
+    mock.onGet(testUrl).reply(200, testResponse);
+
+    RequestService
+      .get(testUrl, testParams)
+      .then((responseData) => {
+        // We should receive mocked response.
+        expect(responseData).toBeDefined();
+        expect(responseData.data).toEqual(testResponse);
+      })
+      .catch(() => {
+        // We should not get here.
+        expect(true).toBe(false);
+      })
+      .finally(() => {
+        done();
+      });
+  });
+
+  it('should perform not successful GET requests', (done) => {
+    const testUrl = 'http://localhost';
+    const mock = new AxiosMockAdapter(axios);
+    mock.onGet(testUrl).reply(500);
+
+    RequestService
+      .get(testUrl)
+      .then(() => {
+        // We should not get here.
+        expect(true).toBe(false);
+      })
+      .catch((err) => {
+        // We should get here.
+        expect(err).toBeDefined();
+      })
+      .finally(() => {
+        done();
+      });
+  });
+});