core: set network responseHeadersText from extra info event (#15639)

core/lib/network-recorder.js

@@ -138,6 +138,18 @@ class NetworkRecorder extends RequestEventEmitter {
     request.onResponseReceived(data);
   }
 
+  /**
+   * @param {{params: LH.Crdp.Network.ResponseReceivedExtraInfoEvent, targetType: LH.Protocol.TargetType, sessionId?: string}} event
+   */
+  onResponseReceivedExtraInfo(event) {
+    const data = event.params;
+    const request = this._findRealRequestAndSetSession(
+      data.requestId, event.targetType, event.sessionId);
+    if (!request) return;
+    log.verbose('network', `${request.url} response received extra info`);
+    request.onResponseReceivedExtraInfo(data);
+  }
+
   /**
    * @param {{params: LH.Crdp.Network.DataReceivedEvent, targetType: LH.Protocol.TargetType, sessionId?: string}} event
    */
@@ -196,6 +208,7 @@ class NetworkRecorder extends RequestEventEmitter {
       case 'Network.requestWillBeSent': return this.onRequestWillBeSent(event);
       case 'Network.requestServedFromCache': return this.onRequestServedFromCache(event);
       case 'Network.responseReceived': return this.onResponseReceived(event);
+      case 'Network.responseReceivedExtraInfo': return this.onResponseReceivedExtraInfo(event);
       case 'Network.dataReceived': return this.onDataReceived(event);
       case 'Network.loadingFinished': return this.onLoadingFinished(event);
       case 'Network.loadingFailed': return this.onLoadingFailed(event);

core/lib/network-request.js

@@ -246,6 +246,13 @@ class NetworkRequest {
     this.frameId = data.frameId;
   }
 
+  /**
+   * @param {LH.Crdp.Network.ResponseReceivedExtraInfoEvent} data
+   */
+  onResponseReceivedExtraInfo(data) {
+    this.responseHeadersText = data.headersText || '';
+  }
+
   /**
    * @param {LH.Crdp.Network.DataReceivedEvent} data
    */
@@ -354,7 +361,6 @@ class NetworkRequest {
     this.timing = response.timing;
     if (resourceType) this.resourceType = RESOURCE_TYPES[resourceType];
     this.mimeType = response.mimeType;
-    this.responseHeadersText = response.headersText || '';
     this.responseHeaders = NetworkRequest._headersDictToHeadersArray(response.headers);
 
     this.fetchedViaServiceWorker = !!response.fromServiceWorker;

core/test/network-records-to-devtools-log-test.js

@@ -57,7 +57,12 @@ describe('networkRecordsToDevtoolsLog', () => {
     const roundTripLogs = networkRecordsToDevtoolsLog(records, {skipVerification: true});
     const roundTripRecords = NetworkRecorder.recordsFromLogs(roundTripLogs);
 
-    expect(roundTripRecords).toEqual(records);
+    // First compare element-wise, as doing all at once results in too verbose an error message.
+    const len = Math.min(roundTripRecords.length, records.length);
+    for (let i = 0; i < len; i++) {
+      expect(roundTripRecords[i]).toEqual(records[i]);
+    }
+    expect(roundTripRecords.length).toEqual(records.length);
   });
 
   it('should roundtrip fake network records multiple times', () => {

core/test/network-records-to-devtools-log.js

@@ -300,6 +300,27 @@ function getResponseReceivedEvent(networkRecord, index, normalizedTiming) {
   };
 }
 
+/**
+ * @param {Partial<NetworkRequest>} networkRecord
+ * @param {number} index
+ * @return {LH.Protocol.RawEventMessage}
+ */
+function getResponseReceivedExtraInfoEvent(networkRecord, index) {
+  const headers = headersArrayToHeadersDict(networkRecord.responseHeaders);
+
+  return {
+    method: 'Network.responseReceivedExtraInfo',
+    params: {
+      requestId: getBaseRequestId(networkRecord) || `${idBase}.${index}`,
+      statusCode: networkRecord.statusCode || 200,
+      headers,
+      headersText: networkRecord.responseHeadersText,
+    },
+    targetType: 'sessionTargetType' in networkRecord ? networkRecord.sessionTargetType : 'page',
+    sessionId: networkRecord.sessionId,
+  };
+}
+
 /**
  * @param {Partial<NetworkRequest>} networkRecord
  * @return {LH.Protocol.RawEventMessage}
@@ -440,6 +461,9 @@ function networkRecordsToDevtoolsLog(networkRecords, options = {}) {
     }
 
     devtoolsLog.push(getResponseReceivedEvent(networkRecord, index, normalizedTiming));
+    if (networkRecord.responseHeadersText) {
+      devtoolsLog.push(getResponseReceivedExtraInfoEvent(networkRecord, index));
+    }
     devtoolsLog.push(getDataReceivedEvent(networkRecord, index));
 
     if (networkRecord.finished !== false) {