Skip to content

isConnected was always false in React Native ≥0.80 #386

@rajarajan-dev

Description

@rajarajan-dev

react-native-offline relies on this.status inside XMLHttpRequest event handlers

xhr.onload = function onLoad() {
  if (this.status >= 200 && this.status < 400) {
    resolve({ status: this.status });
  } else {
    reject({ status: this.status });
  }
};

this code worked early, because this inside the callback was bound to the xhr instance.
However, in React Native 0.80+ this is no longer bound to xhr. As a result, this.status is always 0 or undefined.
This causes checkInternetAccess and makeHttpRequest to incorrectly report no internet connection, even when a valid response is received (status: 200).

Steps to Reproduce:

  • Upgrade to React Native 0.80 (or above).
  • Use ReduxNetworkProvider or NetworkProvider.
  • Call useIsConnected() — it always returns false, even with internet.
  • Logs show
    [makeHttpRequest file ] onload fired, status = 200 but
    [NetworkConnectivity file ] setState isConnected = false.

Expected Behavior:
isConnected should return true when a valid HTTP status code (2xx/3xx) is received.

Actual Behavior:
isConnected is always false because this.status evaluates to 0|undefined.

Proposed Fix:
Replace this.status with explicit xhr.status in makeHttpRequest.ts

xhr.onload = function onLoad() {
  if (xhr.status >= 200 && xhr.status < 400) {
    resolve({ status: xhr.status });
  } else {
    reject({ status: xhr.status });
  }
};

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions