chrome-devtools-frontend 1.0.1362775 → 1.0.1367881

package/front_end/panels/freestyler/components/ProvideFeedback.ts

@@ -12,6 +12,8 @@ import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
 
 import provideFeedbackStyles from './provideFeedback.css.js';
 
+const {html} = LitHtml;
+
 /*
 * Strings that don't need to be translated at this time.
 */
@@ -119,8 +121,8 @@ export class ProvideFeedback extends HTMLElement {
 
   #renderButtons(): LitHtml.TemplateResult {
     // clang-format off
-    return LitHtml.html`
-      <${Buttons.Button.Button.litTagName}
+    return html`
+      <devtools-button
         .data=${{
           variant: Buttons.Button.Variant.ICON,
           size: Buttons.Button.Size.SMALL,
@@ -132,8 +134,8 @@ export class ProvideFeedback extends HTMLElement {
           jslogContext: 'thumbs-up',
         } as Buttons.Button.ButtonData}
         @click=${() => this.#handleRateClick(Host.AidaClient.Rating.POSITIVE)}
-      ></${Buttons.Button.Button.litTagName}>
-      <${Buttons.Button.Button.litTagName}
+      ></devtools-button>
+      <devtools-button
         .data=${{
           variant: Buttons.Button.Variant.ICON,
           size: Buttons.Button.Size.SMALL,
@@ -145,9 +147,9 @@ export class ProvideFeedback extends HTMLElement {
           jslogContext: 'thumbs-down',
         } as Buttons.Button.ButtonData}
         @click=${() => this.#handleRateClick(Host.AidaClient.Rating.NEGATIVE)}
-      ></${Buttons.Button.Button.litTagName}>
+      ></devtools-button>
       <div class="vertical-separator"></div>
-      <${Buttons.Button.Button.litTagName}
+      <devtools-button
         .data=${
           {
             variant: Buttons.Button.Variant.ICON,
@@ -158,20 +160,20 @@ export class ProvideFeedback extends HTMLElement {
           } as Buttons.Button.ButtonData
         }
         @click=${this.#handleReportClick}
-      ></${Buttons.Button.Button.litTagName}>
+      ></devtools-button>
     `;
     // clang-format on
   }
 
   #renderFeedbackForm(): LitHtml.LitTemplate {
     // clang-format off
-    return LitHtml.html`
+    return html`
       <form class="feedback-form" @submit=${this.#handleSubmit}>
         <div class="feedback-header">
           <h4 class="feedback-title">${lockedString(
               UIStringsNotTranslate.whyThisRating,
           )}</h4>
-          <${Buttons.Button.Button.litTagName}
+          <devtools-button
             aria-label=${lockedString(UIStringsNotTranslate.close)}
             @click=${this.#handleClose}
             .data=${
@@ -183,7 +185,7 @@ export class ProvideFeedback extends HTMLElement {
                 jslogContext: 'close',
               } as Buttons.Button.ButtonData
             }
-          ></${Buttons.Button.Button.litTagName}>
+          ></devtools-button>
         </div>
         <input
           type="text"
@@ -196,7 +198,7 @@ export class ProvideFeedback extends HTMLElement {
         <span class="feedback-disclaimer">${
           lockedString(UIStringsNotTranslate.disclaimer)
         }</span>
-        <${Buttons.Button.Button.litTagName}
+        <devtools-button
         aria-label=${lockedString(UIStringsNotTranslate.submit)}
         .data=${
           {
@@ -209,8 +211,9 @@ export class ProvideFeedback extends HTMLElement {
           }
         >${
           lockedString(UIStringsNotTranslate.submit)
-        }</${Buttons.Button.Button.litTagName}>
+        }</devtools-button>
       </div>
+    </form>
     `;
     // clang-format on
   }
@@ -218,7 +221,7 @@ export class ProvideFeedback extends HTMLElement {
   #render(): void {
     // clang-format off
     LitHtml.render(
-      LitHtml.html`
+      html`
         <div class="feedback">
           <div class="rate-buttons">
             ${this.#renderButtons()}

package/front_end/panels/freestyler/components/freestylerChatUi.css

@@ -30,10 +30,9 @@
 .input-form {
   display: flex;
   flex-direction: column;
-  padding: var(--sys-size-8) var(--sys-size-4) 0 var(--sys-size-4);
+  padding: var(--sys-size-8) var(--sys-size-5) 0 var(--sys-size-5);
   max-width: var(--sys-size-36);
   width: 100%;
-  margin: 0 auto;
 }
 
 .chat-input-container {
@@ -105,13 +104,14 @@
 .messages-scroll-container {
   overflow: auto;
   flex-grow: 1;
-  scrollbar-gutter: stable;
+  scrollbar-gutter: stable both-edges;
+  scrollbar-width: thin;
+  width: 100%;
 }
 
 .messages-container {
   margin: 0 auto;
   max-width: var(--sys-size-36);
-  padding: 0 var(--sys-size-4);
 }
 
 .chat-message {
@@ -193,15 +193,28 @@
     top: 0;
     visibility: var(--visibility-if-can-scroll, hidden);
     animation-range: var(--sys-size-6) var(--sys-size-11); /* stylelint-disable-line property-no-unknown */
-    background: radial-gradient(farthest-side at 0 50%, var(--app-color-scroll-area-shadow-start), transparent);
+    background:
+      radial-gradient(
+        farthest-side at 0 50%,
+        var(--app-color-scroll-area-shadow-start),
+        transparent
+      );
   }
 
   .suggestions::after {
     bottom: 0;
     visibility: var(--visibility-if-can-scroll, hidden);
     animation-direction: reverse;
-    animation-range: calc(100% - var(--sys-size-11)) calc(100% - var(--sys-size-6)); /* stylelint-disable-line property-no-unknown */
-    background: radial-gradient(farthest-side at 100% 50%, var(--app-color-scroll-area-shadow-start), transparent);
+    /* stylelint-disable-next-line property-no-unknown */
+    animation-range:
+      calc(100% - var(--sys-size-11))
+      calc(100% - var(--sys-size-6));
+    background:
+      radial-gradient(
+        farthest-side at 100% 50%,
+        var(--app-color-scroll-area-shadow-start),
+        transparent
+      );
   }
 
   .aborted {
@@ -216,6 +229,11 @@
   width: 100%;
 
   .resource-link {
+    cursor: pointer;
+  }
+
+  .resource-link,
+  .resource-task {
     padding: var(--sys-size-2) var(--sys-size-4);
     font: var(--sys-typescale-body4-size);
     border: var(--sys-size-1) solid var(--sys-color-divider);
@@ -224,7 +242,6 @@
     text-overflow: ellipsis;
     white-space: nowrap;
     max-width: var(--sys-size-32);
-    cursor: pointer;
 
     .icon {
       display: inline-flex;
@@ -234,6 +251,30 @@
       height: var(--sys-size-9);
     }
 
+    /*
+      CSS styling for `network-override-marker` is similar to
+      https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/panels/network/networkLogView.css;l=379.
+      There is a difference in `left` and `top` values to make sure
+      it is placed correctly for the network icon in assistance panel.
+    */
+    .network-override-marker {
+      position: relative;
+      float: left;
+    }
+
+    .network-override-marker::before {
+      content: var(--image-file-empty);
+      width: var(--sys-size-4);
+      height: var(--sys-size-4);
+      border-radius: 50%;
+      outline: var(--sys-size-1) solid var(--icon-gap-focus-selected);
+      left: 11px;
+      position: absolute;
+      top: 13px;
+      z-index: 1;
+      background-color: var(--sys-color-purple-bright);
+    }
+
     .image.icon {
       display: inline-flex;
       justify-content: center;
@@ -247,7 +288,8 @@
     }
   }
 
-  .resource-link.not-selected {
+  .resource-link.not-selected,
+  .resource-task.not-selected {
     color: var(--sys-color-state-disabled);
     border-color: var(--sys-color-neutral-outline);
   }
@@ -279,6 +321,12 @@
   }
 }
 
+.step-code {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sys-size-2);
+}
+
 .js-code-output {
   devtools-code-block {
     --code-block-max-code-height: 50px;
@@ -369,10 +417,7 @@
     padding: 0 var(--sys-size-5) var(--sys-size-4) var(--sys-size-12);
     display: flex;
     flex-direction: column;
-
-    p {
-      margin-bottom: var(--sys-size-5);
-    }
+    gap: var(--sys-size-6);
 
     devtools-code-block {
       --code-block-background-color: var(--sys-color-surface1);
@@ -409,12 +454,12 @@
 .link {
   color: var(--text-link);
   text-decoration: underline;
+  cursor: pointer;
 }
 
 button.link {
   border: none;
   background: none;
-  cursor: pointer;
   font: inherit;
 }
 
@@ -422,13 +467,20 @@ button.link {
   margin-left: 2px;
 }
 
+main {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: 100%;
+  overflow-y: auto;
+}
+
 .empty-state-container {
   display: grid;
   align-items: center;
   justify-content: center;
   font: var(--sys-typescale-headline4);
   gap: var(--sys-size-11);
-  height: 100%;
   padding: var(--sys-size-3);
 
   .header {
@@ -455,7 +507,7 @@ button.link {
         );
     }
 
-    h2 {
+    h1 {
       font: var(--sys-typescale-headline4);
     }
   }
@@ -470,7 +522,7 @@ button.link {
   }
 }
 
-.opt-in {
+.disabled-view {
   border-radius: var(--sys-shape-corner-small);
   padding: var(--sys-size-6) var(--sys-size-8);
   box-shadow: var(--drop-shadow);
@@ -478,8 +530,9 @@ button.link {
   margin: var(--sys-size-8);
   max-width: var(--sys-size-34);
   display: flex;
+  text-wrap: pretty;
 
-  .opt-in-icon-container {
+  .disabled-view-icon-container {
     border-radius: var(--sys-shape-corner-extra-small);
     width: var(--sys-size-9);
     height: var(--sys-size-9);
@@ -497,12 +550,6 @@ button.link {
   }
 }
 
-.action-result {
-  /* devtools-code-block adds `margin-top: 8px` however we want the margin between `.action-result` and `.js-code-output` to be 2px
-  that's why we use -6px here. */
-  margin-bottom: -6px;
-}
-
 .error-step {
   color: var(--sys-color-error);
 }
@@ -520,8 +567,13 @@ button.link {
 }
 
 @keyframes reveal {
-  0% { opacity: 0%; }
-  100% { opacity: 100%; }
+  0% {
+    opacity: 0%;
+  }
+
+  100% {
+    opacity: 100%;
+  }
 }
 
 @keyframes detect-scroll {

package/front_end/panels/freestyler/freestyler-meta.ts

@@ -4,7 +4,7 @@
 
 import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
-import type * as Root from '../../core/root/root.js';
+import * as Root from '../../core/root/root.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import type * as Freestyler from './freestyler.js';
@@ -32,7 +32,7 @@ const UIStrings = {
    *@description Text of a tooltip to redirect to the AI assistance panel with
    * the current element as context
    */
-  askAiAssistance: 'Ask AI assistance',
+  askAi: 'Ask AI',
   /**
    * @description Message shown to the user if the DevTools locale is not
    * supported.
@@ -58,7 +58,7 @@ const str_ = i18n.i18n.registerUIStrings('panels/freestyler/freestyler-meta.ts',
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
 
-const setting = 'freestyler-enabled';
+const setting = 'ai-assistance-enabled';
 
 function isLocaleRestricted(): boolean {
   const devtoolsLocale = i18n.DevToolsLocale.DevToolsLocale.instance();
@@ -86,14 +86,24 @@ async function loadFreestylerModule(): Promise<typeof Freestyler> {
 }
 
 function isFeatureAvailable(config?: Root.Runtime.HostConfig): boolean {
-  return (config?.aidaAvailability?.enabled && config?.devToolsFreestylerDogfood?.enabled) === true;
+  return (config?.aidaAvailability?.enabled && config?.devToolsFreestyler?.enabled) === true;
 }
 
-function isDrJonesFeatureAvailable(config?: Root.Runtime.HostConfig): boolean {
-  return (config?.aidaAvailability?.enabled && config?.devToolsFreestylerDogfood?.enabled &&
+function isDrJonesNetworkFeatureAvailable(config?: Root.Runtime.HostConfig): boolean {
+  return (config?.aidaAvailability?.enabled && config?.devToolsFreestyler?.enabled &&
           config?.devToolsExplainThisResourceDogfood?.enabled) === true;
 }
 
+function isDrJonesPerformanceFeatureAvailable(config?: Root.Runtime.HostConfig): boolean {
+  return (config?.aidaAvailability?.enabled && config?.devToolsFreestyler?.enabled &&
+          config?.devToolsAiAssistancePerformanceAgentDogfood?.enabled) === true;
+}
+
+function isDrJonesFileFeatureAvailable(config?: Root.Runtime.HostConfig): boolean {
+  return (config?.aidaAvailability?.enabled && config?.devToolsFreestyler?.enabled &&
+          config?.devToolsAiAssistanceFileAgentDogfood?.enabled) === true;
+}
+
 UI.ViewManager.registerViewExtension({
   location: UI.ViewManager.ViewLocationValues.DRAWER_VIEW,
   id: 'freestyler',
@@ -136,13 +146,28 @@ Common.Settings.registerSettingExtension({
   },
 });
 
+UI.ActionRegistration.registerActionExtension({
+  actionId: 'freestyler.elements-floating-button',
+  contextTypes(): [] {
+    return [];
+  },
+  experiment: Root.Runtime.ExperimentName.FLOATING_ENTRY_POINTS_FOR_AI_ASSISTANCE,
+  category: UI.ActionRegistration.ActionCategory.GLOBAL,
+  title: i18nLazyString(UIStrings.askAi),
+  async loadActionDelegate() {
+    const Freestyler = await loadFreestylerModule();
+    return new Freestyler.ActionDelegate();
+  },
+  condition: config => isFeatureAvailable(config) && !isPolicyRestricted(config),
+});
+
 UI.ActionRegistration.registerActionExtension({
   actionId: 'freestyler.element-panel-context',
   contextTypes(): [] {
     return [];
   },
   category: UI.ActionRegistration.ActionCategory.GLOBAL,
-  title: i18nLazyString(UIStrings.askAiAssistance),
+  title: i18nLazyString(UIStrings.askAi),
   async loadActionDelegate() {
     const Freestyler = await loadFreestylerModule();
     return new Freestyler.ActionDelegate();
@@ -156,10 +181,40 @@ UI.ActionRegistration.registerActionExtension({
     return [];
   },
   category: UI.ActionRegistration.ActionCategory.GLOBAL,
-  title: i18nLazyString(UIStrings.askAiAssistance),
+  title: i18nLazyString(UIStrings.askAi),
+  async loadActionDelegate() {
+    const Freestyler = await loadFreestylerModule();
+    return new Freestyler.ActionDelegate();
+  },
+  condition: config => isDrJonesNetworkFeatureAvailable(config) && !isPolicyRestricted(config),
+});
+
+UI.ActionRegistration.registerActionExtension({
+  actionId: 'drjones.performance-panel-context',
+  contextTypes(): [] {
+    return [];
+  },
+  setting,
+  category: UI.ActionRegistration.ActionCategory.GLOBAL,
+  title: i18nLazyString(UIStrings.askAi),
+  async loadActionDelegate() {
+    const Freestyler = await loadFreestylerModule();
+    return new Freestyler.ActionDelegate();
+  },
+  condition: config => isDrJonesPerformanceFeatureAvailable(config) && !isPolicyRestricted(config),
+});
+
+UI.ActionRegistration.registerActionExtension({
+  actionId: 'drjones.sources-panel-context',
+  contextTypes() {
+    return [];
+  },
+  setting,
+  category: UI.ActionRegistration.ActionCategory.GLOBAL,
+  title: i18nLazyString(UIStrings.askAi),
   async loadActionDelegate() {
     const Freestyler = await loadFreestylerModule();
     return new Freestyler.ActionDelegate();
   },
-  condition: config => isDrJonesFeatureAvailable(config) && !isPolicyRestricted(config),
+  condition: config => isDrJonesFileFeatureAvailable(config) && !isPolicyRestricted(config),
 });

package/front_end/panels/freestyler/freestyler.ts

@@ -4,7 +4,9 @@
 
 export * from './AiAgent.js';
 export * from './ChangeManager.js';
+export * from './DrJonesFileAgent.js';
 export * from './DrJonesNetworkAgent.js';
+export * from './DrJonesPerformanceAgent.js';
 export * from './components/FreestylerChatUi.js';
 export * from './components/ProvideFeedback.js';
 export * from './ExtensionScope.js';

package/front_end/panels/issues/AffectedResourcesView.ts

@@ -17,8 +17,8 @@ import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 
-import {type AggregatedIssue} from './IssueAggregator.js';
-import {type IssueView} from './IssueView.js';
+import type {AggregatedIssue} from './IssueAggregator.js';
+import type {IssueView} from './IssueView.js';
 
 const UIStrings = {
   /**

package/front_end/panels/issues/AttributionReportingIssueDetailsView.ts

@@ -2,9 +2,9 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import type * as Protocol from '../../generated/protocol.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
+import type * as Protocol from '../../generated/protocol.js';
 import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 
 import {AffectedItem, AffectedResourcesView} from './AffectedResourcesView.js';
@@ -43,10 +43,11 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
   override update(): void {
     this.clear();
     const issues = this.issue.getAttributionReportingIssues();
-    if (issues.size > 0) {
-      this.#appendDetails(issues.values().next().value.code(), issues);
-    } else {
+    const issue = issues.values().next();
+    if (issue.done) {
       this.updateAffectedResourceCount(0);
+    } else {
+      this.#appendDetails(issue.value.code(), issues);
     }
   }
 

package/front_end/panels/issues/CorsIssueDetailsView.ts

@@ -10,9 +10,8 @@ import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
 
 import {AffectedItem, AffectedResourcesView} from './AffectedResourcesView.js';
-
-import {type AggregatedIssue} from './IssueAggregator.js';
-import {type IssueView} from './IssueView.js';
+import type {AggregatedIssue} from './IssueAggregator.js';
+import type {IssueView} from './IssueView.js';
 
 const UIStrings = {
   /**
@@ -489,10 +488,11 @@ export class CorsIssueDetailsView extends AffectedResourcesView {
   update(): void {
     this.clear();
     const issues = this.issue.getCorsIssues();
-    if (issues.size > 0) {
-      this.#appendDetails(issues.values().next().value.code(), issues);
-    } else {
+    const issue = issues.values().next();
+    if (issue.done) {
       this.updateAffectedResourceCount(0);
+    } else {
+      this.#appendDetails(issue.value.code(), issues);
     }
   }
 }

package/front_end/panels/issues/GenericIssueDetailsView.ts

@@ -4,8 +4,8 @@
 
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as Platform from '../../core/platform/platform.js';
-import type * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as Protocol from '../../generated/protocol.js';
+import type * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 
 import {AffectedResourcesView} from './AffectedResourcesView.js';
 
@@ -35,8 +35,8 @@ export class GenericIssueDetailsView extends AffectedResourcesView {
   #appendDetails(genericIssues: ReadonlySet<IssuesManager.GenericIssue.GenericIssue>): void {
     const header = document.createElement('tr');
 
-    const sampleIssueDetails = genericIssues.values().next().value.details();
-    if (sampleIssueDetails.frameId) {
+    const sampleIssueDetails = genericIssues.values().next().value?.details();
+    if (sampleIssueDetails?.frameId) {
       this.appendColumnTitle(header, i18nString(UIStrings.frameId));
     }
 

package/front_end/panels/issues/IssueView.ts

@@ -30,10 +30,10 @@ import {AffectedSourcesView} from './AffectedSourcesView.js';
 import {AffectedTrackingSitesView} from './AffectedTrackingSitesView.js';
 import {AttributionReportingIssueDetailsView} from './AttributionReportingIssueDetailsView.js';
 import * as Components from './components/components.js';
-import {type HiddenIssuesMenuData} from './components/HideIssuesMenu.js';
+import type {HiddenIssuesMenuData} from './components/HideIssuesMenu.js';
 import {CorsIssueDetailsView} from './CorsIssueDetailsView.js';
 import {GenericIssueDetailsView} from './GenericIssueDetailsView.js';
-import {type AggregatedIssue} from './IssueAggregator.js';
+import type {AggregatedIssue} from './IssueAggregator.js';
 
 const UIStrings = {
   /**

package/front_end/panels/issues/components/ElementsPanelLink.ts

@@ -7,6 +7,8 @@ import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
 
 import elementsPanelLinkStyles from './elementsPanelLink.css.js';
 
+const {html} = LitHtml;
+
 export interface ElementsPanelLinkData {
   onElementRevealIconClick: (event?: Event) => void;
   onElementRevealIconMouseEnter: (event?: Event) => void;
@@ -37,7 +39,7 @@ export class ElementsPanelLink extends HTMLElement {
 
   #render(): void {
     // clang-format off
-      LitHtml.render(LitHtml.html`
+      LitHtml.render(html`
       <span
         class="element-reveal-icon"
         jslog=${VisualLogging.link('elements-panel').track({click: true})}

package/front_end/panels/issues/components/HideIssuesMenu.ts

@@ -8,10 +8,11 @@ import * as i18n from '../../../core/i18n/i18n.js';
 import * as Buttons from '../../../ui/components/buttons/buttons.js';
 import * as UI from '../../../ui/legacy/legacy.js';
 import * as LitHtml from '../../../ui/lit-html/lit-html.js';
-import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
 
 import hideIssuesMenuStyles from './hideIssuesMenu.css.js';
 
+const {html} = LitHtml;
+
 const UIStrings = {
   /**
    *@description Title for the tooltip of the (3 dots) Hide Issues menu icon.
@@ -58,12 +59,12 @@ export class HideIssuesMenu extends HTMLElement {
   #render(): void {
     // Disabled until https://crbug.com/1079231 is fixed.
     // clang-format off
-    LitHtml.render(LitHtml.html`
-    <${Buttons.Button.Button.litTagName}
+    LitHtml.render(html`
+    <devtools-button
       .data=${{variant: Buttons.Button.Variant.ICON,iconName: 'dots-vertical', title: i18nString(UIStrings.tooltipTitle)} as Buttons.Button.ButtonData}
-      .jslogContext=${VisualLogging.dropDown('hide-issues').track({click: true})}
+      .jslogContext=${'hide-issues'}
       class="hide-issues-menu-btn"
-      @click=${this.onMenuOpen.bind(this)}></${Buttons.Button.Button.litTagName}>
+      @click=${this.onMenuOpen.bind(this)}></devtools-button>
     `, this.#shadow, {host: this});
   }
 }

package/front_end/panels/lighthouse/LighthouseController.ts

@@ -11,8 +11,8 @@ import * as Protocol from '../../generated/protocol.js';
 import * as EmulationModel from '../../models/emulation/emulation.js';
 import * as Emulation from '../emulation/emulation.js';
 
-import {type LighthouseRun, type ProtocolService} from './LighthouseProtocolService.js';
-import {type RunnerResult} from './LighthouseReporterTypes.js';
+import type {LighthouseRun, ProtocolService} from './LighthouseProtocolService.js';
+import type {RunnerResult} from './LighthouseReporterTypes.js';
 
 const UIStrings = {
   /**

package/front_end/panels/lighthouse/LighthousePanel.ts

@@ -16,7 +16,7 @@ import {
 } from './LighthouseController.js';
 import lighthousePanelStyles from './lighthousePanel.css.js';
 import {ProtocolService} from './LighthouseProtocolService.js';
-import {type ReportJSON, type RunnerResultArtifacts} from './LighthouseReporterTypes.js';
+import type {ReportJSON, RunnerResultArtifacts} from './LighthouseReporterTypes.js';
 import {LighthouseReportRenderer} from './LighthouseReportRenderer.js';
 import {Item, ReportSelector} from './LighthouseReportSelector.js';
 import {StartView} from './LighthouseStartView.js';

package/front_end/panels/lighthouse/LighthouseReportRenderer.ts

@@ -12,12 +12,8 @@ import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
 
-import {
-  type NodeDetailsJSON,
-  type ReportJSON,
-  type RunnerResultArtifacts,
-  type SourceLocationDetailsJSON,
-} from './LighthouseReporterTypes.js';
+import type {
+  NodeDetailsJSON, ReportJSON, RunnerResultArtifacts, SourceLocationDetailsJSON} from './LighthouseReporterTypes.js';
 
 const MaxLengthForLinks = 40;
 

package/front_end/panels/lighthouse/LighthouseStartView.ts

@@ -9,7 +9,7 @@ import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import {type LighthouseController, type Preset, Presets, RuntimeSettings} from './LighthouseController.js';
-import {type LighthousePanel} from './LighthousePanel.js';
+import type {LighthousePanel} from './LighthousePanel.js';
 import lighthouseStartViewStyles from './lighthouseStartView.css.js';
 import {RadioSetting} from './RadioSetting.js';