Skip to content

Commit 81d6525

Browse files
motiz88meta-codesync[bot]
authored andcommitted
iOS: Report fetch(), XHR and RCTNetworking call stacks to Network panel (#54052)
Summary: Pull Request resolved: #54052 1. Teaches the native networking module on IOS to track a `devToolsRequestId` along with each request, and use it instead of the internal `requestId` to identify the request to `NetworkReporter`. 2. Uses `__NETWORK_REPORTER__.createDevToolsRequestId` (D83238216) to generate a `devToolsRequestId` from JS and pass it into native. This records a JavaScript call stack as the [initiator](https://cdpstatus.reactnative.dev/devtools-protocol/tot/Network#type-Initiator) of the request. Changelog: [Internal] Reviewed By: huntie Differential Revision: D83754145 fbshipit-source-id: ee08f419d2a7013bbc915ee40b1428d7810e6c42
1 parent aa68540 commit 81d6525

8 files changed

Lines changed: 109 additions & 62 deletions

File tree

packages/react-native/Libraries/Network/RCTInspectorNetworkReporter.h

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
* - Corresponds to `PerformanceResourceTiming.requestStart` (specifically,
2828
* marking when the native request was initiated).
2929
*/
30-
+ (void)reportRequestStart:(NSNumber *)requestId
30+
+ (void)reportRequestStart:(NSString *)requestId
3131
request:(NSURLRequest *)request
3232
encodedDataLength:(int)encodedDataLength;
3333

@@ -40,7 +40,7 @@
4040
* `PerformanceResourceTiming.connectStart`. Defined as "immediately before
4141
* the browser starts to establish the connection to the server".
4242
*/
43-
+ (void)reportConnectionTiming:(NSNumber *)requestId request:(NSURLRequest *)request;
43+
+ (void)reportConnectionTiming:(NSString *)requestId request:(NSURLRequest *)request;
4444

4545
/**
4646
* Report when HTTP response headers have been received, corresponding to
@@ -49,7 +49,7 @@
4949
* - Corresponds to `Network.responseReceived` in CDP.
5050
* - Corresponds to `PerformanceResourceTiming.responseStart`.
5151
*/
52-
+ (void)reportResponseStart:(NSNumber *)requestId
52+
+ (void)reportResponseStart:(NSString *)requestId
5353
response:(NSURLResponse *)response
5454
statusCode:(int)statusCode
5555
headers:(NSDictionary<NSString *, NSString *> *)headers;
@@ -59,7 +59,7 @@
5959
*
6060
* Corresponds to `Network.dataReceived` in CDP.
6161
*/
62-
+ (void)reportDataReceived:(NSNumber *)requestId data:(NSData *)data;
62+
+ (void)reportDataReceived:(NSString *)requestId data:(NSData *)data;
6363

6464
/**
6565
* Report when a network request is complete and we are no longer receiving
@@ -68,20 +68,20 @@
6868
* - Corresponds to `Network.loadingFinished` in CDP.
6969
* - Corresponds to `PerformanceResourceTiming.responseEnd`.
7070
*/
71-
+ (void)reportResponseEnd:(NSNumber *)requestId encodedDataLength:(int)encodedDataLength;
71+
+ (void)reportResponseEnd:(NSString *)requestId encodedDataLength:(int)encodedDataLength;
7272

7373
/**
7474
* Report when a network request has failed.
7575
*
7676
* - Corresponds to `Network.loadingFailed` in CDP.
7777
*/
78-
+ (void)reportRequestFailed:(NSNumber *)requestId cancelled:(BOOL)cancelled;
78+
+ (void)reportRequestFailed:(NSString *)requestId cancelled:(BOOL)cancelled;
7979

8080
/**
8181
* Store response body preview. This is an optional reporting method, and is a
8282
* no-op if CDP debugging is disabled.
8383
*/
84-
+ (void)maybeStoreResponseBody:(NSNumber *)requestId data:(NSData *)data base64Encoded:(bool)base64Encoded;
84+
+ (void)maybeStoreResponseBody:(NSString *)requestId data:(NSData *)data base64Encoded:(bool)base64Encoded;
8585

8686
/**
8787
* Incrementally store a response body preview, when a string response is
@@ -91,6 +91,6 @@
9191
* As with `maybeStoreResponseBody`, calling this method is optional and a
9292
* no-op if CDP debugging is disabled.
9393
*/
94-
+ (void)maybeStoreResponseBodyIncremental:(NSNumber *)requestId data:(NSString *)data;
94+
+ (void)maybeStoreResponseBodyIncremental:(NSString *)requestId data:(NSString *)data;
9595

9696
@end

packages/react-native/Libraries/Network/RCTInspectorNetworkReporter.mm

Lines changed: 18 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -48,14 +48,14 @@ Headers convertNSDictionaryToHeaders(const NSDictionary<NSString *, NSString *>
4848
#ifdef REACT_NATIVE_DEBUGGER_ENABLED
4949

5050
// Dictionary to buffer incremental response bodies (CDP debugging active only)
51-
static const NSMutableDictionary<NSNumber *, NSMutableString *> *responseBuffers = nil;
51+
static const NSMutableDictionary<NSString *, NSMutableString *> *responseBuffers = nil;
5252

5353
#endif
5454

5555
@implementation RCTInspectorNetworkReporter {
5656
}
5757

58-
+ (void)reportRequestStart:(NSNumber *)requestId
58+
+ (void)reportRequestStart:(NSString *)requestId
5959
request:(NSURLRequest *)request
6060
encodedDataLength:(int)encodedDataLength
6161
{
@@ -68,11 +68,10 @@ + (void)reportRequestStart:(NSNumber *)requestId
6868
requestInfo.httpBody = convertRequestBodyToStringTruncated(request);
6969
#endif
7070

71-
NetworkReporter::getInstance().reportRequestStart(
72-
requestId.stringValue.UTF8String, requestInfo, encodedDataLength, std::nullopt);
71+
NetworkReporter::getInstance().reportRequestStart(requestId.UTF8String, requestInfo, encodedDataLength, std::nullopt);
7372
}
7473

75-
+ (void)reportConnectionTiming:(NSNumber *)requestId request:(NSURLRequest *)request
74+
+ (void)reportConnectionTiming:(NSString *)requestId request:(NSURLRequest *)request
7675
{
7776
Headers headersMap;
7877

@@ -81,10 +80,10 @@ + (void)reportConnectionTiming:(NSNumber *)requestId request:(NSURLRequest *)req
8180
headersMap = convertNSDictionaryToHeaders(request.allHTTPHeaderFields);
8281
#endif
8382

84-
NetworkReporter::getInstance().reportConnectionTiming(requestId.stringValue.UTF8String, headersMap);
83+
NetworkReporter::getInstance().reportConnectionTiming(requestId.UTF8String, headersMap);
8584
}
8685

87-
+ (void)reportResponseStart:(NSNumber *)requestId
86+
+ (void)reportResponseStart:(NSString *)requestId
8887
response:(NSURLResponse *)response
8988
statusCode:(int)statusCode
9089
headers:(NSDictionary<NSString *, NSString *> *)headers
@@ -99,17 +98,17 @@ + (void)reportResponseStart:(NSNumber *)requestId
9998
#endif
10099

101100
NetworkReporter::getInstance().reportResponseStart(
102-
requestId.stringValue.UTF8String, responseInfo, response.expectedContentLength);
101+
requestId.UTF8String, responseInfo, response.expectedContentLength);
103102
}
104103

