chrome-devtools-frontend 1.0.996044 → 1.0.997598

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/AUTHORS +2 -0
  2. package/front_end/core/i18n/locales/en-US.json +102 -0
  3. package/front_end/core/i18n/locales/en-XL.json +102 -0
  4. package/front_end/core/root/Runtime.ts +5 -0
  5. package/front_end/core/sdk/CSSMatchedStyles.ts +158 -33
  6. package/front_end/core/sdk/CSSMetadata.ts +1 -8
  7. package/front_end/core/sdk/DebuggerModel.ts +1 -1
  8. package/front_end/core/sdk/NetworkManager.ts +1 -2
  9. package/front_end/generated/InspectorBackendCommands.js +33 -3
  10. package/front_end/generated/protocol.ts +47 -24
  11. package/front_end/models/bindings/BreakpointManager.ts +12 -3
  12. package/front_end/models/issues_manager/DeprecationIssue.ts +281 -24
  13. package/front_end/panels/changes/ChangesView.ts +25 -10
  14. package/front_end/panels/css_overview/cssOverview.css +4 -0
  15. package/front_end/panels/elements/ElementsPanel.ts +7 -6
  16. package/front_end/panels/elements/StylesSidebarPane.ts +55 -21
  17. package/front_end/panels/elements/components/adornerSettingsPane.css +5 -0
  18. package/front_end/panels/elements/stylesSectionTree.css +5 -4
  19. package/front_end/panels/elements/stylesSidebarPane.css +1 -1
  20. package/front_end/panels/profiler/HeapSnapshotGridNodes.ts +1 -0
  21. package/front_end/panels/sources/DebuggerPlugin.ts +6 -2
  22. package/front_end/panels/sources/SourcesPanel.ts +22 -6
  23. package/front_end/panels/sources/sources-legacy.ts +1 -1
  24. package/front_end/panels/sources/sources-meta.ts +61 -7
  25. package/front_end/ui/components/diff_view/diffView.css +2 -0
  26. package/front_end/ui/components/tree_outline/TreeOutline.ts +18 -7
  27. package/front_end/ui/legacy/SplitWidget.ts +17 -7
  28. package/front_end/ui/legacy/Toolbar.ts +5 -0
  29. package/front_end/ui/legacy/softDropDownButton.css +4 -0
  30. package/package.json +1 -1
  31. package/scripts/eslint_rules/lib/inline_type_imports.js +158 -0
  32. package/scripts/eslint_rules/tests/inline_type_imports_test.js +106 -0
  33. package/scripts/javascript_natives/index.js +1 -2
@@ -859,17 +859,48 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
859
859
  }
860
860
  }
861
861
 
