chrome-devtools-frontend 1.0.948445 → 1.0.948916

package/config/gni/devtools_grd_files.gni

@@ -356,8 +356,6 @@ grd_files_release_sources = [
   "front_end/panels/emulation/emulation-meta.js",
   "front_end/panels/emulation/emulation.js",
   "front_end/panels/event_listeners/event_listeners.js",
-  "front_end/panels/help/help-meta.js",
-  "front_end/panels/help/help.js",
   "front_end/panels/input/input-meta.js",
   "front_end/panels/input/input.js",
   "front_end/panels/issues/components/components.js",
@@ -957,10 +955,6 @@ grd_files_debug_sources = [
   "front_end/panels/event_listeners/EventListenersUtils.js",
   "front_end/panels/event_listeners/EventListenersView.js",
   "front_end/panels/event_listeners/eventListenersView.css.js",
-  "front_end/panels/help/HelpImpl.js",
-  "front_end/panels/help/ReleaseNoteText.js",
-  "front_end/panels/help/ReleaseNoteView.js",
-  "front_end/panels/help/releaseNote.css.js",
   "front_end/panels/input/InputModel.js",
   "front_end/panels/input/InputTimeline.js",
   "front_end/panels/input/inputTimeline.css.js",

package/front_end/core/i18n/locales/en-US.json

@@ -4664,6 +4664,21 @@
   "panels/elements/PlatformFontsWidget.ts | renderedFonts": {
     "message": "Rendered Fonts"
   },
+  "panels/elements/PropertiesWidget.ts | filter": {
+    "message": "Filter"
+  },
+  "panels/elements/PropertiesWidget.ts | filterProperties": {
+    "message": "Filter Properties"
+  },
+  "panels/elements/PropertiesWidget.ts | noMatchingProperty": {
+    "message": "No matching property"
+  },
+  "panels/elements/PropertiesWidget.ts | showAll": {
+    "message": "Show all"
+  },
+  "panels/elements/PropertiesWidget.ts | showAllTooltip": {
+    "message": "When unchecked, only properties whose values are neither null nor undefined will be shown"
+  },
   "panels/elements/StylePropertyTreeElement.ts | copyAllCssDeclarationsAsJs": {
     "message": "Copy all declarations as JS"
   },
@@ -4958,36 +4973,6 @@
   "panels/event_listeners/EventListenersView.ts | toggleWhetherEventListenerIs": {
     "message": "Toggle whether event listener is passive or blocking"
   },
-  "panels/help/help-meta.ts | bug": {
-    "message": "bug"
-  },
-  "panels/help/help-meta.ts | doNotShowWhatsNewAfterEachUpdate": {
-    "message": "Do not show What's New after each update"
-  },
-  "panels/help/help-meta.ts | releaseNotes": {
-    "message": "Release notes"
-  },
-  "panels/help/help-meta.ts | reportADevtoolsIssue": {
-    "message": "Report a DevTools issue"
-  },
-  "panels/help/help-meta.ts | reportTranslationIssue": {
-    "message": "Report a translation issue"
-  },
-  "panels/help/help-meta.ts | showWhatsNew": {
-    "message": "Show What's New"
-  },
-  "panels/help/help-meta.ts | showWhatsNewAfterEachUpdate": {
-    "message": "Show What's New after each update"
-  },
-  "panels/help/help-meta.ts | whatsNew": {
-    "message": "What's New"
-  },
-  "panels/help/ReleaseNoteView.ts | close": {
-    "message": "Close"
-  },
-  "panels/help/ReleaseNoteView.ts | learnMore": {
-    "message": "Learn more"
-  },
   "panels/input/input-meta.ts | inputs": {
     "message": "Inputs"
   },

package/front_end/core/i18n/locales/en-XL.json

@@ -4664,6 +4664,21 @@
   "panels/elements/PlatformFontsWidget.ts | renderedFonts": {
     "message": "R̂én̂d́êŕêd́ F̂ón̂t́ŝ"
   },
+  "panels/elements/PropertiesWidget.ts | filter": {
+    "message": "F̂íl̂t́êŕ"
+  },
+  "panels/elements/PropertiesWidget.ts | filterProperties": {
+    "message": "F̂íl̂t́êŕ P̂ŕôṕêŕt̂íêś"
+  },
+  "panels/elements/PropertiesWidget.ts | noMatchingProperty": {
+    "message": "N̂ó m̂át̂ćĥín̂ǵ p̂ŕôṕêŕt̂ý"
+  },
+  "panels/elements/PropertiesWidget.ts | showAll": {
+    "message": "Ŝh́ôẃ âĺl̂"
+  },
+  "panels/elements/PropertiesWidget.ts | showAllTooltip": {
+    "message": "Ŵh́êń ûńĉh́êćk̂éd̂, ón̂ĺŷ ṕr̂óp̂ér̂t́îéŝ ẃĥóŝé v̂ál̂úêś âŕê ńêít̂h́êŕ n̂úl̂ĺ n̂ór̂ ún̂d́êf́îńêd́ ŵíl̂ĺ b̂é ŝh́ôẃn̂"
+  },
   "panels/elements/StylePropertyTreeElement.ts | copyAllCssDeclarationsAsJs": {
     "message": "Ĉóp̂ý âĺl̂ d́êćl̂ár̂át̂íôńŝ áŝ J́Ŝ"
   },
@@ -4958,36 +4973,6 @@
   "panels/event_listeners/EventListenersView.ts | toggleWhetherEventListenerIs": {
     "message": "T̂óĝǵl̂é ŵh́êt́ĥér̂ év̂én̂t́ l̂íŝt́êńêŕ îś p̂áŝśîv́ê ór̂ b́l̂óĉḱîńĝ"
   },
-  "panels/help/help-meta.ts | bug": {
-    "message": "b̂úĝ"
-  },
-  "panels/help/help-meta.ts | doNotShowWhatsNewAfterEachUpdate": {
-    "message": "D̂ó n̂ót̂ śĥóŵ Ẃĥát̂'ś N̂éŵ áf̂t́êŕ êáĉh́ ûṕd̂át̂é"
-  },
-  "panels/help/help-meta.ts | releaseNotes": {
-    "message": "R̂él̂éâśê ńôt́êś"
-  },
-  "panels/help/help-meta.ts | reportADevtoolsIssue": {
-    "message": "R̂ép̂ór̂t́ â D́êv́T̂óôĺŝ íŝśûé"
-  },
-  "panels/help/help-meta.ts | reportTranslationIssue": {
-    "message": "R̂ép̂ór̂t́ â t́r̂án̂śl̂át̂íôń îśŝúê"
-  },
-  "panels/help/help-meta.ts | showWhatsNew": {
-    "message": "Ŝh́ôẃ Ŵh́ât́'ŝ Ńêẃ"
-  },
-  "panels/help/help-meta.ts | showWhatsNewAfterEachUpdate": {
-    "message": "Ŝh́ôẃ Ŵh́ât́'ŝ Ńêẃ âf́t̂ér̂ éâćĥ úp̂d́ât́ê"
-  },
-  "panels/help/help-meta.ts | whatsNew": {
-    "message": "Ŵh́ât́'ŝ Ńêẃ"
-  },
-  "panels/help/ReleaseNoteView.ts | close": {
-    "message": "Ĉĺôśê"
-  },
-  "panels/help/ReleaseNoteView.ts | learnMore": {
-    "message": "L̂éâŕn̂ ḿôŕê"
-  },
   "panels/input/input-meta.ts | inputs": {
     "message": "Îńp̂út̂ś"
   },

package/front_end/core/sdk/RemoteObject.ts

@@ -33,7 +33,7 @@
  */
 
 import type * as ProtocolProxyApi from '../../generated/protocol-proxy-api.js';
-import type * as Protocol from '../../generated/protocol.js';
+import * as Protocol from '../../generated/protocol.js';
 
 import type {DebuggerModel, FunctionDetails} from './DebuggerModel.js';
 import type {RuntimeModel} from './RuntimeModel.js';
@@ -62,6 +62,20 @@ export class RemoteObject {
     return remoteObject.type;
   }
 
+  static isNullOrUndefined(remoteObject: RemoteObject|null|undefined): boolean {
+    if (remoteObject === null || remoteObject === undefined) {
+      return true;
+    }
+    switch (remoteObject.type) {
+      case Protocol.Runtime.RemoteObjectType.Object:
+        return remoteObject.subtype === Protocol.Runtime.RemoteObjectSubtype.Null;
+      case Protocol.Runtime.RemoteObjectType.Undefined:
+        return true;
+      default:
+        return false;
+    }
+  }
+
   static arrayNameFromDescription(description: string): string {
     return description.replace(_descriptionLengthParenRegex, '').replace(_descriptionLengthSquareRegex, '');
   }

package/front_end/entrypoints/devtools_app/devtools_app.ts

@@ -15,7 +15,6 @@ import '../../panels/developer_resources/developer_resources-meta.js';
 import '../inspector_main/inspector_main-meta.js';
 import '../../panels/application/application-meta.js';
 import '../../panels/issues/issues-meta.js';
-import '../../panels/help/help-meta.js';
 import '../../panels/layers/layers-meta.js';
 import '../../panels/lighthouse/lighthouse-meta.js';
 import '../../panels/media/media-meta.js';

package/front_end/entrypoints/visibility.gni

@@ -2,6 +2,8 @@
 # Use of this source code is governed by a BSD-style license that can be
 # found in the LICENSE file.
 
+import("../visibility.gni")
+
 declare_args() {
-  devtools_entrypoints_visibility = []
+  devtools_entrypoints_visibility = devtools_visibility
 }

package/front_end/entrypoints/worker_app/worker_app.ts

@@ -5,7 +5,6 @@ import '../shell/shell.js';
 import '../../panels/browser_debugger/browser_debugger-meta.js';
 import '../../panels/developer_resources/developer_resources-meta.js';
 import '../../panels/elements/elements-meta.js';
-import '../../panels/help/help-meta.js';
 import '../../panels/issues/issues-meta.js';
 import '../../panels/layer_viewer/layer_viewer-meta.js';
 import '../../panels/mobile_throttling/mobile_throttling-meta.js';

package/front_end/generated/InspectorBackendCommands.js

@@ -270,7 +270,12 @@ export function registerCommands(inspectorBackend) {
     AttributionSourceUntrustworthyOrigin: 'AttributionSourceUntrustworthyOrigin',
     AttributionUntrustworthyOrigin: 'AttributionUntrustworthyOrigin',
     AttributionTriggerDataTooLarge: 'AttributionTriggerDataTooLarge',
-    AttributionEventSourceTriggerDataTooLarge: 'AttributionEventSourceTriggerDataTooLarge'
+    AttributionEventSourceTriggerDataTooLarge: 'AttributionEventSourceTriggerDataTooLarge',
+    InvalidAttributionSourceExpiry: 'InvalidAttributionSourceExpiry',
+    InvalidAttributionSourcePriority: 'InvalidAttributionSourcePriority',
+    InvalidEventSourceTriggerData: 'InvalidEventSourceTriggerData',
+    InvalidTriggerPriority: 'InvalidTriggerPriority',
+    InvalidTriggerDedupKey: 'InvalidTriggerDedupKey'
   });
   inspectorBackend.registerEnum(
       'Audits.GenericIssueErrorType', {CrossOriginPortalPostMessageError: 'CrossOriginPortalPostMessageError'});
@@ -591,6 +596,8 @@ export function registerCommands(inspectorBackend) {
   inspectorBackend.registerCommand('Cast.disable', [], []);
   inspectorBackend.registerCommand(
       'Cast.setSinkToUse', [{'name': 'sinkName', 'type': 'string', 'optional': false}], []);
+  inspectorBackend.registerCommand(
+      'Cast.startDesktopMirroring', [{'name': 'sinkName', 'type': 'string', 'optional': false}], []);
   inspectorBackend.registerCommand(
       'Cast.startTabMirroring', [{'name': 'sinkName', 'type': 'string', 'optional': false}], []);
   inspectorBackend.registerCommand('Cast.stopCasting', [{'name': 'sinkName', 'type': 'string', 'optional': false}], []);

package/front_end/generated/protocol-mapping.d.ts

@@ -1086,6 +1086,10 @@ export namespace ProtocolMapping {
      * sink via Presentation API, Remote Playback API, or Cast SDK.
      */
     'Cast.setSinkToUse': {paramsType: [Protocol.Cast.SetSinkToUseRequest]; returnType: void;};
+    /**
+     * Starts mirroring the desktop to the sink.
+     */
+    'Cast.startDesktopMirroring': {paramsType: [Protocol.Cast.StartDesktopMirroringRequest]; returnType: void;};
     /**
      * Starts mirroring the tab to the sink.
      */

package/front_end/generated/protocol-proxy-api.d.ts

@@ -751,6 +751,12 @@ declare namespace ProtocolProxyApi {
      */
     invoke_setSinkToUse(params: Protocol.Cast.SetSinkToUseRequest): Promise<Protocol.ProtocolResponseWithError>;
 
+    /**
+     * Starts mirroring the desktop to the sink.
+     */
+    invoke_startDesktopMirroring(params: Protocol.Cast.StartDesktopMirroringRequest):
+        Promise<Protocol.ProtocolResponseWithError>;
+
     /**
      * Starts mirroring the tab to the sink.
      */

package/front_end/generated/protocol.d.ts

@@ -967,6 +967,11 @@ declare namespace Protocol {
       AttributionUntrustworthyOrigin = 'AttributionUntrustworthyOrigin',
       AttributionTriggerDataTooLarge = 'AttributionTriggerDataTooLarge',
       AttributionEventSourceTriggerDataTooLarge = 'AttributionEventSourceTriggerDataTooLarge',
+      InvalidAttributionSourceExpiry = 'InvalidAttributionSourceExpiry',
+      InvalidAttributionSourcePriority = 'InvalidAttributionSourcePriority',
+      InvalidEventSourceTriggerData = 'InvalidEventSourceTriggerData',
+      InvalidTriggerPriority = 'InvalidTriggerPriority',
+      InvalidTriggerDedupKey = 'InvalidTriggerDedupKey',
     }
 
     /**
@@ -2773,6 +2778,10 @@ declare namespace Protocol {
       sinkName: string;
     }
 
+    export interface StartDesktopMirroringRequest {
+      sinkName: string;
+    }
+
     export interface StartTabMirroringRequest {
       sinkName: string;
     }

package/front_end/models/issues_manager/AttributionReportingIssue.ts

@@ -17,8 +17,13 @@ export const enum IssueCode {
   AttributionSourceUntrustworthyOrigin = 'AttributionReportingIssue::AttributionSourceUntrustworthyOrigin',
   AttributionUntrustworthyFrameOrigin = 'AttributionReportingIssue::AttributionUntrustworthyFrameOrigin',
   AttributionUntrustworthyOrigin = 'AttributionReportingIssue::AttributionUntrustworthyOrigin',
-  AttributionTriggerDataTooLarge = 'AttrubtionReportingIssue::AttributionTriggerDataTooLarge',
-  AttributionEventSourceTriggerDataTooLarge = 'AttrubtionReportingIssue::AttributionEventSourceTriggerDataTooLarge',
+  AttributionTriggerDataTooLarge = 'AttributionReportingIssue::AttributionTriggerDataTooLarge',
+  AttributionEventSourceTriggerDataTooLarge = 'AttributionReportingIssue::AttributionEventSourceTriggerDataTooLarge',
+  InvalidAttributionSourceExpiry = 'AttributionReportingIssue::InvalidAttributionSourceExpiry',
+  InvalidAttributionSourcePriority = 'AttributionReportingIssue::InvalidAttributionSourcePriority',
+  InvalidEventSourceTriggerData = 'AttributionReportingIssue::InvalidEventSourceTriggerData',
+  InvalidTriggerPriority = 'AttributionReportingIssue::InvalidTriggerPriority',
+  InvalidTriggerDedupKey = 'AttributionReportingIssue::InvalidTriggerDedupKey',
 }
 
 function getIssueCode(details: Protocol.Audits.AttributionReportingIssueDetails): IssueCode {
@@ -40,6 +45,16 @@ function getIssueCode(details: Protocol.Audits.AttributionReportingIssueDetails)
       return IssueCode.AttributionTriggerDataTooLarge;
     case Protocol.Audits.AttributionReportingIssueType.AttributionEventSourceTriggerDataTooLarge:
       return IssueCode.AttributionEventSourceTriggerDataTooLarge;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidAttributionSourceExpiry:
+      return IssueCode.InvalidAttributionSourceExpiry;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidAttributionSourcePriority:
+      return IssueCode.InvalidAttributionSourcePriority;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidEventSourceTriggerData:
+      return IssueCode.InvalidEventSourceTriggerData;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidTriggerPriority:
+      return IssueCode.InvalidTriggerPriority;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidTriggerDedupKey:
+      return IssueCode.InvalidTriggerDedupKey;
   }
 }
 
@@ -108,6 +123,16 @@ export class AttributionReportingIssue extends Issue<IssueCode> {
           file: 'arAttributionEventSourceTriggerDataTooLarge.md',
           links: [],
         };
+      case IssueCode.InvalidAttributionSourceExpiry:
+        return null;
+      case IssueCode.InvalidAttributionSourcePriority:
+        return null;
+      case IssueCode.InvalidEventSourceTriggerData:
+        return null;
+      case IssueCode.InvalidTriggerPriority:
+        return null;
+      case IssueCode.InvalidTriggerDedupKey:
+        return null;
     }
   }
 

package/front_end/panels/console/ConsolePrompt.ts

@@ -259,7 +259,6 @@ export class ConsolePrompt extends Common.ObjectWrapper.eventMixin<EventTypes, t
     } else {
       this.editor.dispatch({scrollIntoView: true});
     }
-    this.enterProcessedForTest();
     return true;
   }
 
@@ -283,9 +282,6 @@ export class ConsolePrompt extends Common.ObjectWrapper.eventMixin<EventTypes, t
     }
   }
 
-  private enterProcessedForTest(): void {
-  }
-
   private editorUpdate(update: CodeMirror.ViewUpdate): void {
     if (update.docChanged ||
         CodeMirror.selectedCompletion(update.state) !== CodeMirror.selectedCompletion(update.startState)) {

package/front_end/panels/elements/AccessibilityTreeUtils.ts

@@ -86,13 +86,7 @@ async function getChildren(node: SDK.AccessibilityModel.AccessibilityNode):
     const localRoot = await getRootNode(frameId);
     return [localRoot];
   }
-  if (node.hasUnloadedChildren()) {
-    await node.accessibilityModel().requestAXChildren(node.id(), node.getFrameId() || undefined);
-    if (node.numChildren() !== node.children().length) {
-      throw new Error('Once loaded, number of children and length of children must match.');
-    }
-  }
-  return node.children();
+  return node.accessibilityModel().requestAXChildren(node.id(), node.getFrameId() || undefined);
 }
 
 export async function sdkNodeToAXTreeNodes(sdkNode: SDK.AccessibilityModel.AccessibilityNode): Promise<AXTreeNode[]> {

package/front_end/panels/elements/PropertiesWidget.ts

@@ -31,25 +31,67 @@
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-import propertiesWidgetStyles from './propertiesWidget.css.js';
-import type * as Common from '../../core/common/common.js';
+import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
+import * as i18n from '../../core/i18n/i18n.js';
 import * as SDK from '../../core/sdk/sdk.js';
+import * as Protocol from '../../generated/protocol.js';
 import * as ObjectUI from '../../ui/legacy/components/object_ui/object_ui.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
+import propertiesWidgetStyles from './propertiesWidget.css.js';
+import {StylesSidebarPane} from './StylesSidebarPane.js';
+
 const OBJECT_GROUP_NAME = 'properties-sidebar-pane';
 
+const UIStrings = {
+  /**
+  * @description Placeholder text for a text input used to filter which DOM element properties show up in
+  * the Properties tab of the Elements panel.
+  */
+  filter: 'Filter',
+  /**
+  * @description ARIA accessible name for the text input used to filter which DOM element properties show up
+  * in the Properties tab of the Elements panel.
+  */
+  filterProperties: 'Filter Properties',
+  /**
+  * @description Text on the checkbox in the Properties tab of the Elements panel, which controls whether
+  * all properties of the currently selected DOM element are shown, or only meaningful properties (i.e.
+  * excluding properties whose values aren't set for example).
+  */
+  showAll: 'Show all',
+  /**
+   * @description Tooltip on the checkbox in the Properties tab of the Elements panel, which controls whether
+  * all properties of the currently selected DOM element are shown, or only meaningful properties (i.e.
+  * excluding properties whose values aren't set for example).
+   */
+  showAllTooltip: 'When unchecked, only properties whose values are neither null nor undefined will be shown',
+  /**
+  * @description Text shown to the user when a filter is applied in the Properties tab of the Elements panel, but
+  * no properties matched the filter and thus no results were returned.
+  */
+  noMatchingProperty: 'No matching property',
+};
+const str_ = i18n.i18n.registerUIStrings('panels/elements/PropertiesWidget.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
 let propertiesWidgetInstance: PropertiesWidget;
 
 export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
   private node: SDK.DOMModel.DOMNode|null;
+  private readonly showAllPropertiesSetting: Common.Settings.Setting<boolean>;
+  private filterRegex: RegExp|null = null;
+  private readonly noMatchesElement: HTMLElement;
   private readonly treeOutline: ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeOutline;
   private readonly expandController: ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController;
   private lastRequestedNode?: SDK.DOMModel.DOMNode;
   constructor() {
     super(true /* isWebComponent */);
 
+    this.showAllPropertiesSetting = Common.Settings.Settings.instance().createSetting('showAllProperties', false);
+    this.showAllPropertiesSetting.addChangeListener(this.filterList.bind(this));
+
     SDK.TargetManager.TargetManager.instance().addModelListener(
         SDK.DOMModel.DOMModel, SDK.DOMModel.Events.AttrModified, this.onNodeChange, this);
     SDK.TargetManager.TargetManager.instance().addModelListener(
@@ -61,6 +103,20 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
     UI.Context.Context.instance().addFlavorChangeListener(SDK.DOMModel.DOMNode, this.setNode, this);
     this.node = UI.Context.Context.instance().flavor(SDK.DOMModel.DOMNode);
 
+    const hbox = this.contentElement.createChild('div', 'hbox properties-widget-toolbar');
+    const filterContainerElement = hbox.createChild('div', 'properties-widget-filter-box');
+    const filterInput = StylesSidebarPane.createPropertyFilterElement(
+        i18nString(UIStrings.filter), hbox, this.filterProperties.bind(this));
+    UI.ARIAUtils.setAccessibleName(filterInput, i18nString(UIStrings.filterProperties));
+    filterContainerElement.appendChild(filterInput);
+
+    const toolbar = new UI.Toolbar.Toolbar('styles-pane-toolbar', hbox);
+    toolbar.appendToolbarItem(new UI.Toolbar.ToolbarSettingCheckbox(
+        this.showAllPropertiesSetting, i18nString(UIStrings.showAllTooltip), i18nString(UIStrings.showAll)));
+
+    this.noMatchesElement = this.contentElement.createChild('div', 'gray-info-message hidden');
+    this.noMatchesElement.textContent = i18nString(UIStrings.noMatchingProperty);
+
     this.treeOutline = new ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeOutline({readOnly: true});
     this.treeOutline.setShowSelectionOnKeyboardFocus(/* show */ true, /* preventTabOrder */ false);
     this.expandController =
@@ -73,6 +129,7 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
 
     this.update();
   }
+
   static instance(opts: {
     forceNew: boolean|null,
   }|undefined = {forceNew: null}): PropertiesWidget {
@@ -84,6 +141,46 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
     return propertiesWidgetInstance;
   }
 
+  private filterProperties(this: PropertiesWidget, regex: RegExp|null): void {
+    this.filterRegex = regex;
+    this.filterList();
+  }
+
+  private filterList(): void {
+    const isHidden = (property: SDK.RemoteObject.RemoteObjectProperty): boolean => {
+      if (!this.showAllPropertiesSetting.get()) {
+        if (SDK.RemoteObject.RemoteObject.isNullOrUndefined(property.value)) {
+          return true;
+        }
+        if (property.value?.type === Protocol.Runtime.RemoteObjectType.Undefined ||
+            (property.value?.type === Protocol.Runtime.RemoteObjectType.Object &&
+             property.value.subtype === Protocol.Runtime.RemoteObjectSubtype.Null)) {
+          return true;
+        }
+      }
+      if (this.filterRegex !== null) {
+        if (this.filterRegex.test(property.name)) {
+          return false;
+        }
+        if (this.filterRegex.test(property.value?.description ?? '')) {
+          return false;
+        }
+        return true;
+      }
+      return false;
+    };
+    let noMatches = true;
+    for (const element of this.treeOutline.rootElement().children()) {
+      const {property} = element as ObjectUI.ObjectPropertiesSection.ObjectPropertyTreeElement;
+      const hidden = isHidden(property);
+      if (!hidden) {
+        noMatches = false;
+      }
+      element.hidden = hidden;
+    }
+    this.noMatchesElement.classList.toggle('hidden', !noMatches);
+  }
+
   private setNode(event: Common.EventTarget.EventTargetEvent<SDK.DOMModel.DOMNode|null>): void {
     this.node = event.data;
     this.update();
@@ -106,8 +203,15 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
       return;
     }
 
-    await ObjectUI.ObjectPropertiesSection.ObjectPropertyTreeElement.populate(
-        this.treeOutline.rootElement(), object, true, true, undefined, undefined);
+    const treeElement = this.treeOutline.rootElement();
+    let {properties} = await SDK.RemoteObject.RemoteObject.loadFromObjectPerProto(object, true /* generatePreview */);
+    treeElement.removeChildren();
+    if (properties === null) {
+      properties = [];
+    }
+    ObjectUI.ObjectPropertiesSection.ObjectPropertyTreeElement.populateWithProperties(
+        treeElement, properties, null, true /* skipProto */, true /* skipGettersAndSetters */, object);
+    this.filterList();
   }
 
   private onNodeChange(event: Common.EventTarget
@@ -122,6 +226,7 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
     }
     this.update();
   }
+
   wasShown(): void {
     super.wasShown();
     this.registerCSSFiles([propertiesWidgetStyles]);

package/front_end/panels/elements/propertiesWidget.css

@@ -8,3 +8,37 @@
   padding: 2px 0 2px 5px;
   flex: none;
 }
+
+.properties-widget-toolbar {
+  border-bottom: 1px solid var(--color-details-hairline-light);
+  flex-shrink: 0;
+}
+
+.properties-widget-filter-box {
+  flex: auto;
+  display: flex;
+}
+
+.properties-widget-filter-box > input {
+  outline: none !important; /* stylelint-disable-line declaration-no-important */
+  border: none;
+  width: 100%;
+  background: var(--color-background);
+  padding-left: 4px;
+  margin: 3px;
+}
+
+.properties-widget-filter-box > input:focus,
+.properties-widget-filter-box > input:not(:placeholder-shown) {
+  box-shadow: var(--legacy-focus-ring-active-shadow);
+}
+
+.properties-widget-filter-box > input::placeholder {
+  color: var(--color-text-disabled);
+}
+
+@media (forced-colors: active) {
+  .properties-widget-filter-box > input {
+    border: 1px solid ButtonText;
+  }
+}

package/front_end/panels/emulation/DeviceModeToolbar.ts

@@ -402,7 +402,7 @@ export class DeviceModeToolbar {
   private appendScaleMenuItems(contextMenu: UI.ContextMenu.ContextMenu): void {
     if (this.model.type() === EmulationModel.DeviceModeModel.Type.Device) {
       contextMenu.footerSection().appendItem(
-          i18nString(UIStrings.fitToWindowF, {PH1: this.getPrettyZoomPercentage()}),
+          i18nString(UIStrings.fitToWindowF, {PH1: this.getPrettyFitZoomPercentage()}),
           this.onScaleMenuChanged.bind(this, this.model.fitScale()), false);
     }
     contextMenu.footerSection().appendCheckboxItem(
@@ -693,6 +693,10 @@ export class DeviceModeToolbar {
     }
   }
 
+  private getPrettyFitZoomPercentage(): string {
+    return `${(this.model.fitScale() * 100).toFixed(0)}`;
+  }
+
   private getPrettyZoomPercentage(): string {
     return `${(this.model.scale() * 100).toFixed(0)}`;
   }

package/package.json

@@ -53,5 +53,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.948445"
+  "version": "1.0.948916"
 }

package/scripts/eslint_rules/lib/ban_a_tags_in_lit_html.js

@@ -3,16 +3,7 @@
 // found in the LICENSE file.
 'use strict';
 
-function isLitHtmlTemplateCall(taggedTemplateExpression) {
-  if (taggedTemplateExpression.name) {
-    // Call to html`` and we assume that html = LitHtml's html function.
-    return taggedTemplateExpression.name === 'html';
-  }
-
-  // Match calls to LitHtml.html``
-  return taggedTemplateExpression.object && taggedTemplateExpression.object.name === 'LitHtml' &&
-      taggedTemplateExpression.property.name === 'html';
-}
+const {isLitHtmlTemplateCall} = require('./utils.js');
 
 module.exports = {
   meta: {
@@ -27,7 +18,7 @@ module.exports = {
   create: function(context) {
     return {
       TaggedTemplateExpression(node) {
-        const isLitHtmlCall = isLitHtmlTemplateCall(node.tag);
+        const isLitHtmlCall = isLitHtmlTemplateCall(node);
         if (!isLitHtmlCall) {
           return;
         }

package/scripts/eslint_rules/lib/ban_literal_devtools_component_tag_names.js

@@ -3,16 +3,7 @@
 // found in the LICENSE file.
 'use strict';
 
-function isLitHtmlTemplateCall(taggedTemplateExpression) {
-  if (taggedTemplateExpression.name) {
-    // Call to html`` and we assume that html = LitHtml's html function.
-    return taggedTemplateExpression.name === 'html';
-  }
-
-  // Match calls to LitHtml.html``
-  return taggedTemplateExpression.object && taggedTemplateExpression.object.name === 'LitHtml' &&
-      taggedTemplateExpression.property.name === 'html';
-}
+const {isLitHtmlTemplateCall} = require('./utils.js');
 
 module.exports = {
   meta: {
@@ -28,7 +19,7 @@ module.exports = {
   create: function(context) {
     return {
       TaggedTemplateExpression(node) {
-        const isLitHtmlCall = isLitHtmlTemplateCall(node.tag);
+        const isLitHtmlCall = isLitHtmlTemplateCall(node);
         if (!isLitHtmlCall) {
           return;
         }