105-
+ (void)reportDataReceived:(NSNumber *)requestId data:(NSData *)data
104+
+ (void)reportDataReceived:(NSString *)requestId data:(NSData *)data
106105
{
107-
NetworkReporter::getInstance().reportDataReceived(requestId.stringValue.UTF8String, (int)data.length, std::nullopt);
106+
NetworkReporter::getInstance().reportDataReceived(requestId.UTF8String, (int)data.length, std::nullopt);
108107
}
109108

110-
+ (void)reportResponseEnd:(NSNumber *)requestId encodedDataLength:(int)encodedDataLength
109+
+ (void)reportResponseEnd:(NSString *)requestId encodedDataLength:(int)encodedDataLength
111110
{
112-
NetworkReporter::getInstance().reportResponseEnd(requestId.stringValue.UTF8String, encodedDataLength);
111+
NetworkReporter::getInstance().reportResponseEnd(requestId.UTF8String, encodedDataLength);
113112

114113
#ifdef REACT_NATIVE_DEBUGGER_ENABLED
115114
// Debug build: Check for buffered response body and flush to NetworkReporter
@@ -118,17 +117,17 @@ + (void)reportResponseEnd:(NSNumber *)requestId encodedDataLength:(int)encodedDa
118117
if (buffer != nullptr) {
119118
if (buffer.length > 0) {
120119
NetworkReporter::getInstance().storeResponseBody(
121-
requestId.stringValue.UTF8String, RCTStringViewFromNSString(buffer), false);
120+
requestId.UTF8String, RCTStringViewFromNSString(buffer), false);
122121
}
123122
[responseBuffers removeObjectForKey:requestId];
124123
}
125124
}
126125
#endif
127126
}
128127

