Fix links to headers tab in the network panel

When the header overrides experiment is enabled, DevTools shows the
new headers view in the network panel. This CL updates all links to
the headers view to take the experiment status into account.

Bug: 1288023
Change-Id: I33bc7464c048abef005e0c77b088cccee721d5df
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4291189
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
Auto-Submit: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Danil Somsikov <dsv@chromium.org>

diff --git a/front_end/panels/application/components/FrameDetailsView.ts b/front_end/panels/application/components/FrameDetailsView.ts
index 77bf98b..f4ed881 100644
--- a/front_end/panels/application/components/FrameDetailsView.ts
+++ b/front_end/panels/application/components/FrameDetailsView.ts

@@ -450,8 +450,10 @@
         const request = resource.request;
         return renderIconLink(
             'network_panel_icon', i18nString(UIStrings.clickToRevealInNetworkPanel), (): Promise<void> => {
-              const requestLocation = NetworkForward.UIRequestLocation.UIRequestLocation.tab(
-                  request, NetworkForward.UIRequestLocation.UIRequestTabs.Headers);
+              const headersTab = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES) ?
+                  NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent :
+                  NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+              const requestLocation = NetworkForward.UIRequestLocation.UIRequestLocation.tab(request, headersTab);
               return Common.Revealer.reveal(requestLocation);
             });
       }

diff --git a/front_end/panels/issues/IssueView.ts b/front_end/panels/issues/IssueView.ts
index c887e2f..0d244a4 100644
--- a/front_end/panels/issues/IssueView.ts
+++ b/front_end/panels/issues/IssueView.ts

@@ -15,6 +15,7 @@
 import * as Adorners from '../../ui/components/adorners/adorners.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
 import * as Components from './components/components.js';
+import * as Root from '../../core/root/root.js';
 
 import {AffectedDirectivesView} from './AffectedDirectivesView.js';
 import {AffectedBlockedByResponseView} from './AffectedBlockedByResponseView.js';
@@ -92,7 +93,11 @@
       const element = document.createElement('tr');
       element.classList.add('affected-resource-request');
       const category = this.issue.getCategory();
