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.
- package/AUTHORS +2 -0
- package/front_end/core/i18n/locales/en-US.json +102 -0
- package/front_end/core/i18n/locales/en-XL.json +102 -0
- package/front_end/core/root/Runtime.ts +5 -0
- package/front_end/core/sdk/CSSMatchedStyles.ts +158 -33
- package/front_end/core/sdk/CSSMetadata.ts +1 -8
- package/front_end/core/sdk/DebuggerModel.ts +1 -1
- package/front_end/core/sdk/NetworkManager.ts +1 -2
- package/front_end/generated/InspectorBackendCommands.js +33 -3
- package/front_end/generated/protocol.ts +47 -24
- package/front_end/models/bindings/BreakpointManager.ts +12 -3
- package/front_end/models/issues_manager/DeprecationIssue.ts +281 -24
- package/front_end/panels/changes/ChangesView.ts +25 -10
- package/front_end/panels/css_overview/cssOverview.css +4 -0
- package/front_end/panels/elements/ElementsPanel.ts +7 -6
- package/front_end/panels/elements/StylesSidebarPane.ts +55 -21
- package/front_end/panels/elements/components/adornerSettingsPane.css +5 -0
- package/front_end/panels/elements/stylesSectionTree.css +5 -4
- package/front_end/panels/elements/stylesSidebarPane.css +1 -1
- package/front_end/panels/profiler/HeapSnapshotGridNodes.ts +1 -0
- package/front_end/panels/sources/DebuggerPlugin.ts +6 -2
- package/front_end/panels/sources/SourcesPanel.ts +22 -6
- package/front_end/panels/sources/sources-legacy.ts +1 -1
- package/front_end/panels/sources/sources-meta.ts +61 -7
- package/front_end/ui/components/diff_view/diffView.css +2 -0
- package/front_end/ui/components/tree_outline/TreeOutline.ts +18 -7
- package/front_end/ui/legacy/SplitWidget.ts +17 -7
- package/front_end/ui/legacy/Toolbar.ts +5 -0
- package/front_end/ui/legacy/softDropDownButton.css +4 -0
- package/package.json +1 -1
- package/scripts/eslint_rules/lib/inline_type_imports.js +158 -0
- package/scripts/eslint_rules/tests/inline_type_imports_test.js +106 -0
- 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
|
-
|
863
|
-
|
864
|
-
|
865
|
-
|
866
|
-
}
|
867
|
-
|
868
|
-
|
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
|
-
|
871
|
-
|
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 =
|
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 =
|
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
|
-
|
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(
|
1298
|
-
|
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
|
-
|
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,
|
@@ -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;
|
@@ -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
|
966
|
-
const varName = node.name
|
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
|
1296
|
+
let actionDelegateInstance: ActionDelegate;
|
1289
1297
|
|
1290
|
-
export class
|
1298
|
+
export class ActionDelegate implements UI.ActionRegistration.ActionDelegate {
|
1291
1299
|
static instance(opts: {
|
1292
1300
|
forceNew: boolean|null,
|
1293
|
-
} = {forceNew: null}):
|
1301
|
+
} = {forceNew: null}): ActionDelegate {
|
1294
1302
|
const {forceNew} = opts;
|
1295
|
-
if (!
|
1296
|
-
|
1303
|
+
if (!actionDelegateInstance || forceNew) {
|
1304
|
+
actionDelegateInstance = new ActionDelegate();
|
1297
1305
|
}
|
1298
1306
|
|
1299
|
-
return
|
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.
|
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.
|
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.
|
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.
|
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.
|
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.
|
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.
|
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.
|
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 #
|
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 =
|
263
|
+
const filtering = filter(child.treeNodeData);
|
266
264
|
// We always include the selected node in the tree, regardless of its filtering status.
|
267
|
-
|
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.#
|
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
|
-
|
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