chrome-devtools-frontend 1.0.1593518 → 1.0.1595090

package/front_end/models/issues_manager/issues_manager.ts

@@ -7,7 +7,6 @@ import * as CheckFormsIssuesTrigger from './CheckFormsIssuesTrigger.js';
 import * as ClientHintIssue from './ClientHintIssue.js';
 import * as ConnectionAllowlistIssue from './ConnectionAllowlistIssue.js';
 import * as ContentSecurityPolicyIssue from './ContentSecurityPolicyIssue.js';
-import * as ContrastCheckTrigger from './ContrastCheckTrigger.js';
 import * as CookieDeprecationMetadataIssue from './CookieDeprecationMetadataIssue.js';
 import * as CookieIssue from './CookieIssue.js';
 import * as CorsIssue from './CorsIssue.js';
@@ -21,7 +20,6 @@ import * as Issue from './Issue.js';
 import * as IssueAggregator from './IssueAggregator.js';
 import * as IssueResolver from './IssueResolver.js';
 import * as IssuesManager from './IssuesManager.js';
-import * as LowTextContrastIssue from './LowTextContrastIssue.js';
 import * as MarkdownIssueDescription from './MarkdownIssueDescription.js';
 import * as MixedContentIssue from './MixedContentIssue.js';
 import * as PartitioningBlobURLIssue from './PartitioningBlobURLIssue.js';
@@ -29,6 +27,7 @@ import * as PermissionElementIssue from './PermissionElementIssue.js';
 import * as PropertyRuleIssue from './PropertyRuleIssue.js';
 import * as QuirksModeIssue from './QuirksModeIssue.js';
 import * as RelatedIssue from './RelatedIssue.js';
+import * as SelectivePermissionsInterventionIssue from './SelectivePermissionsInterventionIssue.js';
 import * as SharedArrayBufferIssue from './SharedArrayBufferIssue.js';
 import * as SharedDictionaryIssue from './SharedDictionaryIssue.js';
 import * as SourceFrameIssuesManager from './SourceFrameIssuesManager.js';