-      const tab = issueTypeToNetworkHeaderMap.get(category) || NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+      let tab = issueTypeToNetworkHeaderMap.get(category) || NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+      if (tab === NetworkForward.UIRequestLocation.UIRequestTabs.Headers &&
+          Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES)) {
+        tab = NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent;
+      }
       element.appendChild(this.createRequestCell(affectedRequest, {
         networkTab: tab,
         additionalOnClickAction() {
@@ -170,8 +175,12 @@
     element.classList.add('affected-resource-mixed-content');
 
     if (mixedContent.request) {
-      const networkTab = issueTypeToNetworkHeaderMap.get(this.issue.getCategory()) ||
+      let networkTab = issueTypeToNetworkHeaderMap.get(this.issue.getCategory()) ||
           NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+      if (networkTab === NetworkForward.UIRequestLocation.UIRequestTabs.Headers &&
+          Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES)) {
+        networkTab = NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent;
+      }
       element.appendChild(this.createRequestCell(mixedContent.request, {
         networkTab,
         additionalOnClickAction() {

diff --git a/front_end/panels/network/NetworkDataGridNode.ts b/front_end/panels/network/NetworkDataGridNode.ts
index 54823f9..fe5a85e 100644
--- a/front_end/panels/network/NetworkDataGridNode.ts
+++ b/front_end/panels/network/NetworkDataGridNode.ts

@@ -1193,9 +1193,12 @@
       if (displayShowHeadersLink) {
         this.setTextAndTitleAsLink(
             cell, i18nString(UIStrings.blockeds, {PH1: reason}), i18nString(UIStrings.blockedTooltip), () => {
+              const tab = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES) ?
+                  NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent :
+                  NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
               this.parentView().dispatchEventToListeners(Events.RequestActivated, {
                 showPanel: true,
-                tab: NetworkForward.UIRequestLocation.UIRequestTabs.Headers,
+                tab,
               });
             });
       } else {

diff --git a/front_end/panels/network/NetworkItemView.ts b/front_end/panels/network/NetworkItemView.ts
index 39f2504..9bd7cbc 100644
--- a/front_end/panels/network/NetworkItemView.ts
+++ b/front_end/panels/network/NetworkItemView.ts

@@ -145,19 +145,18 @@
     this.requestInternal = request;
     this.element.classList.add('network-item-view');
 
-    this.resourceViewTabSetting = Common.Settings.Settings.instance().createSetting(
-        'resourceViewTab', NetworkForward.UIRequestLocation.UIRequestTabs.Headers);
+    const headersTab = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES) ?
+        NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent :
+        NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+    this.resourceViewTabSetting = Common.Settings.Settings.instance().createSetting('resourceViewTab', headersTab);
 
     this.headersView = new RequestHeadersView(request);
     this.headersViewComponent = new NetworkComponents.RequestHeadersView.RequestHeadersView(request);
     if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES)) {
       this.appendTab(
-          NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent, i18nString(UIStrings.headers),
-          this.headersViewComponent, i18nString(UIStrings.headers));
+          headersTab, i18nString(UIStrings.headers), this.headersViewComponent, i18nString(UIStrings.headers));
     } else {
-      this.appendTab(
-          NetworkForward.UIRequestLocation.UIRequestTabs.Headers, i18nString(UIStrings.headers), this.headersView,
-          i18nString(UIStrings.headers));
+      this.appendTab(headersTab, i18nString(UIStrings.headers), this.headersView, i18nString(UIStrings.headers));
     }
 
     this.payloadView = null;

diff --git a/front_end/ui/components/request_link_icon/RequestLinkIcon.ts b/front_end/ui/components/request_link_icon/RequestLinkIcon.ts
index 29dd007..13a9f54 100644
--- a/front_end/ui/components/request_link_icon/RequestLinkIcon.ts
+++ b/front_end/ui/components/request_link_icon/RequestLinkIcon.ts

@@ -4,6 +4,7 @@
 
 import type * as SDK from '../../../core/sdk/sdk.js';
 import type * as Platform from '../../../core/platform/platform.js';
+import * as Root from '../../../core/root/root.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as Common from '../../../core/common/common.js';
 import * as NetworkForward from '../../../panels/network/forward/forward.js';
@@ -149,8 +150,11 @@
           linkedRequest, this.#highlightHeader.section, this.#highlightHeader.name);
       void this.#reveal(requestLocation);
     } else {
-      const requestLocation = NetworkForward.UIRequestLocation.UIRequestLocation.tab(
-          linkedRequest, this.#networkTab ?? NetworkForward.UIRequestLocation.UIRequestTabs.Headers);
+      const headersTab = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES) ?
+          NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent :
+          NetworkForward.UIRequestLocation.UIRequestTabs.Headers;
+      const requestLocation =
+          NetworkForward.UIRequestLocation.UIRequestLocation.tab(linkedRequest, this.#networkTab ?? headersTab);
       void this.#reveal(requestLocation);
     }
     this.#additionalOnClickAction?.();

diff --git a/test/unittests/front_end/core/sdk/NetworkManager_test.ts b/test/unittests/front_end/core/sdk/NetworkManager_test.ts
index 28bbe22..80183de 100644
--- a/test/unittests/front_end/core/sdk/NetworkManager_test.ts
+++ b/test/unittests/front_end/core/sdk/NetworkManager_test.ts

@@ -361,7 +361,6 @@
 
   beforeEach(async () => {
     SDK.NetworkManager.MultitargetNetworkManager.dispose();
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
     target = createTarget();
     const networkPersistenceManager =

diff --git a/test/unittests/front_end/helpers/EnvironmentHelpers.ts b/test/unittests/front_end/helpers/EnvironmentHelpers.ts
index 140ef98..1afe262 100644
--- a/test/unittests/front_end/helpers/EnvironmentHelpers.ts
+++ b/test/unittests/front_end/helpers/EnvironmentHelpers.ts

@@ -100,6 +100,7 @@
   'timelineEventInitiators',
   'inputEventsOnTimelineOverview',
   'timelineAsConsoleProfileResultPanel',
+  'headerOverrides',
 ];
 
 export async function initializeGlobalVars({reset = true} = {}) {

diff --git a/test/unittests/front_end/models/bindings/BreakpointManager_test.ts b/test/unittests/front_end/models/bindings/BreakpointManager_test.ts
index ccfde97..0164230 100644
--- a/test/unittests/front_end/models/bindings/BreakpointManager_test.ts
+++ b/test/unittests/front_end/models/bindings/BreakpointManager_test.ts

@@ -1178,8 +1178,6 @@
     });
 
     it('can move breakpoints to network files that are set in override files', async () => {
-      Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '', true);
-
       const workspace = Workspace.Workspace.WorkspaceImpl.instance();
       SDK.NetworkManager.MultitargetNetworkManager.instance({forceNew: true});
       Persistence.Persistence.PersistenceImpl.instance({forceNew: true, workspace, breakpointManager});

diff --git a/test/unittests/front_end/models/persistence/NetworkPersistenceManager_test.ts b/test/unittests/front_end/models/persistence/NetworkPersistenceManager_test.ts
index dc8bb53..61aaba2 100644
--- a/test/unittests/front_end/models/persistence/NetworkPersistenceManager_test.ts
+++ b/test/unittests/front_end/models/persistence/NetworkPersistenceManager_test.ts

@@ -21,7 +21,6 @@
 
   beforeEach(async () => {
     SDK.NetworkManager.MultitargetNetworkManager.dispose();
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
     const target = createTarget();
     networkPersistenceManager =
@@ -589,7 +588,6 @@
 describeWithMockConnection('NetworkPersistenceManager', () => {
   beforeEach(() => {
     SDK.NetworkManager.MultitargetNetworkManager.dispose();
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
   });
 

diff --git a/test/unittests/front_end/panels/network/NetworkItemView_test.ts b/test/unittests/front_end/panels/network/NetworkItemView_test.ts
index 746fd2a..233c111 100644
--- a/test/unittests/front_end/panels/network/NetworkItemView_test.ts
+++ b/test/unittests/front_end/panels/network/NetworkItemView_test.ts

@@ -29,7 +29,6 @@
 
 describeWithMockConnection('NetworkItemView', () => {
   beforeEach(() => {
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     setUpEnvironment();
   });
 

diff --git a/test/unittests/front_end/panels/network/RequestHeadersView_test.ts b/test/unittests/front_end/panels/network/RequestHeadersView_test.ts
index 4b371d3..cf1bb9e 100644
--- a/test/unittests/front_end/panels/network/RequestHeadersView_test.ts
+++ b/test/unittests/front_end/panels/network/RequestHeadersView_test.ts

@@ -29,7 +29,6 @@
 
 describeWithMockConnection('RequestHeadersView', () => {
   beforeEach(() => {
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
   });
   afterEach(async () => {

diff --git a/test/unittests/front_end/panels/network/components/RequestHeadersView_test.ts b/test/unittests/front_end/panels/network/components/RequestHeadersView_test.ts
index 6d8e6b3..fbc379e 100644
--- a/test/unittests/front_end/panels/network/components/RequestHeadersView_test.ts
+++ b/test/unittests/front_end/panels/network/components/RequestHeadersView_test.ts

@@ -107,7 +107,6 @@
   let component: HTMLElement|null|undefined = null;
 
   beforeEach(() => {
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
     setUpEnvironment();
   });

diff --git a/test/unittests/front_end/panels/network/components/ResponseHeaderSection_test.ts b/test/unittests/front_end/panels/network/components/ResponseHeaderSection_test.ts
index 8edddfe..cabe476 100644
--- a/test/unittests/front_end/panels/network/components/ResponseHeaderSection_test.ts
+++ b/test/unittests/front_end/panels/network/components/ResponseHeaderSection_test.ts

@@ -169,7 +169,6 @@
 
 describeWithEnvironment('ResponseHeaderSection', () => {
   before(() => {
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
   });
 

diff --git a/test/unittests/front_end/panels/sources/SourcesView_test.ts b/test/unittests/front_end/panels/sources/SourcesView_test.ts
index 16cd287..cc07468 100644
--- a/test/unittests/front_end/panels/sources/SourcesView_test.ts
+++ b/test/unittests/front_end/panels/sources/SourcesView_test.ts

@@ -22,7 +22,6 @@
 describe('SourcesView', () => {
   beforeEach(async () => {
     await initializeGlobalVars();
-    Root.Runtime.experiments.register(Root.Runtime.ExperimentName.HEADER_OVERRIDES, '');
     Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
     const actionRegistryInstance = UI.ActionRegistry.ActionRegistry.instance({forceNew: true});
     const workspace = Workspace.Workspace.WorkspaceImpl.instance();

diff --git a/test/unittests/front_end/ui/components/request_link_icon/RequestLinkIcon_test.ts b/test/unittests/front_end/ui/components/request_link_icon/RequestLinkIcon_test.ts
index 4529f3a..2a2c5ec 100644
--- a/test/unittests/front_end/ui/components/request_link_icon/RequestLinkIcon_test.ts
+++ b/test/unittests/front_end/ui/components/request_link_icon/RequestLinkIcon_test.ts

@@ -11,7 +11,9 @@
 import {assertElement, assertShadowRoot, renderElementIntoDOM} from '../../../helpers/DOMHelpers.js';
 import * as Coordinator from '../../../../../../front_end/ui/components/render_coordinator/render_coordinator.js';
 import type * as Protocol from '../../../../../../front_end/generated/protocol.js';
-import {describeWithLocale} from '../../../helpers/EnvironmentHelpers.js';
+import {describeWithEnvironment, describeWithLocale} from '../../../helpers/EnvironmentHelpers.js';
+import * as NetworkForward from '../../../../../../front_end/panels/network/forward/forward.js';
+import * as Root from '../../../../../../front_end/core/root/root.js';
 
 const {assert} = chai;
 
@@ -311,7 +313,7 @@
     });
   });
 
-  describe('handles clicks correctly', () => {
+  describeWithEnvironment('handles clicks correctly', () => {
     const mockRequest = {
       url() {
         return 'http://foo.bar/baz';
@@ -319,6 +321,7 @@
     };
 
     it('if the icon is clicked', async () => {
+      Root.Runtime.experiments.enableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
       const revealOverride = sinon.fake(Common.Revealer.reveal);
       const {shadowRoot} = await renderRequestLinkIcon({
         request: mockRequest as unknown as SDK.NetworkRequest.NetworkRequest,
@@ -331,9 +334,12 @@
       icon.click();
 
       assert.isTrue(revealOverride.called);
+      assert.isTrue(revealOverride.calledOnceWith(
+          sinon.match({tab: NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent})));
     });
 
     it('if the container is clicked', async () => {
+      Root.Runtime.experiments.disableForTest(Root.Runtime.ExperimentName.HEADER_OVERRIDES);
       const revealOverride = sinon.fake(Common.Revealer.reveal);
       const {shadowRoot} = await renderRequestLinkIcon({
         request: mockRequest as unknown as SDK.NetworkRequest.NetworkRequest,
@@ -346,6 +352,8 @@
       container.click();
 
       assert.isTrue(revealOverride.called);
+      assert.isTrue(
+          revealOverride.calledOnceWith(sinon.match({tab: NetworkForward.UIRequestLocation.UIRequestTabs.Headers})));
     });
 
     it('if the label is clicked', async () => {