129-
+ (void)reportRequestFailed:(NSNumber *)requestId cancelled:(bool)cancelled
128+
+ (void)reportRequestFailed:(NSString *)requestId cancelled:(bool)cancelled
130129
{
131-
NetworkReporter::getInstance().reportRequestFailed(requestId.stringValue.UTF8String, cancelled);
130+
NetworkReporter::getInstance().reportRequestFailed(requestId.UTF8String, cancelled);
132131

133132
#ifdef REACT_NATIVE_DEBUGGER_ENABLED
134133
// Debug build: Clear buffer for request
@@ -138,7 +137,7 @@ + (void)reportRequestFailed:(NSNumber *)requestId cancelled:(bool)cancelled
138137
#endif
139138
}
140139

141-
+ (void)maybeStoreResponseBody:(NSNumber *)requestId data:(id)data base64Encoded:(bool)base64Encoded
140+
+ (void)maybeStoreResponseBody:(NSString *)requestId data:(id)data base64Encoded:(bool)base64Encoded
142141
{
143142
#ifdef REACT_NATIVE_DEBUGGER_ENABLED
144143
// Debug build: Process response body and report to NetworkReporter
@@ -152,21 +151,20 @@ + (void)maybeStoreResponseBody:(NSNumber *)requestId data:(id)data base64Encoded
152151
NSString *encodedString = [(NSData *)data base64EncodedStringWithOptions:0];
153152
if (encodedString != nullptr) {
154153
networkReporter.storeResponseBody(
155-
requestId.stringValue.UTF8String, RCTStringViewFromNSString(encodedString), base64Encoded);
154+
requestId.UTF8String, RCTStringViewFromNSString(encodedString), base64Encoded);
156155
} else {
157156
RCTLogWarn(@"Failed to encode response data for request %@", requestId);
158157
}
159158
} @catch (NSException *exception) {
160159
RCTLogWarn(@"Exception while encoding response data: %@", exception.reason);
161160
}
162161
} else if ([data isKindOfClass:[NSString class]] && [(NSString *)data length] > 0) {
163-
networkReporter.storeResponseBody(
164-
requestId.stringValue.UTF8String, RCTStringViewFromNSString((NSString *)data), base64Encoded);
162+
networkReporter.storeResponseBody(requestId.UTF8String, RCTStringViewFromNSString((NSString *)data), base64Encoded);
165163
}
166164
#endif
167165
}
168166