@@ -42,7 +41,6 @@ export {
   ClientHintIssue,
   ConnectionAllowlistIssue,
   ContentSecurityPolicyIssue,
-  ContrastCheckTrigger,
   CookieDeprecationMetadataIssue,
   CookieIssue,
   CorsIssue,
@@ -56,7 +54,6 @@ export {
   IssueAggregator,
   IssueResolver,
   IssuesManager,
-  LowTextContrastIssue,
   MarkdownIssueDescription,
   MixedContentIssue,
   PartitioningBlobURLIssue,
@@ -64,6 +61,7 @@ export {
   PropertyRuleIssue,
   QuirksModeIssue,
   RelatedIssue,
+  SelectivePermissionsInterventionIssue,
   SharedArrayBufferIssue,
   SharedDictionaryIssue,
   SourceFrameIssuesManager,

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -2485,6 +2485,11 @@ export const NativeFunctions = [
     signatures: [["qualifiedName"],["name"]],
     receivers: ["Element"]
   },
+  {
+    name: "getAttribute",
+    signatures: [["name"]],
+    receivers: ["ProcessingInstruction"]
+  },
   {
     name: "getAttribute",
     signatures: [["tag"]],
@@ -2508,7 +2513,13 @@ export const NativeFunctions = [
   },
   {
     name: "hasAttribute",
-    signatures: [["qualifiedName"],["name"]]
+    signatures: [["qualifiedName"],["name"]],
+    receivers: ["Element"]
+  },
+  {
+    name: "hasAttribute",
+    signatures: [["name"]],
+    receivers: ["ProcessingInstruction"]
   },
   {
     name: "hasAttributeNS",
@@ -2543,6 +2554,11 @@ export const NativeFunctions = [
     signatures: [["qualifiedName"],["name"]],
     receivers: ["Element"]
   },
+  {
+    name: "removeAttribute",
+    signatures: [["name"]],
+    receivers: ["ProcessingInstruction"]
+  },
   {
     name: "removeAttribute",
     signatures: [["attribute"]],
@@ -2586,6 +2602,11 @@ export const NativeFunctions = [
     signatures: [["qualifiedName","value"],["name","value"]],
     receivers: ["Element"]
   },
+  {
+    name: "setAttribute",
+    signatures: [["name","value"]],
+    receivers: ["ProcessingInstruction"]
+  },
   {
     name: "setAttribute",
     signatures: [["tag","value"]],
@@ -2619,7 +2640,13 @@ export const NativeFunctions = [
   },
   {
     name: "toggleAttribute",
-    signatures: [["qualifiedName","?force"]]
+    signatures: [["qualifiedName","?force"]],
+    receivers: ["Element"]
+  },
+  {
+    name: "toggleAttribute",
+    signatures: [["name","?force"]],
+    receivers: ["ProcessingInstruction"]
   },
   {
     name: "webkitMatchesSelector",
@@ -3149,7 +3176,7 @@ export const NativeFunctions = [
   },
   {
     name: "initKeyboardEvent",
-    signatures: [["typeArg","?bubblesArg","?cancelableArg","?viewArg","?keyArg","?locationArg","?ctrlKey","?altKey","?shiftKey","?metaKey"]]
+    signatures: [["typeArg","?bubblesArg","?cancelableArg","?viewArg","?keyArg","?locationArg","?ctrlKey","?altKey","?shiftKey","?metaKey"],["type","?bubbles","?cancelable","?view","?keyIdentifier","?location","?ctrlKey","?altKey","?shiftKey","?metaKey"]]
   },
   {
     name: "setKeyframes",
@@ -4183,7 +4210,7 @@ export const NativeFunctions = [
   },
   {
     name: "initUIEvent",
-    signatures: [["typeArg","?bubblesArg","?cancelableArg","?viewArg","?detailArg"],["type","?bubbles","?cancelable","?view","?detail"]]
+    signatures: [["typeArg","?bubblesArg","?cancelableArg","?viewArg","?detailArg"]]
   },
   {
     name: "getTranslatedShaderSource",
@@ -6817,6 +6844,10 @@ export const NativeFunctions = [
     name: "ErrorEvent",
     signatures: [["type","?eventInitDict"]]
   },
+  {
+    name: "FocusEvent",
+    signatures: [["type","?eventInitDict"]]
+  },
   {
     name: "HashChangeEvent",
     signatures: [["type","?eventInitDict"]]
@@ -6829,6 +6860,10 @@ export const NativeFunctions = [
     name: "InterestEvent",
     signatures: [["type","?eventInitDict"]]
   },
+  {
+    name: "KeyboardEvent",
+    signatures: [["type","?eventInitDict"]]
+  },
   {
     name: "MessageEvent",
     signatures: [["type","?eventInitDict"]]
@@ -6866,7 +6901,7 @@ export const NativeFunctions = [
     signatures: [["type","?eventInitDict"]]
   },
   {
-    name: "UIEvent",
+    name: "TouchEvent",
     signatures: [["type","?eventInitDict"]]
   },
   {
@@ -7221,6 +7256,10 @@ export const NativeFunctions = [
     name: "OffscreenCanvas",
     signatures: [["width","height"]]
   },
+  {
+    name: "OverscrollEvent",
+    signatures: [["type","?eventInitDict"]]
+  },
   {
     name: "setValueAndClosePopup",
     signatures: [["numberValue","stringValue","is_keyboard_event"]]
@@ -7321,10 +7360,6 @@ export const NativeFunctions = [
     name: "TaskPriorityChangeEvent",
     signatures: [["type","eventInitDict"]]
   },
-  {
-    name: "provideContext",
-    signatures: [["?options"]]
-  },
   {
     name: "registerTool",
     signatures: [["tool"]]
@@ -9250,6 +9285,10 @@ export const NativeFunctions = [
     name: "MIDIMessageEvent",
     signatures: [["type","?eventInitDict"]]
   },
+  {
+    name: "startDiagnosticLogging",
+    signatures: [["?options"]]
+  },
   {
     name: "CloseEvent",
     signatures: [["type","?eventInitDict"]]

package/front_end/models/lighthouse/lighthouse.ts

@@ -0,0 +1,9 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as ReporterTypes from './LighthouseReporterTypes.js';
+
+export {
+  ReporterTypes,
+};

package/front_end/models/persistence/persistence-meta.ts

@@ -9,7 +9,7 @@ const UIStrings = {
   /**
    * @description Title of a setting under the Persistence category in Settings
    */
-  enableLocalOverrides: 'Enable Local Overrides',
+  localOverrides: 'Local overrides',
   /**
    * @description A tag of Enable Local Overrides setting that can be searched in the command menu
    */
@@ -32,11 +32,11 @@ const UIStrings = {
    */
   request: 'request',
   /**
-   * @description Title of a setting under the Persistence category that can be invoked through the Command Menu
+   * @description Title of an option under the Persistence category that can be invoked through the Command Menu
    */
   enableOverrideNetworkRequests: 'Enable override network requests',
   /**
-   * @description Title of a setting under the Persistence category that can be invoked through the Command Menu
+   * @description Title of an option under the Persistence category that can be invoked through the Command Menu
    */
   disableOverrideNetworkRequests: 'Disable override network requests',
 } as const;
@@ -45,7 +45,7 @@ const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.PERSISTENCE,
-  title: i18nLazyString(UIStrings.enableLocalOverrides),
+  title: i18nLazyString(UIStrings.localOverrides),
   settingName: 'persistence-network-overrides-enabled',
   settingType: Common.Settings.SettingType.BOOLEAN,
   defaultValue: false,

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -693,7 +693,15 @@ export class AiAssistancePanel extends UI.Panel.Panel {
           blockedByCrossOrigin: this.#conversation.isBlockedByOrigin,
           isLoading: this.#isLoading,
           messages: this.#messages,
-          selectedContext: this.#conversation.selectedContext ?? null,
+          /**
+           * We pass either the selected context with isContextSelected=true
+           * to make sure the pill is show with normal styling and a remove button.
+           * Or we pass the panels default context with isContextSelected=false
+           * to display a placeholder pill with neutral styling and an add button.
+           */
+          context:
+              this.#conversation.selectedContext ?? this.#getConversationContext(this.#getDefaultConversationType()),
+          isContextSelected: Boolean(this.#conversation.selectedContext),
           conversationType: this.#conversation.type,
           isReadOnly: this.#conversation.isReadOnly ?? false,
           changeSummary: this.#getChangeSummary(),
@@ -857,17 +865,20 @@ export class AiAssistancePanel extends UI.Panel.Panel {
   #selectDefaultAgentIfNeeded(): void {
     // We don't change the current agent when there is a message in flight.
     if (this.#isLoading) {
+      this.requestUpdate();
       return;
     }
 
     // If there already is an agent and if it is not empty,
     // we don't automatically change the agent.
     if (this.#conversation && !this.#conversation.isEmpty) {
+      this.requestUpdate();
       return;
     }
 
     const targetConversationType = this.#getDefaultConversationType();
     if (this.#conversation?.type === targetConversationType) {
+      this.requestUpdate();
       // The above if makes sure even if we have an active agent it's empty
       // So we can just reuse it
       return;

package/front_end/panels/ai_assistance/components/ChatInput.ts

@@ -134,7 +134,8 @@ export interface ViewInput {
   blockedByCrossOrigin: boolean;
   isTextInputDisabled: boolean;
   inputPlaceholder: Platform.UIString.LocalizedString;
-  selectedContext: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null;
+  context: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null;
+  isContextSelected: boolean;
   inspectElementToggled: boolean;
   disclaimerText: string;
   conversationType: AiAssistanceModel.AiHistoryStorage.ConversationType;
@@ -183,7 +184,7 @@ function getContextRemoveLabel(context: AiAssistanceModel.AiAgent.ConversationCo
 export const DEFAULT_VIEW = (input: ViewInput, _output: ViewOutput, target: HTMLElement): void => {
   const chatInputContainerCls = Lit.Directives.classMap({
     'chat-input-container': true,
-    'single-line-layout': !input.selectedContext && !input.onContextAdd,
+    'single-line-layout': !input.context,
     disabled: input.isTextInputDisabled,
   });
 
@@ -300,7 +301,7 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: ViewOutput, target: HTML
             ></textarea>
             <div class="chat-input-actions">
               <div class="chat-input-actions-left">
-                ${input.selectedContext ?
+                ${input.context ?
                   html`
                     <div class="select-element">
                       ${input.conversationType === AiAssistanceModel.AiHistoryStorage.ConversationType.STYLING ?
@@ -321,29 +322,33 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: ViewOutput, target: HTML
                           ></devtools-button>`
                         : Lit.nothing}
                       <div
-                        class="resource-link"
+                        class=${Lit.Directives.classMap({
+                          'resource-link': true,
+                          disabled: !input.isContextSelected,
+                        })}
                       >
                         ${
-                          input.selectedContext instanceof AiAssistanceModel.StylingAgent.NodeContext ?
+                          input.context instanceof AiAssistanceModel.StylingAgent.NodeContext ?
                             html`
                               <devtools-widget
                                 class="title"
                                 .widgetConfig=${UI.Widget.widgetConfig(PanelsCommon.DOMLinkifier.DOMNodeLink, {
-                                  node: input.selectedContext.getItem(),
+                                  node: input.context.getItem(),
                                   options: {
-                                    hiddenClassList: input.selectedContext.getItem().classNames().filter(
+                                    disabled: !input.isContextSelected,
+                                    hiddenClassList: input.context.getItem().classNames().filter(
                                       className => className.startsWith(AiAssistanceModel.Injected.AI_ASSISTANCE_CSS_CLASS_NAME)),
                                     ariaDescription: i18nString(UIStrings.revealContextDescription),
                                   },
                                 })}
                               ></devtools-widget>` :
                             html`
-                          ${input.selectedContext instanceof AiAssistanceModel.NetworkAgent.RequestContext ?
-                            PanelUtils.PanelUtils.getIconForNetworkRequest(input.selectedContext.getItem()) :
-                            input.selectedContext instanceof AiAssistanceModel.FileAgent.FileContext ?
-                            PanelUtils.PanelUtils.getIconForSourceFile(input.selectedContext.getItem()) :
-                            input.selectedContext instanceof AiAssistanceModel.PerformanceAgent.PerformanceTraceContext ?
-                            html`<devtools-icon name="performance" title="Performance"></devtools-icon>` :
+                          ${input.context instanceof AiAssistanceModel.NetworkAgent.RequestContext ?
+                            PanelUtils.PanelUtils.getIconForNetworkRequest(input.context.getItem()) :
+                            input.context instanceof AiAssistanceModel.FileAgent.FileContext ?
+                            PanelUtils.PanelUtils.getIconForSourceFile(input.context.getItem()) :
+                            input.context instanceof AiAssistanceModel.PerformanceAgent.PerformanceTraceContext ?
+                            html`<devtools-icon class="icon" name="performance" title="Performance"></devtools-icon>` :
                             Lit.nothing}
                             <span 
                               role="button"
@@ -356,31 +361,31 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: ViewOutput, target: HTML
                                 }
                               }}
                               aria-description=${i18nString(UIStrings.revealContextDescription)}
-                            >${input.selectedContext.getTitle()}</span>`
+                            >${input.context.getTitle()}</span>`
                         }
-                        ${input.onContextRemoved ? html`
+                        ${input.isContextSelected && input.onContextRemoved ? html`
                                   <devtools-button
-                                    title=${getContextRemoveLabel(input.selectedContext)}
-                                    aria-label=${getContextRemoveLabel(input.selectedContext)}
+                                    title=${getContextRemoveLabel(input.context)}
+                                    aria-label=${getContextRemoveLabel(input.context)}
                                     class="remove-context"
                                     .iconName=${'cross'}
                                     .size=${Buttons.Button.Size.MICRO}
                                     .jslogContext=${'context-removed'}
                                     .variant=${Buttons.Button.Variant.ICON}
                                     @click=${input.onContextRemoved}></devtools-button>` : Lit.nothing}
+                      ${!input.isContextSelected && input.onContextAdd ? html`
+                                    <devtools-button
+                                      title=${lockedString(UIStringsNotTranslate.addContext)}
+                                      aria-label=${lockedString(UIStringsNotTranslate.addContext)}
+                                      class="add-context"
+                                      .iconName=${'plus'}
+                                      .size=${Buttons.Button.Size.MICRO}
+                                      .jslogContext=${'context-added'}
+                                      .variant=${Buttons.Button.Variant.ICON}
+                                      @click=${input.onContextAdd}></devtools-button>` : Lit.nothing}
                       </div>
                     </div>`
-                  :
-                    input.onContextAdd ? html`
-                                  <devtools-button
-                                    title=${lockedString(UIStringsNotTranslate.addContext)}
-                                    aria-label=${lockedString(UIStringsNotTranslate.addContext)}
-                                    class="add-context"
-                                    .iconName=${'plus'}
-                                    .size=${Buttons.Button.Size.SMALL}
-                                    .jslogContext=${'context-added'}
-                                    .variant=${Buttons.Button.Variant.ICON}
-                                    @click=${input.onContextAdd}></devtools-button>` : Lit.nothing}
+                  : Lit.nothing}
               </div>
               <div class="chat-input-actions-right">
                 <div class="chat-input-disclaimer-container">
@@ -488,7 +493,8 @@ export class ChatInput extends UI.Widget.Widget implements SDK.TargetManager.Obs
   blockedByCrossOrigin = false;
   isTextInputDisabled = false;
   inputPlaceholder = '' as Platform.UIString.LocalizedString;
-  selectedContext: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null = null;
+  context: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null = null;
+  isContextSelected = false;
   inspectElementToggled = false;
   disclaimerText = '';
   conversationType = AiAssistanceModel.AiHistoryStorage.ConversationType.STYLING;
@@ -675,7 +681,8 @@ export class ChatInput extends UI.Widget.Widget implements SDK.TargetManager.Obs
           isLoading: this.isLoading,
           blockedByCrossOrigin: this.blockedByCrossOrigin,
           isTextInputDisabled: this.isTextInputDisabled,
-          selectedContext: this.selectedContext,
+          context: this.context,
+          isContextSelected: this.isContextSelected,
           inspectElementToggled: this.inspectElementToggled,
           isTextInputEmpty: this.#isTextInputEmpty(),
           disclaimerText: this.disclaimerText,

package/front_end/panels/ai_assistance/components/ChatView.ts

@@ -65,7 +65,8 @@ export interface Props {
   changeManager: AiAssistanceModel.ChangeManager.ChangeManager;
   inspectElementToggled: boolean;
   messages: Message[];
-  selectedContext: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null;
+  context: AiAssistanceModel.AiAgent.ConversationContext<unknown>|null;
+  isContextSelected: boolean;
   isLoading: boolean;
   canShowFeedbackForm: boolean;
   userInfo: Pick<Host.InspectorFrontendHostAPI.SyncInformation, 'accountImage'|'accountGivenName'>;
@@ -178,7 +179,8 @@ const DEFAULT_VIEW: View = (input, output, target) => {
             isTextInputDisabled: input.isTextInputDisabled,
             inputPlaceholder: input.inputPlaceholder,
             disclaimerText: input.disclaimerText,
-            selectedContext: input.selectedContext,
+            context: input.context,
+            isContextSelected: input.isContextSelected,
             inspectElementToggled: input.inspectElementToggled,
             multimodalInputEnabled: input.multimodalInputEnabled ?? false,
             conversationType: input.conversationType,

package/front_end/panels/ai_assistance/components/chatInput.css

@@ -239,12 +239,15 @@
 
     & .title {
       vertical-align: middle;
+      /* Fixed italic text getting cut off */
+      padding-right: var(--sys-size-2);
       font: var(--sys-typescale-body5-regular);
       overflow: hidden;
       text-overflow: ellipsis;
     }
 
-    & .remove-context {
+    & .remove-context,
+    & .add-context {
       vertical-align: middle;
     }
 
@@ -260,6 +263,28 @@
       min-height: var(--sys-size-7);
     }
 
+    &.disabled {
+      border-style: dashed;
+      border-color: var(--sys-color-neutral-outline);
+      color: var(--sys-color-on-surface-light);
+
+      devtools-icon,
+      devtools-file-source-icon {
+        /* Override devtools-file-source-icon */
+        --override-file-source-icon-color: var(
+          --sys-color-on-surface-light-graphics
+        );
+        /* Some icons set their style attribute and we need to override it */
+        /* stylelint-disable-next-line declaration-no-important */
+        color: var(--sys-color-on-surface-light-graphics) !important;
+      }
+
+      .title {
+        color: var(--sys-color-on-surface-light);
+        font-style: italic;
+      }
+    }
+
     /*
       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.

package/front_end/panels/application/StorageView.ts

@@ -510,8 +510,14 @@ export class StorageView extends UI.Widget.VBox {
     const quotaAsString = i18n.ByteUtilities.bytesToString(response.quota);
     const usageAsString = i18n.ByteUtilities.bytesToString(response.usage);
     const formattedQuotaAsString = i18nString(UIStrings.storageWithCustomMarker, {PH1: quotaAsString});
-    const quota =
-        quotaOverridden ? UI.Fragment.Fragment.build`<b>${formattedQuotaAsString}</b>`.element() : quotaAsString;
+
+    let quota: string|HTMLElement = quotaAsString;
+    if (quotaOverridden) {
+      const element = document.createElement('b');
+      element.textContent = formattedQuotaAsString;
+      quota = element;
+    }
+
     const element = uiI18n.getFormatLocalizedString(str_, UIStrings.storageQuotaUsed, {PH1: usageAsString, PH2: quota});
     this.quotaRow.appendChild(element);
     UI.Tooltip.Tooltip.install(

package/front_end/panels/application/preloading/PreloadingView.ts

@@ -13,6 +13,7 @@ import * as Platform from '../../../core/platform/platform.js';
 import {assertNotNullOrUndefined} from '../../../core/platform/platform.js';
 import * as SDK from '../../../core/sdk/sdk.js';
 import * as Protocol from '../../../generated/protocol.js';
+import * as TextUtils from '../../../models/text_utils/text_utils.js';
 import * as Buttons from '../../../ui/components/buttons/buttons.js';
 // eslint-disable-next-line @devtools/es-modules-import
 import emptyWidgetStyles from '../../../ui/legacy/emptyWidget.css.js';
@@ -21,7 +22,7 @@ import {Directives, html, render} from '../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
 
 import * as PreloadingComponents from './components/components.js';
-import {ruleSetTagOrLocationShort} from './components/PreloadingString.js';
+import {capitalizedAction, ruleSetTagOrLocationShort} from './components/PreloadingString.js';
 import * as PreloadingHelper from './helper/helper.js';
 import preloadingViewStyles from './preloadingView.css.js';
 import preloadingViewDropDownStyles from './preloadingViewDropDown.css.js';
@@ -362,6 +363,78 @@ export class PreloadingRuleSetView extends UI.Widget.VBox {
   }
 }
 
+/**
+ * Pure filtering function for preloading grid rows.
+ * Exported for testability.
+ */
+export function applyFilterText(filterText: string, rows: PreloadingComponents.PreloadingGrid.PreloadingGridRow[]):
+    PreloadingComponents.PreloadingGrid.PreloadingGridRow[] {
+  const trimmedFilter = filterText.trim();
+  if (trimmedFilter === '') {
+    return rows;
+  }
+
+  const FILTER_KEYS = ['url', 'action', 'status'] as const;
+  const parser = new TextUtils.TextUtils.FilterParser([...FILTER_KEYS]);
+  // The match is case-insensitive. We handle the matching with everything lower cased,
+  // both keywords and values.
+  const query = parser.parse(filterText.toLowerCase());
+
+  // Drop the last term if it is an incomplete filter key (e.g., "action:" with no value).
+  // FilterParser parses "action:" as plain text since KEY_VALUE_FILTER_REGEXP requires a value.
+  // This lets users type "url:foo action:" and still see results for "url:foo".
+  const lastTerm = query.at(-1);
+
+  // If the parse result is empty, the query only contains spaces.
+  if (!lastTerm) {
+    return rows;
+  }
+
+  const isKeyWithNoValue =
+      (lastTerm.key === undefined || lastTerm.key === null) && FILTER_KEYS.some(key => lastTerm.text === `${key}:`);
+  if (isKeyWithNoValue) {
+    query.pop();
+  }
+
+  if (query.length === 0) {
+    return rows;
+  }
+
+  return rows.filter(row => {
+    const attempt = row.pipeline.getOriginallyTriggered();
+    const url = attempt.key.url.toLowerCase();
+    const action = capitalizedAction(attempt.action).toLowerCase();
+    const status = PreloadingUIUtils.status(attempt.status).toLowerCase();
+
+    // Each term must match (AND logic between terms)
+    return query.every(term => {
+      if (term.text === undefined || term.text === null || term.text === '') {
+        return true;
+      }
+      const searchText = term.text.toLowerCase();
+
+      // The query is lowercased before parsing, so keys are already normalized.
+      const key = term.key;
+      switch (key) {
+        case 'url':
+          return url.includes(searchText);
+        case 'action':
+          return action.includes(searchText);
+        case 'status': {
+          // Support multiple status values separated by comma (e.g., "status:ready,success")
+          const statusValues = searchText.split(',');
+          return statusValues.some(v => status.includes(v));
+        }
+        case undefined:
+          // No key specified: search across all columns (URL, action, status)
+          return url.includes(searchText) || action.includes(searchText) || status.includes(searchText);
+        default:
+          return false;
+      }
+    });
+  });
+}
+
 export class PreloadingAttemptView extends UI.Widget.VBox {
   private model: SDK.PreloadingModel.PreloadingModel;
   // Note that we use id of (representative) preloading attempt while we show pipelines in grid.
@@ -374,6 +447,7 @@ export class PreloadingAttemptView extends UI.Widget.VBox {
   private readonly preloadingDetails =
       new PreloadingComponents.PreloadingDetailsReportView.PreloadingDetailsReportView();
   private readonly ruleSetSelector: PreloadingRuleSetSelector;
+  private readonly textFilterUI: UI.Toolbar.ToolbarFilter;
   private clearButton: UI.Toolbar.ToolbarButton;
 
   constructor(model: SDK.PreloadingModel.PreloadingModel) {
@@ -417,7 +491,19 @@ export class PreloadingAttemptView extends UI.Widget.VBox {
     const toolbar = vbox.contentElement.createChild('devtools-toolbar', 'preloading-toolbar');
     toolbar.setAttribute('jslog', `${VisualLogging.toolbar()}`);
 
-    // Clear button first (leftmost)
+    // Rule set dropdown first
+    this.ruleSetSelector = new PreloadingRuleSetSelector(() => this.render());
+    toolbar.appendToolbarItem(this.ruleSetSelector.item());
+
+    // Text filter second
+    this.textFilterUI = new UI.Toolbar.ToolbarFilter(undefined, 1, 1);
+    this.textFilterUI.addEventListener(UI.Toolbar.ToolbarInput.Event.TEXT_CHANGED, this.onTextFilterChanged, this);
+    toolbar.appendToolbarItem(this.textFilterUI);
+
+    // Separator between text filter and clear button
+    toolbar.appendToolbarItem(new UI.Toolbar.ToolbarSeparator());
+
+    // Clear button last (rightmost)
     this.clearButton =
         new UI.Toolbar.ToolbarButton('Clear speculative loads', 'clear', undefined, 'clear-speculative-loads');
     this.clearButton.addEventListener(UI.Toolbar.ToolbarButton.Events.CLICK, () => {
@@ -428,14 +514,13 @@ export class PreloadingAttemptView extends UI.Widget.VBox {
       }
 
       model.reset();
+      // Reset UI state
+      this.textFilterUI.setValue('');
       this.ruleSetSelector.select(null);
+      this.render();
     });
     toolbar.appendToolbarItem(this.clearButton);
 
-    // Rule set dropdown
-    this.ruleSetSelector = new PreloadingRuleSetSelector(() => this.render());
-    toolbar.appendToolbarItem(this.ruleSetSelector.item());
-
     this.preloadingGrid.onSelect = this.onPreloadingGridCellFocused.bind(this);
 
     const preloadingGridContainer = document.createElement('div');
@@ -491,6 +576,14 @@ export class PreloadingAttemptView extends UI.Widget.VBox {
     }
 
     this.ruleSetSelector.select(id);
+
+    // Reset text filter when navigating from Rules view to clear any existing filter
+    this.textFilterUI.setValue('');
+    this.render();
+  }
+
+  private onTextFilterChanged(): void {
+    this.render();
   }
 
   private updatePreloadingDetails(): void {
@@ -532,8 +625,13 @@ export class PreloadingAttemptView extends UI.Widget.VBox {
         statusCode,
       };
     });
-    this.preloadingGrid.rows = rows;
+
+    // Apply text filter
+    const filteredRows = applyFilterText(this.textFilterUI.valueWithoutSuggestion(), rows);
+
+    this.preloadingGrid.rows = filteredRows;
     this.preloadingGrid.pageURL = pageURL();
+    // Only show empty state when there are truly no speculations (not when filter has no matches)
     this.contentElement.classList.toggle('empty', rows.length === 0);
 
     this.updatePreloadingDetails();