chrome-devtools-frontend 1.0.1009515 → 1.0.1010780
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/extension-api/ExtensionAPI.d.ts +5 -5
- package/front_end/core/host/UserMetrics.ts +3 -1
- package/front_end/core/i18n/locales/en-US.json +16 -7
- package/front_end/core/i18n/locales/en-XL.json +16 -7
- package/front_end/core/sdk/CSSProperty.ts +3 -3
- package/front_end/core/sdk/DebuggerModel.ts +12 -3
- package/front_end/core/sdk/EmulationModel.ts +9 -3
- package/front_end/core/sdk/Script.ts +3 -2
- package/front_end/generated/InspectorBackendCommands.js +3 -6
- package/front_end/generated/SupportedCSSProperties.js +2 -2
- package/front_end/generated/protocol.ts +24 -7
- package/front_end/models/bindings/BreakpointManager.ts +58 -22
- package/front_end/models/bindings/DebuggerLanguagePlugins.ts +72 -65
- package/front_end/models/bindings/ResourceScriptMapping.ts +13 -1
- package/front_end/models/extensions/ExtensionAPI.ts +14 -5
- package/front_end/models/extensions/ExtensionServer.ts +2 -2
- package/front_end/models/extensions/RecorderExtensionEndpoint.ts +16 -5
- package/front_end/models/issues_manager/DeprecationIssue.ts +1 -10
- package/front_end/models/javascript_metadata/NativeFunctions.js +4 -4
- package/front_end/models/persistence/Automapping.ts +18 -12
- package/front_end/models/persistence/PersistenceImpl.ts +10 -2
- package/front_end/models/workspace/WorkspaceImpl.ts +16 -9
- package/front_end/panels/application/DOMStorageItemsView.ts +6 -0
- package/front_end/panels/console/ConsoleViewMessage.ts +2 -1
- package/front_end/panels/sources/CallStackSidebarPane.ts +11 -4
- package/front_end/panels/sources/DebuggerPlugin.ts +51 -1
- package/front_end/ui/components/data_grid/DataGrid.ts +5 -0
- package/front_end/ui/components/data_grid/DataGridController.ts +5 -0
- package/front_end/ui/legacy/Infobar.ts +1 -0
- package/front_end/ui/legacy/ViewManager.ts +2 -2
- package/front_end/ui/legacy/components/data_grid/DataGrid.ts +1 -1
- package/front_end/ui/legacy/infobar.css +17 -0
- package/package.json +1 -1
@@ -86,6 +86,11 @@ const UIStrings = {
|
|
86
86
|
*@description Text in Call Stack Sidebar Pane of the Sources panel when some call frames have warnings
|
87
87
|
*/
|
88
88
|
callFrameWarnings: 'Some call frames have warnings',
|
89
|
+
/**
|
90
|
+
*@description Error message that is displayed in UI when a file needed for debugging information for a call frame is missing
|
91
|
+
*@example {src/myapp.debug.wasm.dwp} PH1
|
92
|
+
*/
|
93
|
+
debugFileNotFound: 'Failed to load debug file "{PH1}".',
|
89
94
|
/**
|
90
95
|
* @description A contex menu item in the Call Stack Sidebar Pane. "Restart" is a verb and
|
91
96
|
* "frame" is a noun. "Frame" refers to an individual item in the call stack, i.e. a call frame.
|
@@ -204,8 +209,8 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
|
|
204
209
|
return item;
|
205
210
|
});
|
206
211
|
itemPromises.push(itemPromise);
|
207
|
-
|
208
|
-
uniqueWarnings.add(
|
212
|
+
if (frame.missingDebugInfoDetails) {
|
213
|
+
uniqueWarnings.add(frame.missingDebugInfoDetails.details);
|
209
214
|
}
|
210
215
|
}
|
211
216
|
const items = await Promise.all(itemPromises);
|
@@ -316,9 +321,11 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
|
|
316
321
|
element.appendChild(UI.Icon.Icon.create('smallicon-thick-right-arrow', 'selected-call-frame-icon'));
|
317
322
|
element.tabIndex = item === this.list.selectedItem() ? 0 : -1;
|
318
323
|
|
319
|
-
if (callframe && callframe.
|
324
|
+
if (callframe && callframe.missingDebugInfoDetails) {
|
320
325
|
const icon = UI.Icon.Icon.create('smallicon-warning', 'call-frame-warning-icon');
|
321
|
-
|
326
|
+
const messages =
|
327
|
+
callframe.missingDebugInfoDetails.resources.map(r => i18nString(UIStrings.debugFileNotFound, {PH1: r}));
|
328
|
+
UI.Tooltip.Tooltip.install(icon, [callframe.missingDebugInfoDetails.details, ...messages].join('\n'));
|
322
329
|
element.appendChild(icon);
|
323
330
|
}
|
324
331
|
return element;
|
@@ -141,6 +141,16 @@ const UIStrings = {
|
|
141
141
|
*@description Text in Debugger Plugin of the Sources panel
|
142
142
|
*/
|
143
143
|
theDebuggerWillSkipStepping: 'The debugger will skip stepping through this script, and will not stop on exceptions.',
|
144
|
+
/**
|
145
|
+
*@description Error message that is displayed in UI when a file needed for debugging information for a call frame is missing
|
146
|
+
*@example {src/myapp.debug.wasm.dwp} PH1
|
147
|
+
*/
|
148
|
+
debugFileNotFound: 'Failed to load debug file "{PH1}".',
|
149
|
+
/**
|
150
|
+
*@description Error message that is displayed when no debug info could be loaded
|
151
|
+
*@example {app.wasm} PH1
|
152
|
+
*/
|
153
|
+
debugInfoNotFound: 'Failed to load any debug info for {PH1}.',
|
144
154
|
};
|
145
155
|
const str_ = i18n.i18n.registerUIStrings('panels/sources/DebuggerPlugin.ts', UIStrings);
|
146
156
|
const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
|
@@ -194,6 +204,7 @@ export class DebuggerPlugin extends Plugin {
|
|
194
204
|
private prettyPrintInfobar!: UI.Infobar.Infobar|null;
|
195
205
|
private refreshBreakpointsTimeout: undefined|number = undefined;
|
196
206
|
private activeBreakpointDialog: BreakpointEditDialog|null = null;
|
207
|
+
private missingDebugInfoBar: UI.Infobar.Infobar|null = null;
|
197
208
|
|
198
209
|
constructor(
|
199
210
|
uiSourceCode: Workspace.UISourceCode.UISourceCode,
|
@@ -237,7 +248,6 @@ export class DebuggerPlugin extends Plugin {
|
|
237
248
|
|
238
249
|
this.ignoreListInfobar = null;
|
239
250
|
this.showIgnoreListInfobarIfNeeded();
|
240
|
-
|
241
251
|
for (const scriptFile of this.scriptFileForDebuggerModel.values()) {
|
242
252
|
scriptFile.checkMapping();
|
243
253
|
}
|
@@ -332,6 +342,9 @@ export class DebuggerPlugin extends Plugin {
|
|
332
342
|
editor.dispatch({effects: SourceFrame.SourceFrame.addNonBreakableLines.of(linePositions)});
|
333
343
|
}
|
334
344
|
}, console.error);
|
345
|
+
if (this.missingDebugInfoBar) {
|
346
|
+
this.attachInfobar(this.missingDebugInfoBar);
|
347
|
+
}
|
335
348
|
if (!this.muted) {
|
336
349
|
void this.refreshBreakpoints();
|
337
350
|
}
|
@@ -1350,6 +1363,42 @@ export class DebuggerPlugin extends Plugin {
|
|
1350
1363
|
if (newScriptFile.hasSourceMapURL()) {
|
1351
1364
|
this.showSourceMapInfobar();
|
1352
1365
|
}
|
1366
|
+
|
1367
|
+
void newScriptFile.missingSymbolFiles().then(resources => {
|
1368
|
+
if (resources) {
|
1369
|
+
const details = i18nString(UIStrings.debugInfoNotFound, {PH1: newScriptFile.uiSourceCode.url()});
|
1370
|
+
this.updateMissingDebugInfoInfobar({resources, details});
|
1371
|
+
} else {
|
1372
|
+
this.updateMissingDebugInfoInfobar(null);
|
1373
|
+
}
|
1374
|
+
});
|
1375
|
+
}
|
1376
|
+
|
1377
|
+
private updateMissingDebugInfoInfobar(warning: SDK.DebuggerModel.MissingDebugInfoDetails|null): void {
|
1378
|
+
if (this.missingDebugInfoBar) {
|
1379
|
+
return;
|
1380
|
+
}
|
1381
|
+
if (warning === null) {
|
1382
|
+
this.removeInfobar(this.missingDebugInfoBar);
|
1383
|
+
this.missingDebugInfoBar = null;
|
1384
|
+
return;
|
1385
|
+
}
|
1386
|
+
this.missingDebugInfoBar = UI.Infobar.Infobar.create(UI.Infobar.Type.Error, warning.details, []);
|
1387
|
+
if (!this.missingDebugInfoBar) {
|
1388
|
+
return;
|
1389
|
+
}
|
1390
|
+
for (const resource of warning.resources) {
|
1391
|
+
const detailsRow =
|
1392
|
+
this.missingDebugInfoBar?.createDetailsRowMessage(i18nString(UIStrings.debugFileNotFound, {PH1: resource}));
|
1393
|
+
if (detailsRow) {
|
1394
|
+
detailsRow.classList.add('infobar-selectable');
|
1395
|
+
}
|
1396
|
+
}
|
1397
|
+
this.missingDebugInfoBar.setCloseCallback(() => {
|
1398
|
+
this.removeInfobar(this.missingDebugInfoBar);
|
1399
|
+
this.missingDebugInfoBar = null;
|
1400
|
+
});
|
1401
|
+
this.attachInfobar(this.missingDebugInfoBar);
|
1353
1402
|
}
|
1354
1403
|
|
1355
1404
|
private showSourceMapInfobar(): void {
|
@@ -1481,6 +1530,7 @@ export class DebuggerPlugin extends Plugin {
|
|
1481
1530
|
const uiLocation = await liveLocation.uiLocation();
|
1482
1531
|
if (uiLocation && uiLocation.uiSourceCode.url() === this.uiSourceCode.url()) {
|
1483
1532
|
this.setExecutionLocation(uiLocation);
|
1533
|
+
this.updateMissingDebugInfoInfobar(callFrame.missingDebugInfoDetails);
|
1484
1534
|
} else {
|
1485
1535
|
this.setExecutionLocation(null);
|
1486
1536
|
}
|
@@ -53,6 +53,7 @@ export interface DataGridData {
|
|
53
53
|
rows: Row[];
|
54
54
|
activeSort: SortState|null;
|
55
55
|
contextMenus?: DataGridContextMenusConfiguration;
|
56
|
+
label?: string;
|
56
57
|
}
|
57
58
|
|
58
59
|
const enum UserScrollState {
|
@@ -76,6 +77,7 @@ export class DataGrid extends HTMLElement {
|
|
76
77
|
#isRendering = false;
|
77
78
|
#userScrollState: UserScrollState = UserScrollState.NOT_SCROLLED;
|
78
79
|
#contextMenus?: DataGridContextMenusConfiguration = undefined;
|
80
|
+
#label?: string = undefined;
|
79
81
|
#currentResize: {
|
80
82
|
rightCellCol: HTMLTableColElement,
|
81
83
|
leftCellCol: HTMLTableColElement,
|
@@ -132,6 +134,7 @@ export class DataGrid extends HTMLElement {
|
|
132
134
|
rows: this.#rows as Row[],
|
133
135
|
activeSort: this.#sortState,
|
134
136
|
contextMenus: this.#contextMenus,
|
137
|
+
label: this.#label,
|
135
138
|
};
|
136
139
|
}
|
137
140
|
|
@@ -143,6 +146,7 @@ export class DataGrid extends HTMLElement {
|
|
143
146
|
});
|
144
147
|
this.#sortState = data.activeSort;
|
145
148
|
this.#contextMenus = data.contextMenus;
|
149
|
+
this.#label = data.label;
|
146
150
|
|
147
151
|
/**
|
148
152
|
* On first render, now we have data, we can figure out which cell is the
|
@@ -711,6 +715,7 @@ export class DataGrid extends HTMLElement {
|
|
711
715
|
})}
|
712
716
|
<div class="wrapping-container" @scroll=${this.#onScroll} @focusout=${this.#onFocusOut}>
|
713
717
|
<table
|
718
|
+
aria-label=${LitHtml.Directives.ifDefined(this.#label)}
|
714
719
|
aria-rowcount=${this.#rows.length}
|
715
720
|
aria-colcount=${this.#columns.length}
|
716
721
|
@keydown=${this.#onTableKeyDown}
|
@@ -23,6 +23,7 @@ export interface DataGridControllerData {
|
|
23
23
|
*/
|
24
24
|
initialSort?: SortState;
|
25
25
|
contextMenus?: DataGridContextMenusConfiguration;
|
26
|
+
label?: string;
|
26
27
|
}
|
27
28
|
|
28
29
|
export class DataGridController extends HTMLElement {
|
@@ -33,6 +34,7 @@ export class DataGridController extends HTMLElement {
|
|
33
34
|
#columns: readonly Column[] = [];
|
34
35
|
#rows: Row[] = [];
|
35
36
|
#contextMenus?: DataGridContextMenusConfiguration = undefined;
|
37
|
+
#label?: string = undefined;
|
36
38
|
|
37
39
|
/**
|
38
40
|
* Because the controller will sort data in place (e.g. mutate it) when we get
|
@@ -56,6 +58,7 @@ export class DataGridController extends HTMLElement {
|
|
56
58
|
rows: this.#originalRows as Row[],
|
57
59
|
filters: this.#filters,
|
58
60
|
contextMenus: this.#contextMenus,
|
61
|
+
label: this.#label,
|
59
62
|
};
|
60
63
|
}
|
61
64
|
|
@@ -65,6 +68,7 @@ export class DataGridController extends HTMLElement {
|
|
65
68
|
this.#contextMenus = data.contextMenus;
|
66
69
|
this.#filters = data.filters || [];
|
67
70
|
this.#contextMenus = data.contextMenus;
|
71
|
+
this.#label = data.label;
|
68
72
|
|
69
73
|
this.#columns = [...this.#originalColumns];
|
70
74
|
this.#rows = this.#cloneAndFilterRows(data.rows, this.#filters);
|
@@ -210,6 +214,7 @@ export class DataGridController extends HTMLElement {
|
|
210
214
|
rows: this.#rows,
|
211
215
|
activeSort: this.#sortState,
|
212
216
|
contextMenus: this.#contextMenus,
|
217
|
+
label: this.#label,
|
213
218
|
} as DataGridData}
|
214
219
|
@columnheaderclick=${this.#onColumnHeaderClick}
|
215
220
|
@contextmenucolumnsortclick=${this.#onContextMenuColumnSortClick}
|
@@ -434,7 +434,7 @@ export class _ExpandableContainerWidget extends VBox {
|
|
434
434
|
|
435
435
|
this.titleElement = document.createElement('div');
|
436
436
|
this.titleElement.classList.add('expandable-view-title');
|
437
|
-
ARIAUtils.
|
437
|
+
ARIAUtils.markAsTreeitem(this.titleElement);
|
438
438
|
this.titleExpandIcon = Icon.create('smallicon-triangle-right', 'title-expand-icon');
|
439
439
|
this.titleElement.appendChild(this.titleExpandIcon);
|
440
440
|
const titleText = view.title();
|
@@ -858,7 +858,7 @@ class _StackLocation extends Location implements ViewLocation {
|
|
858
858
|
const vbox = new VBox();
|
859
859
|
super(manager, vbox, revealCallback);
|
860
860
|
this.vbox = vbox;
|
861
|
-
ARIAUtils.
|
861
|
+
ARIAUtils.markAsTree(vbox.element);
|
862
862
|
|
863
863
|
this.expandableContainers = new Map();
|
864
864
|
|
@@ -122,7 +122,7 @@ const elementToIndexMap = new WeakMap<Element, number>();
|
|
122
122
|
|
123
123
|
export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper<EventTypes<T>> {
|
124
124
|
element: HTMLDivElement;
|
125
|
-
|
125
|
+
displayName: string;
|
126
126
|
private editCallback: ((arg0: any, arg1: string, arg2: any, arg3: any) => void)|undefined;
|
127
127
|
private readonly deleteCallback: ((arg0: any) => void)|undefined;
|
128
128
|
private readonly refreshCallback: (() => void)|undefined;
|
@@ -24,6 +24,14 @@
|
|
24
24
|
background-color: var(--override-infobar-warning-background);
|
25
25
|
}
|
26
26
|
|
27
|
+
.infobar-error {
|
28
|
+
--override-infobar-error-background: var(--color-error-background);
|
29
|
+
--override-infobar-error-text: var(--color-error-text);
|
30
|
+
|
31
|
+
background-color: var(--override-infobar-error-background);
|
32
|
+
color: var(--override-infobar-error-text);
|
33
|
+
}
|
34
|
+
|
27
35
|
.-theme-with-dark-background .infobar-warning,
|
28
36
|
:host-context(.-theme-with-dark-background) .infobar-warning {
|
29
37
|
--override-infobar-warning-background: rgb(63 52 2);
|
@@ -75,6 +83,10 @@
|
|
75
83
|
margin: 4px;
|
76
84
|
}
|
77
85
|
|
86
|
+
.infobar-selectable {
|
87
|
+
user-select: text;
|
88
|
+
}
|
89
|
+
|
78
90
|
.infobar-button {
|
79
91
|
color: var(--color-text-secondary);
|
80
92
|
cursor: pointer;
|
@@ -93,6 +105,11 @@
|
|
93
105
|
background-color: var(--override-warning-icon-color);
|
94
106
|
}
|
95
107
|
|
108
|
+
.error-icon {
|
109
|
+
background-image: var(--image-file-error_icon);
|
110
|
+
background-size: contain;
|
111
|
+
}
|
112
|
+
|
96
113
|
.-theme-with-dark-background .warning-icon,
|
97
114
|
:host-context(.-theme-with-dark-background) .warning-icon {
|
98
115
|
--override-warning-icon-color: rgb(245 182 10);
|
package/package.json
CHANGED