Explain provisional headers message for cached requests

Bug: 1040155
Change-Id: I2031c3a85cd40290d8e1e112ca3e57e186f6d5e1
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/1991731
Reviewed-by: Sigurd Schneider <[email protected]>
Reviewed-by: Jan Scheffler <[email protected]>
Commit-Queue: Joey Arhar <[email protected]>
diff --git a/front_end/network/RequestHeadersView.js b/front_end/network/RequestHeadersView.js
index 21ac262..74d5532 100644
--- a/front_end/network/RequestHeadersView.js
+++ b/front_end/network/RequestHeadersView.js
@@ -621,11 +621,20 @@
     this._refreshHeadersTitle(title, headersTreeElement, length);
 
     if (provisionalHeaders) {
-      const cautionText = Common.UIString('Provisional headers are shown');
-      const cautionFragment = createDocumentFragment();
-      cautionFragment.createChild('span', '', 'dt-icon-label').type = 'smallicon-warning';
-      cautionFragment.createChild('div', 'caution').textContent = cautionText;
-      const cautionTreeElement = new UI.TreeElement(cautionFragment);
+      let cautionText;
+      let cautionTitle = '';
+      if (this._request.cachedInMemory() || this._request.cached()) {
+        cautionText = ls`Provisional headers are shown. Disable cache to see full headers.`;
+        cautionTitle = ls
+        `Only provisional headers are available because this request was not sent over the network and instead was served from a local cache, which doesn't store the original request headers. Disable cache to see full request headers.`;
+      } else {
+        cautionText = ls`Provisional headers are shown`;
+      }
+      const cautionElement = createElement('div');
+      cautionElement.title = cautionTitle;
+      cautionElement.createChild('span', '', 'dt-icon-label').type = 'smallicon-warning';
+      cautionElement.createChild('div', 'caution').textContent = cautionText;
+      const cautionTreeElement = new UI.TreeElement(cautionElement);
       headersTreeElement.appendChild(cautionTreeElement);
     }