862
- let pseudoTypes: Protocol.DOM.PseudoType[] = [];
863
- const keys = matchedStyles.pseudoTypes();
864
- if (keys.delete(Protocol.DOM.PseudoType.Before)) {
865
- pseudoTypes.push(Protocol.DOM.PseudoType.Before);
866
- }
867
- pseudoTypes = pseudoTypes.concat([...keys].sort());
868
- for (const pseudoType of pseudoTypes) {
862
+ const customHighlightPseudoRulesets: {
863
+ highlightName: string|null,
864
+ pseudoType: Protocol.DOM.PseudoType,
865
+ pseudoStyles: SDK.CSSStyleDeclaration.CSSStyleDeclaration[],
866
+ }[] = Array.from(matchedStyles.customHighlightPseudoNames()).map(highlightName => {
867
+ return {
868
+ 'highlightName': highlightName,
869
+ 'pseudoType': Protocol.DOM.PseudoType.Highlight,
870
+ 'pseudoStyles': matchedStyles.customHighlightPseudoStyles(highlightName),
871
+ };
872
+ });
873
+
874
+ const otherPseudoRulesets: {
875
+ highlightName: string|null,
876
+ pseudoType: Protocol.DOM.PseudoType,
877
+ pseudoStyles: SDK.CSSStyleDeclaration.CSSStyleDeclaration[],
878
+ }[] = [...matchedStyles.pseudoTypes()].map(pseudoType => {
879
+ return {'highlightName': null, 'pseudoType': pseudoType, 'pseudoStyles': matchedStyles.pseudoStyles(pseudoType)};
880
+ });
881
+
882
+ const pseudoRulesets = customHighlightPseudoRulesets.concat(otherPseudoRulesets).sort((a, b) => {
883
+ // We want to show the ::before pseudos first, followed by the remaining pseudos
884
+ // in alphabetical order.
885
+ if (a.pseudoType === Protocol.DOM.PseudoType.Before && b.pseudoType !== Protocol.DOM.PseudoType.Before) {
886
+ return -1;
887
+ }
888
+ if (a.pseudoType !== Protocol.DOM.PseudoType.Before && b.pseudoType === Protocol.DOM.PseudoType.Before) {
889
+ return 1;
890
+ }
891
+ if (a.pseudoType < b.pseudoType) {
892
+ return -1;
893
+ }
894
+ if (a.pseudoType > b.pseudoType) {
895
+ return 1;
896
+ }
897
+ return 0;
898
+ });
899
+
900
+ for (const pseudo of pseudoRulesets) {
869
901
  lastParentNode = null;
870
- const pseudoStyles = matchedStyles.pseudoStyles(pseudoType);
871
- for (let i = 0; i < pseudoStyles.length; ++i) {
872
- const style = pseudoStyles[i];
902
+ for (let i = 0; i < pseudo.pseudoStyles.length; ++i) {
903
+ const style = pseudo.pseudoStyles[i];
873
904
  const parentNode = matchedStyles.isInherited(style) ? matchedStyles.nodeForStyle(style) : null;
874
905
 
875
906
  // Start a new SectionBlock if this is the first rule for this pseudo type, or if this
@@ -877,10 +908,11 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
877
908
  if (i === 0 || parentNode !== lastParentNode) {
878
909
  lastLayers = null;
879
910
  if (parentNode) {
880
- const block = await SectionBlock.createInheritedPseudoTypeBlock(pseudoType, parentNode);
911
+ const block =
912
+ await SectionBlock.createInheritedPseudoTypeBlock(pseudo.pseudoType, pseudo.highlightName, parentNode);
881
913
  blocks.push(block);
882
914
  } else {
883
- const block = SectionBlock.createPseudoTypeBlock(pseudoType);
915
+ const block = SectionBlock.createPseudoTypeBlock(pseudo.pseudoType, pseudo.highlightName);
884
916
  blocks.push(block);
885
917
  }
886
918
  }
@@ -889,9 +921,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
889
921
  addLayerSeparator(style);
890
922
  const lastBlock = blocks[blocks.length - 1];
891
923
  this.idleCallbackManager.schedule(() => {
892
- const section = SDK.CSSMetadata.cssMetadata().isHighlightPseudoType(pseudoType) ?
893
- new HighlightPseudoStylePropertiesSection(this, matchedStyles, style, sectionIdx) :
894
- new StylePropertiesSection(this, matchedStyles, style, sectionIdx);
924
+ const section = new HighlightPseudoStylePropertiesSection(this, matchedStyles, style, sectionIdx);
895
925
  sectionIdx++;
896
926
  lastBlock.sections.push(section);
897
927
  });
@@ -1287,19 +1317,23 @@ export class SectionBlock {
1287
1317
  this.sections = [];
1288
1318
  }
1289
1319
 
1290
- static createPseudoTypeBlock(pseudoType: Protocol.DOM.PseudoType): SectionBlock {
1320
+ static createPseudoTypeBlock(pseudoType: Protocol.DOM.PseudoType, pseudoArgument: string|null): SectionBlock {
1291
1321
  const separatorElement = document.createElement('div');
1292
1322
  separatorElement.className = 'sidebar-separator';
1293
- separatorElement.textContent = i18nString(UIStrings.pseudoSElement, {PH1: pseudoType});
1323
+ const pseudoArgumentString = pseudoArgument ? `(${pseudoArgument})` : '';
1324
+ const pseudoTypeString = `${pseudoType}${pseudoArgumentString}`;
1325
+ separatorElement.textContent = i18nString(UIStrings.pseudoSElement, {PH1: pseudoTypeString});
1294
1326
  return new SectionBlock(separatorElement);
1295
1327
  }
1296
1328
 
1297
- static async createInheritedPseudoTypeBlock(pseudoType: Protocol.DOM.PseudoType, node: SDK.DOMModel.DOMNode):
1298
- Promise<SectionBlock> {
1329
+ static async createInheritedPseudoTypeBlock(
1330
+ pseudoType: Protocol.DOM.PseudoType, pseudoArgument: string|null,
1331
+ node: SDK.DOMModel.DOMNode): Promise<SectionBlock> {
1299
1332
  const separatorElement = document.createElement('div');
1300
1333
  separatorElement.className = 'sidebar-separator';
1301
-
1302
- UI.UIUtils.createTextChild(separatorElement, i18nString(UIStrings.inheritedFromSPseudoOf, {PH1: pseudoType}));
1334
+ const pseudoArgumentString = pseudoArgument ? `(${pseudoArgument})` : '';
1335
+ const pseudoTypeString = `${pseudoType}${pseudoArgumentString}`;
1336
+ UI.UIUtils.createTextChild(separatorElement, i18nString(UIStrings.inheritedFromSPseudoOf, {PH1: pseudoTypeString}));
1303
1337
  const link = await Common.Linkifier.Linkifier.linkify(node, {
1304
1338
  preventKeyboardFocus: true,
1305
1339
  tooltip: undefined,
@@ -57,6 +57,11 @@
57
57
  border-radius: 2px;
58
58
  }
59
59
 
60
+ .close:hover,
61
+ .close:focus {
62
+ background-color: var(--color-background-elevation-2);
63
+ }
64
+
60
65
  .close::before {
61
66
  transform: rotate(45deg);
62
67
  }
@@ -126,10 +126,15 @@ ol.expanded {
126
126
  opacity: 50%;
127
127
  }
128
128
 
129
+ .changed {
130
+ background-color: var(--color-accent-green-background);
131
+ }
132
+
129
133
  .changed::after {
130
134
  content: "";
131
135
  position: absolute;
132
136
  left: -4px;
137
+ top: 0;
133
138
  width: 2px;
134
139
  height: 100%;
135
140
  background-color: var(--color-accent-green);
@@ -139,10 +144,6 @@ ol.expanded {
139
144
  display: none;
140
145
  }
141
146
 
142
- .changed:hover {
143
- background-color: var(--color-accent-green-background);
144
- }
145
-
146
147
  .changed:hover .copy {
147
148
  position: absolute;
148
149
  right: -4px;
@@ -226,7 +226,7 @@
226
226
  .sidebar-pane-section-toolbar {
227
227
  position: absolute;
228
228
  right: 0;
229
- bottom: 0;
229
+ bottom: -5px;
230
230
  z-index: 0;
231
231
  }
232
232
 
@@ -572,6 +572,7 @@ export abstract class HeapSnapshotGenericObjectNode extends HeapSnapshotGridNode
572
572
  valueStyle = 'number';
573
573
  break;
574
574
  case 'hidden':
575
+ case 'object shape':
575
576
  valueStyle = 'null';
576
577
  break;
577
578
  case 'array':
@@ -536,6 +536,10 @@ export class DebuggerPlugin extends Plugin {
536
536
  return true;
537
537
  }
538
538
 
539
+ private isVariableIdentifier(tokenType: string): boolean {
540
+ return tokenType === 'VariableName' || tokenType === 'VariableDefinition';
541
+ }
542
+
539
543
  private isIdentifier(tokenType: string): boolean {
540
544
  return tokenType === 'VariableName' || tokenType === 'VariableDefinition' || tokenType === 'PropertyName' ||
541
545
  tokenType === 'PropertyDefinition';
@@ -962,8 +966,8 @@ export class DebuggerPlugin extends Plugin {
962
966
  tree.iterate({
963
967
  from: fromPos,
964
968
  to: toPos,
965
- enter(node): void {
966
- const varName = node.name === 'VariableName' && editorState.sliceDoc(node.from, node.to);
969
+ enter: node => {
970
+ const varName = this.isVariableIdentifier(node.name) && editorState.sliceDoc(node.from, node.to);
967
971
  if (varName && variableMap.has(varName)) {
968
972
  if (node.from > curLine.to) {
969
973
  curLine = editorState.doc.lineAt(node.from);
@@ -439,6 +439,14 @@ export class SourcesPanel extends UI.Panel.Panel implements UI.ContextMenu.Provi
439
439
  return this.sourcesViewInternal.searchableView();
440
440
  }
441
441
 
442
+ toggleNavigatorSidebar(): void {
443
+ this.editorView.toggleSidebar();
444
+ }
445
+
446
+ toggleDebuggerSidebar(): void {
447
+ this.splitWidget.toggleSidebar();
448
+ }
449
+
442
450
  private debuggerPaused(event: Common.EventTarget.EventTargetEvent<SDK.DebuggerModel.DebuggerModel>): void {
443
451
  const debuggerModel = event.data;
444
452
  const details = debuggerModel.debuggerPausedDetails();
@@ -1285,18 +1293,18 @@ export class RevealingActionDelegate implements UI.ActionRegistration.ActionDele
1285
1293
  }
1286
1294
  }
1287
1295
 
1288
- let debuggingActionDelegateInstance: DebuggingActionDelegate;
1296
+ let actionDelegateInstance: ActionDelegate;
1289
1297
 
1290
- export class DebuggingActionDelegate implements UI.ActionRegistration.ActionDelegate {
1298
+ export class ActionDelegate implements UI.ActionRegistration.ActionDelegate {
1291
1299
  static instance(opts: {
1292
1300
  forceNew: boolean|null,
1293
- } = {forceNew: null}): DebuggingActionDelegate {
1301
+ } = {forceNew: null}): ActionDelegate {
1294
1302
  const {forceNew} = opts;
1295
- if (!debuggingActionDelegateInstance || forceNew) {
1296
- debuggingActionDelegateInstance = new DebuggingActionDelegate();
1303
+ if (!actionDelegateInstance || forceNew) {
1304
+ actionDelegateInstance = new ActionDelegate();
1297
1305
  }
1298
1306
 
1299
- return debuggingActionDelegateInstance;
1307
+ return actionDelegateInstance;
1300
1308
  }
1301
1309
  handleAction(context: UI.Context.Context, actionId: string): boolean {
1302
1310
  const panel = SourcesPanel.instance();
@@ -1340,6 +1348,14 @@ export class DebuggingActionDelegate implements UI.ActionRegistration.ActionDele
1340
1348
  }
1341
1349
  return true;
1342
1350
  }
1351
+ case 'sources.toggle-navigator-sidebar': {
1352
+ panel.toggleNavigatorSidebar();
1353
+ return true;
1354
+ }
1355
+ case 'sources.toggle-debugger-sidebar': {
1356
+ panel.toggleDebuggerSidebar();
1357
+ return true;
1358
+ }
1343
1359
  }
1344
1360
  return false;
1345
1361
  }
@@ -189,7 +189,7 @@ Sources.SourcesPanel.DebuggerPausedDetailsRevealer = SourcesModule.SourcesPanel.
189
189
  Sources.SourcesPanel.RevealingActionDelegate = SourcesModule.SourcesPanel.RevealingActionDelegate;
190
190
 
191
191
  /** @constructor */
192
- Sources.SourcesPanel.DebuggingActionDelegate = SourcesModule.SourcesPanel.DebuggingActionDelegate;
192
+ Sources.SourcesPanel.ActionDelegate = SourcesModule.SourcesPanel.ActionDelegate;
193
193
 
194
194
  /** @constructor */
195
195
  Sources.SourcesPanel.WrapperView = SourcesModule.SourcesPanel.WrapperView;
@@ -378,6 +378,14 @@ const UIStrings = {
378
378
  * comes to a halt.
379
379
  */
380
380
  enableAutoFocusOnDebuggerPaused: 'Focus Sources panel when triggering a breakpoint',
381
+ /**
382
+ * @description Text for command of toggling navigator sidebar in Sources panel
383
+ */
384
+ toggleNavigatorSidebar: 'Toggle navigator sidebar',
385
+ /**
386
+ * @description Text for command of toggling debugger sidebar in Sources panel
387
+ */
388
+ toggleDebuggerSidebar: 'Toggle debugger sidebar',
381
389
 
382
390
  };
383
391
  const str_ = i18n.i18n.registerUIStrings('panels/sources/sources-meta.ts', UIStrings);
@@ -567,7 +575,7 @@ UI.ActionRegistration.registerActionExtension({
567
575
  actionId: 'debugger.step-over',
568
576
  async loadActionDelegate() {
569
577
  const Sources = await loadSourcesModule();
570
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
578
+ return Sources.SourcesPanel.ActionDelegate.instance();
571
579
  },
572
580
 
573
581
  title: i18nLazyString(UIStrings.stepOverNextFunctionCall),
@@ -599,7 +607,7 @@ UI.ActionRegistration.registerActionExtension({
599
607
  actionId: 'debugger.step-into',
600
608
  async loadActionDelegate() {
601
609
  const Sources = await loadSourcesModule();
602
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
610
+ return Sources.SourcesPanel.ActionDelegate.instance();
603
611
  },
604
612
  title: i18nLazyString(UIStrings.stepIntoNextFunctionCall),
605
613
  iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_STEP_INTO,
@@ -630,7 +638,7 @@ UI.ActionRegistration.registerActionExtension({
630
638
  actionId: 'debugger.step',
631
639
  async loadActionDelegate() {
632
640
  const Sources = await loadSourcesModule();
633
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
641
+ return Sources.SourcesPanel.ActionDelegate.instance();
634
642
  },
635
643
  title: i18nLazyString(UIStrings.step),
636
644
  iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_STEP,
@@ -652,7 +660,7 @@ UI.ActionRegistration.registerActionExtension({
652
660
  actionId: 'debugger.step-out',
653
661
  async loadActionDelegate() {
654
662
  const Sources = await loadSourcesModule();
655
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
663
+ return Sources.SourcesPanel.ActionDelegate.instance();
656
664
  },
657
665
  title: i18nLazyString(UIStrings.stepOutOfCurrentFunction),
658
666
  iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_STEP_OUT,
@@ -683,7 +691,7 @@ UI.ActionRegistration.registerActionExtension({
683
691
  category: UI.ActionRegistration.ActionCategory.DEBUGGER,
684
692
  async loadActionDelegate() {
685
693
  const Sources = await loadSourcesModule();
686
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
694
+ return Sources.SourcesPanel.ActionDelegate.instance();
687
695
  },
688
696
  title: i18nLazyString(UIStrings.runSnippet),
689
697
  iconClass: UI.ActionRegistration.IconClass.LARGEICON_PLAY,
@@ -709,7 +717,7 @@ UI.ActionRegistration.registerActionExtension({
709
717
  toggleable: true,
710
718
  async loadActionDelegate() {
711
719
  const Sources = await loadSourcesModule();
712
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
720
+ return Sources.SourcesPanel.ActionDelegate.instance();
713
721
  },
714
722
  contextTypes() {
715
723
  return maybeRetrieveContextTypes(Sources => [Sources.SourcesView.SourcesView]);
@@ -764,7 +772,7 @@ UI.ActionRegistration.registerActionExtension({
764
772
  category: UI.ActionRegistration.ActionCategory.DEBUGGER,
765
773
  async loadActionDelegate() {
766
774
  const Sources = await loadSourcesModule();
767
- return Sources.SourcesPanel.DebuggingActionDelegate.instance();
775
+ return Sources.SourcesPanel.ActionDelegate.instance();
768
776
  },
769
777
  title: i18nLazyString(UIStrings.evaluateSelectedTextInConsole),
770
778
  contextTypes() {
@@ -1240,6 +1248,52 @@ UI.ActionRegistration.registerActionExtension({
1240
1248
  ],
1241
1249
  });
1242
1250
 
1251
+ UI.ActionRegistration.registerActionExtension({
1252
+ actionId: 'sources.toggle-navigator-sidebar',
1253
+ category: UI.ActionRegistration.ActionCategory.SOURCES,
1254
+ title: i18nLazyString(UIStrings.toggleNavigatorSidebar),
1255
+ async loadActionDelegate() {
1256
+ const Sources = await loadSourcesModule();
1257
+ return Sources.SourcesPanel.ActionDelegate.instance();
1258
+ },
1259
+ contextTypes() {
1260
+ return maybeRetrieveContextTypes(Sources => [Sources.SourcesView.SourcesView]);
1261
+ },
1262
+ bindings: [
1263
+ {
1264
+ platform: UI.ActionRegistration.Platforms.WindowsLinux,
1265
+ shortcut: 'Ctrl+Shift+y',
1266
+ },
1267
+ {
1268
+ platform: UI.ActionRegistration.Platforms.Mac,
1269
+ shortcut: 'Meta+Shift+y',
1270
+ },
1271
+ ],
1272
+ });
1273
+
1274
+ UI.ActionRegistration.registerActionExtension({
1275
+ actionId: 'sources.toggle-debugger-sidebar',
1276
+ category: UI.ActionRegistration.ActionCategory.SOURCES,
1277
+ title: i18nLazyString(UIStrings.toggleDebuggerSidebar),
1278
+ async loadActionDelegate() {
1279
+ const Sources = await loadSourcesModule();
1280
+ return Sources.SourcesPanel.ActionDelegate.instance();
1281
+ },
1282
+ contextTypes() {
1283
+ return maybeRetrieveContextTypes(Sources => [Sources.SourcesView.SourcesView]);
1284
+ },
1285
+ bindings: [
1286
+ {
1287
+ platform: UI.ActionRegistration.Platforms.WindowsLinux,
1288
+ shortcut: 'Ctrl+Shift+h',
1289
+ },
1290
+ {
1291
+ platform: UI.ActionRegistration.Platforms.Mac,
1292
+ shortcut: 'Meta+Shift+h',
1293
+ },
1294
+ ],
1295
+ });
1296
+
1243
1297
  Common.Settings.registerSettingExtension({
1244
1298
  settingName: 'navigatorGroupByFolder',
1245
1299
  settingType: Common.Settings.SettingType.BOOLEAN,
@@ -11,12 +11,14 @@
11
11
  font-size: var(--source-code-font-size);
12
12
  white-space: pre;
13
13
  line-height: 1.2em;
14
+ user-select: text;
14
15
  }
15
16
 
16
17
  .diff-line-number {
17
18
  color: var(--color-line-number);
18
19
  padding: 0 3px 0 9px;
19
20
  text-align: right;
21
+ user-select: none;
20
22
  }
21
23
 
22
24
  .diff-line-marker {
@@ -255,25 +255,36 @@ export class TreeOutline<TreeNodeDataType> extends HTMLElement {
255
255
  return this.#selectedTreeNode;
256
256
  }
257
257
 
258
- async #fetchNodeChildren(node: TreeNodeWithChildren<TreeNodeDataType>): Promise<TreeNode<TreeNodeDataType>[]> {
258
+ async #flattenSubtree(node: TreeNodeWithChildren<TreeNodeDataType>, filter: (node: TreeNodeDataType) => FilterOption):
259
+ Promise<TreeNode<TreeNodeDataType>[]> {
259
260
  const children = await getNodeChildren(node);
260
- if (!this.#nodeFilter) {
261
- return children;
262
- }
263
261
  const filteredChildren = [];
264
262
  for (const child of children) {
265
- const filtering = this.#nodeFilter(child.treeNodeData);
263
+ const filtering = filter(child.treeNodeData);
266
264
  // We always include the selected node in the tree, regardless of its filtering status.
267
- if (filtering === FilterOption.SHOW || this.#isSelectedNode(child) || child.id === this.#nodeIdPendingFocus) {
265
+ const toBeSelected = this.#isSelectedNode(child) || child.id === this.#nodeIdPendingFocus;
266
+ // If a node is already expanded we should not flatten it away.
267
+ const expanded = this.#nodeExpandedMap.get(child.id);
268
+ if (filtering === FilterOption.SHOW || toBeSelected || expanded) {
268
269
  filteredChildren.push(child);
269
270
  } else if (filtering === FilterOption.FLATTEN && isExpandableNode(child)) {
270
- const grandChildren = await this.#fetchNodeChildren(child);
271
+ const grandChildren = await this.#flattenSubtree(child, filter);
271
272
  filteredChildren.push(...grandChildren);
272
273
  }
273
274
  }
274
275
  return filteredChildren;
275
276
  }
276
277
 
278
+ async #fetchNodeChildren(node: TreeNodeWithChildren<TreeNodeDataType>): Promise<TreeNode<TreeNodeDataType>[]> {
279
+ const children = await getNodeChildren(node);
280
+ const filter = this.#nodeFilter;
281
+ if (!filter) {
282
+ return children;
283
+ }
284
+ const filteredDescendants = await this.#flattenSubtree(node, filter);
285
+ return filteredDescendants.length ? filteredDescendants : children;
286
+ }
287
+
277
288
  #setNodeExpandedState(node: TreeNode<TreeNodeDataType>, newExpandedState: boolean): void {
278
289
  this.#nodeExpandedMap.set(node.id, newExpandedState);
279
290
  }
@@ -61,6 +61,8 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
61
61
  private animationCallback: (() => void)|null;
62
62
  private showSidebarButtonTitle: Common.UIString.LocalizedString;
63
63
  private hideSidebarButtonTitle: Common.UIString.LocalizedString;
64
+ private shownSidebarString: Common.UIString.LocalizedString;
65
+ private hiddenSidebarString: Common.UIString.LocalizedString;
64
66
  private showHideSidebarButton: ToolbarButton|null;
65
67
  private isVerticalInternal: boolean;
66
68
  private sidebarMinimized: boolean;
@@ -111,6 +113,8 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
111
113
  this.animationCallback = null;
112
114
  this.showSidebarButtonTitle = Common.UIString.LocalizedEmptyString;
113
115
  this.hideSidebarButtonTitle = Common.UIString.LocalizedEmptyString;
116
+ this.shownSidebarString = Common.UIString.LocalizedEmptyString;
117
+ this.hiddenSidebarString = Common.UIString.LocalizedEmptyString;
114
118
  this.showHideSidebarButton = null;
115
119
  this.isVerticalInternal = false;
116
120
  this.sidebarMinimized = false;
@@ -821,23 +825,29 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
821
825
  shownString: Common.UIString.LocalizedString, hiddenString: Common.UIString.LocalizedString): ToolbarButton {
822
826
  this.showSidebarButtonTitle = showTitle;
823
827
  this.hideSidebarButtonTitle = hideTitle;
828
+ this.shownSidebarString = shownString;
829
+ this.hiddenSidebarString = hiddenString;
824
830
  this.showHideSidebarButton = new ToolbarButton('', '');
825
831
  this.showHideSidebarButton.addEventListener(ToolbarButton.Events.Click, buttonClicked, this);
826
832
  this.updateShowHideSidebarButton();
827
833
 
828
834
  function buttonClicked(this: SplitWidget): void {
829
- if (this.showModeInternal !== ShowMode.Both) {
830
- this.showBoth(true);
831
- ARIAUtils.alert(shownString);
832
- } else {
833
- this.hideSidebar(true);
834
- ARIAUtils.alert(hiddenString);
835
- }
835
+ this.toggleSidebar();
836
836
  }
837
837
 
838
838
  return this.showHideSidebarButton;
839
839
  }
840
840
 
841
+ toggleSidebar(): void {
842
+ if (this.showModeInternal !== ShowMode.Both) {
843
+ this.showBoth(true);
844
+ ARIAUtils.alert(this.shownSidebarString);
845
+ } else {
846
+ this.hideSidebar(true);
847
+ ARIAUtils.alert(this.hiddenSidebarString);
848
+ }
849
+ }
850
+
841
851
  private updateShowHideSidebarButton(): void {
842
852
  if (!this.showHideSidebarButton) {
843
853
  return;
@@ -57,6 +57,10 @@ const UIStrings = {
57
57
  *@description Announced screen reader message for ToolbarSettingToggle when the setting is toggled off.
58
58
  */
59
59
  notPressed: 'not pressed',
60
+ /**
61
+ *@description Tooltip shown when the user hovers over the clear icon to empty the text input.
62
+ */
63
+ clearInput: 'Clear input',
60
64
  };
61
65
  const str_ = i18n.i18n.registerUIStrings('ui/legacy/Toolbar.ts', UIStrings);
62
66
  const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -701,6 +705,7 @@ export class ToolbarInput extends ToolbarItem<ToolbarInput.EventTypes> {
701
705
  }
702
706
 
703
707
  const clearButton = this.element.createChild('div', 'toolbar-input-clear-button');
708
+ clearButton.title = UIStrings.clearInput;
704
709
  clearButton.appendChild(Icon.create('mediumicon-gray-cross-active', 'search-cancel-button'));
705
710
  clearButton.addEventListener('click', () => {
706
711
  this.setValue('', true);
@@ -23,6 +23,10 @@ button.soft-dropdown > .title {
23
23
  text-overflow: ellipsis;
24
24
  }
25
25
 
26
+ button.soft-dropdown:hover:not(:active) > .title {
27
+ color: var(--color-text-primary);
28
+ }
29
+
26
30
  @media (forced-colors: active) {
27
31
  button.soft-dropdown {
28
32
  border: 1px solid ButtonText;
package/package.json CHANGED
@@ -55,5 +55,5 @@
55
55
  "unittest": "scripts/test/run_unittests.py --no-text-coverage",
56
56
  "watch": "vpython third_party/node/node.py --output scripts/watch_build.js"
57
57
  },
58
- "version": "1.0.996044"
58
+ "version": "1.0.997598"
59
59
  }