From c50c9f4da6a39cd62cda1e8fa9fd5b9843816fb5 Mon Sep 17 00:00:00 2001 From: Mercedes Bernard Date: Sat, 29 Feb 2020 19:47:14 -0600 Subject: [PATCH] handle 204 no content responses --- package.json | 2 +- src/index.js | 8 ++- test/index.test.js | 170 +++++++++++++++++++++++++++++++++++---------- 3 files changed, 141 insertions(+), 39 deletions(-) diff --git a/package.json b/package.json index 4f935d3..6ecf899 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-use-fetch-api", - "version": "1.0.4", + "version": "1.0.5", "description": "React hook for making simple JSON API requests using the browser Fetch API", "author": "Mercedes Bernard", "repository": { diff --git a/src/index.js b/src/index.js index 3e55f97..b98a9c9 100644 --- a/src/index.js +++ b/src/index.js @@ -18,7 +18,13 @@ async function fetchData(url, method, data) { } return response; }) - .then(response => response.json()); + .then(response => { + if (response.status === 204) { + return {}; + } else { + return response.json(); + } + }); return response; } diff --git a/test/index.test.js b/test/index.test.js index 80e72ab..122ddf6 100644 --- a/test/index.test.js +++ b/test/index.test.js @@ -9,7 +9,7 @@ let url; let data; let status; let ok; -let mockResponse = {}; +let mockResponse = { data: "here" }; let mockJsonPromise = Promise.resolve(mockResponse); let mockFetchPromise; @@ -56,14 +56,40 @@ describe("useApi", () => { }); describe("when the response is successful", () => { - it("returns the response as json", done => { - const { get } = useApi(); - const response = get(url); - expect(response).toEqual(mockJsonPromise); + describe("when the status code is 204 No Content", () => { + beforeEach(() => { + status = 204; + mockFetchPromise = Promise.resolve({ + status: status, + ok: ok, + json: () => Promise.resolve({}) + }); + + global.fetch = jest.fn().mockImplementation(() => mockFetchPromise); + }); - process.nextTick(() => { - global.fetch.mockClear(); - done(); + it("returns an empty json object", done => { + const { get } = useApi(); + const response = get(url); + expect(response).toEqual(Promise.resolve({})); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); + }); + }); + + describe("when the status code is any other successful status", () => { + it("returns the response as json", done => { + const { get } = useApi(); + const response = get(url); + expect(response).toEqual(mockJsonPromise); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); }); }); }); @@ -71,7 +97,6 @@ describe("useApi", () => { describe("when the response is not successful", () => { describe("when the status code is 401 Unauthorized", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos/1"; status = 401; ok = false; mockFetchPromise = Promise.resolve({ @@ -102,7 +127,6 @@ describe("useApi", () => { describe("when the status code is any other error ", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos/1"; status = 500; ok = false; mockFetchPromise = Promise.resolve({ @@ -164,14 +188,40 @@ describe("useApi", () => { }); describe("when the response is successful", () => { - it("returns the response as json", done => { - const { post } = useApi(); - const response = post(url, data); - expect(response).toEqual(mockJsonPromise); + describe("when the status code is 204 No Content", () => { + beforeEach(() => { + status = 204; + mockFetchPromise = Promise.resolve({ + status: status, + ok: ok, + json: () => Promise.resolve({}) + }); + + global.fetch = jest.fn().mockImplementation(() => mockFetchPromise); + }); - process.nextTick(() => { - global.fetch.mockClear(); - done(); + it("returns an empty json object", done => { + const { post } = useApi(); + const response = post(url, data); + expect(response).toEqual(Promise.resolve({})); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); + }); + }); + + describe("when the status code is any other successful status", () => { + it("returns the response as json", done => { + const { post } = useApi(); + const response = post(url, data); + expect(response).toEqual(mockJsonPromise); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); }); }); }); @@ -179,7 +229,6 @@ describe("useApi", () => { describe("when the response is not successful", () => { describe("when the status code is 401 Unauthorized", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos"; data = { title: "Gotta do all the things!", completed: false }; status = 401; ok = false; @@ -211,7 +260,6 @@ describe("useApi", () => { describe("when the status code is any other error ", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos"; status = 500; ok = false; mockFetchPromise = Promise.resolve({ @@ -273,14 +321,40 @@ describe("useApi", () => { }); describe("when the response is successful", () => { - it("returns the response as json", done => { - const { put } = useApi(); - const response = put(url, data); - expect(response).toEqual(mockJsonPromise); + describe("when the status code is 204 No Content", () => { + beforeEach(() => { + status = 204; + mockFetchPromise = Promise.resolve({ + status: status, + ok: ok, + json: () => Promise.resolve({}) + }); + + global.fetch = jest.fn().mockImplementation(() => mockFetchPromise); + }); - process.nextTick(() => { - global.fetch.mockClear(); - done(); + it("returns an empty json object", done => { + const { put } = useApi(); + const response = put(url, data); + expect(response).toEqual(Promise.resolve({})); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); + }); + }); + + describe("when the status code is any other successful status", () => { + it("returns the response as json", done => { + const { put } = useApi(); + const response = put(url, data); + expect(response).toEqual(mockJsonPromise); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); }); }); }); @@ -288,7 +362,6 @@ describe("useApi", () => { describe("when the response is not successful", () => { describe("when the status code is 401 Unauthorized", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos"; data = { title: "Gotta do all the things!", completed: false }; status = 401; ok = false; @@ -320,7 +393,6 @@ describe("useApi", () => { describe("when the status code is any other error ", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos"; status = 500; ok = false; mockFetchPromise = Promise.resolve({ @@ -381,14 +453,40 @@ describe("useApi", () => { }); describe("when the response is successful", () => { - it("returns the response as json", done => { - const { del } = useApi(); - const response = del(url); - expect(response).toEqual(mockJsonPromise); + describe("when the status code is 204 No Content", () => { + beforeEach(() => { + status = 204; + mockFetchPromise = Promise.resolve({ + status: status, + ok: ok, + json: () => Promise.resolve({}) + }); + + global.fetch = jest.fn().mockImplementation(() => mockFetchPromise); + }); - process.nextTick(() => { - global.fetch.mockClear(); - done(); + it("returns an empty json object", done => { + const { del } = useApi(); + const response = del(url); + expect(response).toEqual(Promise.resolve({})); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); + }); + }); + + describe("when the status code is any other successful status", () => { + it("returns the response as json", done => { + const { del } = useApi(); + const response = del(url); + expect(response).toEqual(mockJsonPromise); + + process.nextTick(() => { + global.fetch.mockClear(); + done(); + }); }); }); }); @@ -396,7 +494,6 @@ describe("useApi", () => { describe("when the response is not successful", () => { describe("when the status code is 401 Unauthorized", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos/1"; status = 401; ok = false; mockFetchPromise = Promise.resolve({ @@ -427,7 +524,6 @@ describe("useApi", () => { describe("when the status code is any other error ", () => { beforeEach(() => { - url = "https://jsonplaceholder.typicode.com/todos/1"; status = 500; ok = false; mockFetchPromise = Promise.resolve({