Networking library has no exported methods on Android

[alessbell]

Description

Hi all 👋

I work on Apollo Client, and with @defer support coming to GraphQL, I've been investigating the state of text streaming in React Native so our community can use features that rely on it in their RN apps. I found #27741 which brought me to the polyfill, https://www.npmjs.com/package/react-native-fetch-api.

There's an open bug about the polyfill not working on Android which I can reproduce: react-native-community/fetch#13

When I looked into it, I was puzzled by what I found: when I run the same program on iOS, the polyfill uses native APIs to make the fetch by doing import { Networking } from 'react-native';. That Networking module exports an interface that includes the sendRequest method, which is how the request is fired by the polyfill.

When I run it on Android, the Networking module has no exported methods at all. I also tried import AndroidNetworking from "react-native/Libraries/Network/RCTNetworking.android.js"; and again found an empty object.

Since others using the polyfill are experiencing the same thing, it seems like it's not a local configuration issue I may be having. Happy to provide any additional info, thanks!

React Native Version

0.72.4

Output of npx react-native info

System:
  OS: macOS 13.5
  CPU: (8) arm64 Apple M1
  Memory: 104.72 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.0.0
    path: ~/.nvm/versions/node/v20.0.0/bin/node
  Yarn:
    version: 1.22.19
    path: ~/.nvm/versions/node/v20.0.0/bin/yarn
  npm:
    version: 9.8.1
    path: ~/.nvm/versions/node/v20.0.0/bin/npm
  Watchman:
    version: 2023.08.28.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.12.1
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 22.4
      - iOS 16.4
      - macOS 13.3
      - tvOS 16.4
      - watchOS 9.4
  Android SDK: Not Found
IDEs:
  Android Studio: 2022.3 AI-223.8836.35.2231.10671973
  Xcode:
    version: 14.3.1/14E300c
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.20
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.72.4
    wanted: 0.72.4
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Steps to reproduce

See README.md in https://github.com/alessbell/RNMultipartSubsDemo

Snack, screenshot, or link to a repository

https://github.com/alessbell/RNMultipartSubsDemo

[alessbell]

This seems to be unrelated to the issue where the community fetch polyfill doesn't work on Android, but made debugging more difficult so I'll leave this issue open.

[cortinico]

Hi @alessbell
Thanks for flagging this,

This seems to be unrelated to the issue where the community fetch polyfill doesn't work on Android, but made debugging more difficult so I'll leave this issue open.

What was the issue afterall?
I can see that for Android we actually export an object:

react-native/packages/react-native/Libraries/Network/RCTNetworking.android.js

Lines 43 to 95 in 5a926c5

	class RCTNetworking extends NativeEventEmitter<$FlowFixMe> {
	constructor() {
	super(
	// T88715063: NativeEventEmitter only used this parameter on iOS. Now it uses it on all platforms, so this code was modified automatically to preserve its behavior
	// If you want to use the native module on other platforms, please remove this condition and test its behavior
	Platform.OS !== 'ios' ? null : NativeNetworkingAndroid,
	);
	}
	sendRequest(
	method: string,
	trackingName: string,
	url: string,
	headers: Object,
	data: RequestBody,
	responseType: NativeResponseType,
	incrementalUpdates: boolean,
	timeout: number,
	callback: (requestId: number) => mixed,
	withCredentials: boolean,
	) {
	const body = convertRequestBody(data);
	if (body && body.formData) {
	body.formData = body.formData.map(part => ({
	...part,
	headers: convertHeadersMapToArray(part.headers),
	}));
	}
	const requestId = generateRequestId();
	NativeNetworkingAndroid.sendRequest(
	method,
	url,
	requestId,
	convertHeadersMapToArray(headers),
	{...body, trackingName},
	responseType,
	incrementalUpdates,
	timeout,
	withCredentials,
	);
	callback(requestId);
	}
	abortRequest(requestId: number) {
	NativeNetworkingAndroid.abortRequest(requestId);
	}
	clearCookies(callback: (result: boolean) => any) {
	NativeNetworkingAndroid.clearCookies(callback);
	}
	}
	export default (new RCTNetworking(): RCTNetworking);

So I'm unsure why you noticed what you were reporting.

[alessbell]

Hi @cortinico, thanks for your reply.

What was the issue afterall?

The original issue was react-native-community/fetch#13: the community fetch polyfill that enables text streaming wasn't working on Android during local dev. It looks like some have found workarounds (see comment about disabling NetworkFlipperPlugin), but I am still blocked there (I'm not using Flipper 🙂).

I also saw that RCTNetworking.android.js exports an object, so I'm not sure what the possible cause could be, but you should be able to observe what I'm describing if you run the reproduction I included.

[github-actions]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[mateoguzmana]

I've addressed this in #48166, there is not an actual issue in the functionality itself but it is rather some inconsistency in the exports as for iOS an object is exported and for Android a class.