mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/47685 Currently, we assume any URL with a hostname of `10.0.2.2` or `10.0.3.2` (device-relative) is eligible for rewriting to `localhost` (frontend-relative), because we assume the device is an Android emulator. We rewrite these URLs between device and dev machine so that the rewritten URLs are reachable from the dev machine. This diff narrows this logic so that we'll only rewrite URLs where the hostname matches the pre-existing list *and* this matches the host the device is actually connected on, according to its headers from the original connection. The main motivation for this change is to unblock removing assumptions about device-reachable vs server-reachable hosts. Later in the stack we'll drop the hardcoded listing of `10.0.2.2` etc in favour of identifying URLs that target the dev server, from whatever network. There's also an edge case fix here that `10.0.2.2` etc might actually refer to a remote LAN server, and not be an Android emulator's alias for for an emulator host. Changelog: [General][Fixed] RN DevTools: Don't assume 10.0.2.2 is an alias for localhost unless it's used to establish a connection to the server Reviewed By: huntie Differential Revision: D66058704 fbshipit-source-id: bad28717b0c9b1ca43e2ea3391cef13f87892e6c
176 lines
4.2 KiB
JavaScript
176 lines
4.2 KiB
JavaScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @flow strict-local
|
|
* @format
|
|
* @oncall react_native
|
|
*/
|
|
|
|
import type {
|
|
ConnectRequest,
|
|
DisconnectRequest,
|
|
GetPagesRequest,
|
|
GetPagesResponse,
|
|
JSONSerializable,
|
|
MessageFromDevice,
|
|
MessageToDevice,
|
|
WrappedEvent,
|
|
} from '../inspector-proxy/types';
|
|
|
|
import nullthrows from 'nullthrows';
|
|
import WebSocket from 'ws';
|
|
|
|
export class DeviceAgent {
|
|
#ws: ?WebSocket;
|
|
#readyPromise: Promise<void>;
|
|
|
|
constructor(url: string, signal?: AbortSignal, host?: ?string) {
|
|
const ws = new WebSocket(url, {
|
|
// The mock server uses a self-signed certificate.
|
|
rejectUnauthorized: false,
|
|
...(host != null
|
|
? {
|
|
headers: {
|
|
Host: host,
|
|
},
|
|
}
|
|
: {}),
|
|
});
|
|
this.#ws = ws;
|
|
ws.on('message', data => {
|
|
this.__handle(JSON.parse(data.toString()));
|
|
});
|
|
if (signal != null) {
|
|
signal.addEventListener('abort', () => {
|
|
this.close();
|
|
});
|
|
}
|
|
this.#readyPromise = new Promise<void>((resolve, reject) => {
|
|
ws.once('open', () => {
|
|
resolve();
|
|
});
|
|
ws.once('error', error => {
|
|
reject(error);
|
|
});
|
|
});
|
|
}
|
|
|
|
__handle(message: MessageToDevice): void {}
|
|
|
|
send(message: MessageFromDevice) {
|
|
if (!this.#ws) {
|
|
return;
|
|
}
|
|
this.#ws.send(JSON.stringify(message));
|
|
}
|
|
|
|
ready(): Promise<void> {
|
|
return this.#readyPromise;
|
|
}
|
|
|
|
close() {
|
|
if (!this.#ws) {
|
|
return;
|
|
}
|
|
try {
|
|
this.#ws.terminate();
|
|
} catch {}
|
|
this.#ws = null;
|
|
}
|
|
|
|
sendWrappedEvent(pageId: string, event: JSONSerializable) {
|
|
this.send({
|
|
event: 'wrappedEvent',
|
|
payload: {
|
|
pageId,
|
|
wrappedEvent: JSON.stringify(event),
|
|
},
|
|
});
|
|
}
|
|
|
|
// $FlowIgnore[unsafe-getters-setters]
|
|
get socket(): WebSocket {
|
|
return nullthrows(this.#ws);
|
|
}
|
|
}
|
|
|
|
export class DeviceMock extends DeviceAgent {
|
|
// Empty handlers
|
|
+connect: JestMockFn<[message: ConnectRequest], void> = jest.fn();
|
|
+disconnect: JestMockFn<[message: DisconnectRequest], void> = jest.fn();
|
|
+getPages: JestMockFn<
|
|
[message: GetPagesRequest],
|
|
| GetPagesResponse['payload']
|
|
| Promise<GetPagesResponse['payload'] | void>
|
|
| void,
|
|
> = jest.fn();
|
|
+wrappedEvent: JestMockFn<[message: WrappedEvent], void> = jest.fn();
|
|
+wrappedEventParsed: JestMockFn<
|
|
[payload: {...WrappedEvent['payload'], wrappedEvent: JSONSerializable}],
|
|
void,
|
|
> = jest.fn();
|
|
|
|
__handle(message: MessageToDevice): void {
|
|
switch (message.event) {
|
|
case 'connect':
|
|
this.connect(message);
|
|
break;
|
|
case 'disconnect':
|
|
this.disconnect(message);
|
|
break;
|
|
case 'getPages':
|
|
const result = this.getPages(message);
|
|
this.#sendPayloadIfNonNull('getPages', result);
|
|
break;
|
|
case 'wrappedEvent':
|
|
this.wrappedEvent(message);
|
|
this.wrappedEventParsed({
|
|
...message.payload,
|
|
wrappedEvent: JSON.parse(message.payload.wrappedEvent),
|
|
});
|
|
break;
|
|
default:
|
|
(message: empty);
|
|
throw new Error(`Unhandled event ${message.event}`);
|
|
}
|
|
}
|
|
|
|
#sendPayloadIfNonNull<Event: MessageFromDevice['event']>(
|
|
event: Event,
|
|
maybePayload:
|
|
| MessageFromDevice['payload']
|
|
| Promise<MessageFromDevice['payload'] | void>
|
|
| void,
|
|
) {
|
|
if (maybePayload == null) {
|
|
return;
|
|
}
|
|
if (maybePayload instanceof Promise) {
|
|
// eslint-disable-next-line no-void
|
|
void maybePayload.then(payload => {
|
|
if (!payload) {
|
|
return;
|
|
}
|
|
// $FlowFixMe[incompatible-call] TODO(moti) Figure out the right way to type maybePayload generically
|
|
this.send({event, payload});
|
|
});
|
|
return;
|
|
}
|
|
// $FlowFixMe[incompatible-call] TODO(moti) Figure out the right way to type maybePayload generically
|
|
this.send({event, payload: maybePayload});
|
|
}
|
|
}
|
|
|
|
export async function createDeviceMock(
|
|
url: string,
|
|
signal: AbortSignal,
|
|
host?: ?string,
|
|
): Promise<DeviceMock> {
|
|
const device = new DeviceMock(url, signal, host);
|
|
await device.ready();
|
|
return device;
|
|
}
|