Handle fetch errors

handle-response.js

export function handleJSONResponse (response) {
  return response.json()
    .then(json => {
      if (response.ok) return json

      return Promise.reject({...json, responseObj: response})
    })
}

export function handleTextResponse (response) {
  return response.text()
    .then(text => {
      if (response.ok) return text

      return Promise.reject({responseObj: response, text})
    })
}

export default function handleResponse (response) {
  let contentType = response.headers.get('content-type')

  if (contentType.includes('application/json')) return handleJSONResponse(response)

  return handleTextResponse(response)
}

index.js

import handleResponse from './handleResponse'

fetch('https://api.github.com/users/chrissycoyier/repos') // this will 404 on purpose and get a json response from github
    .then(handleResponse)
    .then(response => console.log(response))
    .catch(error => console.log(error)) // error here will contain information about the response and json response from github