169-
+ (void)maybeStoreResponseBodyIncremental:(NSNumber *)requestId data:(NSString *)data
167+
+ (void)maybeStoreResponseBodyIncremental:(NSString *)requestId data:(NSString *)data
170168
{
171169
#ifdef REACT_NATIVE_DEBUGGER_ENABLED
172170
// Debug build: Buffer incremental response body contents

packages/react-native/Libraries/Network/RCTNetworkTask.h

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ typedef NS_ENUM(NSInteger, RCTNetworkTaskStatus) {
2828
@property (nonatomic, readonly) NSNumber *requestID;
2929
@property (nonatomic, readonly, weak) id requestToken;
3030
@property (nonatomic, readonly) NSURLResponse *response;
31+
@property (nonatomic, readonly) NSString *devToolsRequestId;
3132

3233
@property (nonatomic, copy) RCTURLRequestCompletionBlock completionBlock;
3334
@property (nonatomic, copy) RCTURLRequestProgressBlock downloadProgressBlock;
@@ -40,7 +41,10 @@ typedef NS_ENUM(NSInteger, RCTNetworkTaskStatus) {
4041
- (instancetype)initWithRequest:(NSURLRequest *)request
4142
handler:(id<RCTURLRequestHandler>)handler
4243
callbackQueue:(dispatch_queue_t)callbackQueue NS_DESIGNATED_INITIALIZER;
43-
44+
- (instancetype)initWithDevToolsRequestId:(NSString *)devToolsRequestId
45+
request:(NSURLRequest *)request
46+
handler:(id<RCTURLRequestHandler>)handler
47+
callbackQueue:(dispatch_queue_t)callbackQueue;
4448
- (void)start;
4549
- (void)cancel;
4650

packages/react-native/Libraries/Network/RCTNetworkTask.mm

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,26 @@ @implementation RCTNetworkTask {
2626
- (instancetype)initWithRequest:(NSURLRequest *)request
2727
handler:(id<RCTURLRequestHandler>)handler
2828
callbackQueue:(dispatch_queue_t)callbackQueue
29+
{
30+
self = [self initWithDevToolsRequestId:nil request:request handler:handler callbackQueue:callbackQueue];
31+
return self;
32+
}
33+
34+
- (instancetype)initWithDevToolsRequestId:(NSString *)devToolsRequestId
35+
request:(NSURLRequest *)request
36+
handler:(id<RCTURLRequestHandler>)handler
37+
callbackQueue:(dispatch_queue_t)callbackQueue
2938
{
3039
RCTAssertParam(request);
3140
RCTAssertParam(handler);
3241
RCTAssertParam(callbackQueue);
3342

3443
if ((self = [super init])) {
3544
_requestID = @(currentRequestId++);
45+
_devToolsRequestId = devToolsRequestId;
46+
if (_devToolsRequestId == nil) {
47+
_devToolsRequestId = [[NSUUID UUID] UUIDString];
48+
}
3649
_request = request;
3750
_handler = handler;
3851
_callbackQueue = callbackQueue;

packages/react-native/Libraries/Network/RCTNetworking.h

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@
4747
*/
4848
- (RCTNetworkTask *)networkTaskWithRequest:(NSURLRequest *)request
4949
completionBlock:(RCTURLRequestCompletionBlock)completionBlock;
50+
- (RCTNetworkTask *)networkTaskWithDevToolsRequestId:(NSString *)devToolsRequestId
51+
request:(NSURLRequest *)request
52+
completionBlock:(RCTURLRequestCompletionBlock)completionBlock;
5053

5154
- (void)addRequestHandler:(id<RCTNetworkingRequestHandler>)handler;
5255

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,8 @@ const RCTNetworking = {
4040
withCredentials: boolean,
4141
) {
4242
const body = convertRequestBody(data);
43+
const devToolsRequestId =
44+
global.__NETWORK_REPORTER__?.createDevToolsRequestId();
4345
NativeNetworkingIOS.sendRequest(
4446
{
4547
method,
@@ -50,6 +52,7 @@ const RCTNetworking = {
5052
incrementalUpdates,
5153
timeout,
5254
withCredentials,
55+
unstable_devToolsRequestId: devToolsRequestId,
5356
},
5457
callback,
5558
);

0 commit comments

Comments
 (0)