React-native: 'unsupported BodyInit type' error is uncatchable

[despairblue]

Initializing a fetch with an incorrect body type throws an error instead rejecting the promise:

 try {
  fetch(API_LOGIN_URL, {
    method: 'POST',
    body: {
      username: 'a',
      password: 'b'
    }
  })
    .catch(error => {
      // not called
      console.error(error)
    })
} catch (e) {
  // called
  console.error(e)
}

Is that standard behaviour? Also why wouldn't the polyfill accept it? Chrome does accept it.

[brentvatne]

This seems like an issue that is better suited for https://github.com/github/fetch - this is the polyfill that we're using in React Native :smile: Could you repost it there? If it turns out to be a problem with React Native's XMLHttpRequest implementation we can look into that further.

That said, I tried this with some obviously invalid thing - fetching a url that didn't exist, and it didn't go into either of the catch blocks in Chrome.

 try {
  fetch('/lololol', {
    method: 'POST',
    body: {
      username: 'a',
      password: 'b'
    }
  })
    .catch(function(error) {
      // not called
      console.error("INSIDE")
    })
} catch (e) {
  // called
  console.error("OUTSIDE")
}

[despairblue]

It's not going into either because it accepts the body init type. That was the second part of my question. Is an Object an officially supported body init type? Because chrome does accept it. :smiley:

Try this:

 try {
  fetch('/lololol', {
    method: 'POST',
    body: {
      username: 'a',
      password: 'b'
    }
  })
    .then(function(json) {
      console.log(json)
    })
    .catch(function(error) {
      // not called
      console.error("INSIDE")
    })
} catch (e) {
  // called
  console.error("OUTSIDE")
}

Also I'm not completely sure if opening this at github/fetch would help here, since I don't know if fixes from there will be back-ported to react-native's version of fetch. Github made it clear that they are not interested in making the polyfill work anywhere except in a browsers. Also the fetch version in react-native was already patched to work and probably keeps going to get patched.

[sgaurav]

As per https://github.com/github/fetch, to post JSON you need to set correct headers and stringify json before putting in body

fetch('/lololol', {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body:JSON.stringify( {
      username: 'a',
      password: 'b'
    })
  })

[shirts]

Thanks @sgaurav that resolved my issue. Not familiar with the fetch api, and I had forgotten to set headers