bartonhammond/snowflake

Chrome debugging breaks app

Closed this issue · 12 comments

I'm getting error alert with Unexpected token o in JSON at position 1 which apparently happens at every request when parsing server response.
What's very interesting is that it only happens when Chrome debugging is enabled! Otherwise everything works perfectly.
Tried on new app instance on guest Chrome session with no plugins.

I am getting this error:

"Unexpected token o
at Object.parse (native)
at http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:99454:14
at tryCallOne (http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:6633:8)"

from JSON.parse(response._bodyInit) but only when I'm in debug mode, otherwise seems to work fine...

fmnxl commented

(I'm in the same team as Anton ^) Gotta note we upgraded to react v24. Not sure if that triggered the issue, I'm gonna roll back and see if that's the case.

fmnxl commented

nope. downgraded to 23 and still same issue

I will try to look at tomorrow.

Today is my 30th anniversary and I'm also recovering from surgery. Not feeling to much like debugging right now.

fmnxl commented

Wow congrats, I hope you have a nice one :) And that you'd get well soon as well.

Whenever you're back, here's what I found:

JSON.parse(response._bodyInit) is trying to parse a Blob and so failed. I looked at the latest fetch documentation and it looks like we should be using .json() to retrieve the response instead (https://github.com/github/fetch#handling-http-error-statuses). Tested on our app and works. Will try to create a PR when I have time tomorrow.

Replace

var json = JSON.parse(response._bodyInit);

with

var json = response.json();

Good job @freemanon! Thanks for making a PR! Will merge asap.

Thanks @freemanon
Although now non-2xx requests (like unauthorized when logging in with incorrect data) raise exception:

image

Looks like Boom in HAPI server doesn't return valid JSON?

@bartonhammond congrats on your 30th anniversary!

Hi @sharq1

I also faced similar issue yesterday.

The other day Freeman mentioned to me that .json() will return an extra promise, so he said that I might have to take that into account.

This is what I am currently doing to fix the issue you are facing, not sure if it's the best solution but it works in my case, so that I can continue working on my project.

Instead of:

async login(data) {
  return await this._fetch({
    method: 'POST',
    url: '/account/login',
    body: data
  })
  .then((response) => {
    var json = response.json()
    if (response.status === 200 || response.status === 201) {
      return json
    } else {
      throw (json)
    }
  })
  .catch((error) => {
    throw (error)
  });
}

I am doing this:

async login(data) {
  return await this._fetch({
    method: 'POST',
    url: '/account/login',
    body: data
  })
  .then((response) => {
    return response.json().then(function (json) {
      if (response.status === 200 || response.status === 201) {
        return json
      } else {
        throw (json)
      }
    })
  })
  .catch((error) => {
    throw (error)
  })
}

If there is a better way to avoid this issue, please let me know.

Please verify with stable release 1.0 https://github.com/bartonhammond/snowflake/releases/tag/0.1.0.

I believe the problem was a intermediate upgrade of RN.

Please close if verification works.

@bartonhammond I cannot confirm if this works in stable release, but as @anton6 says - json returns a promise (from fetch docs about response: json() - Returns a promise that resolves with a JSON object), so I believe that is should be done as per his suggestion.

Unless there is a PR, it will remain as is.

I haven't been able to successfully debug every time! Seems it's a RN thing.