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.
Files changed (33) hide show
  1. package/extension-api/ExtensionAPI.d.ts +5 -5
  2. package/front_end/core/host/UserMetrics.ts +3 -1
  3. package/front_end/core/i18n/locales/en-US.json +16 -7
  4. package/front_end/core/i18n/locales/en-XL.json +16 -7
  5. package/front_end/core/sdk/CSSProperty.ts +3 -3
  6. package/front_end/core/sdk/DebuggerModel.ts +12 -3
  7. package/front_end/core/sdk/EmulationModel.ts +9 -3
  8. package/front_end/core/sdk/Script.ts +3 -2
  9. package/front_end/generated/InspectorBackendCommands.js +3 -6
  10. package/front_end/generated/SupportedCSSProperties.js +2 -2
  11. package/front_end/generated/protocol.ts +24 -7
  12. package/front_end/models/bindings/BreakpointManager.ts +58 -22
  13. package/front_end/models/bindings/DebuggerLanguagePlugins.ts +72 -65
  14. package/front_end/models/bindings/ResourceScriptMapping.ts +13 -1
  15. package/front_end/models/extensions/ExtensionAPI.ts +14 -5
  16. package/front_end/models/extensions/ExtensionServer.ts +2 -2
  17. package/front_end/models/extensions/RecorderExtensionEndpoint.ts +16 -5
  18. package/front_end/models/issues_manager/DeprecationIssue.ts +1 -10
  19. package/front_end/models/javascript_metadata/NativeFunctions.js +4 -4
  20. package/front_end/models/persistence/Automapping.ts +18 -12
  21. package/front_end/models/persistence/PersistenceImpl.ts +10 -2
  22. package/front_end/models/workspace/WorkspaceImpl.ts +16 -9
  23. package/front_end/panels/application/DOMStorageItemsView.ts +6 -0
  24. package/front_end/panels/console/ConsoleViewMessage.ts +2 -1
  25. package/front_end/panels/sources/CallStackSidebarPane.ts +11 -4
  26. package/front_end/panels/sources/DebuggerPlugin.ts +51 -1
  27. package/front_end/ui/components/data_grid/DataGrid.ts +5 -0
  28. package/front_end/ui/components/data_grid/DataGridController.ts +5 -0
  29. package/front_end/ui/legacy/Infobar.ts +1 -0
  30. package/front_end/ui/legacy/ViewManager.ts +2 -2
  31. package/front_end/ui/legacy/components/data_grid/DataGrid.ts +1 -1
  32. package/front_end/ui/legacy/infobar.css +17 -0
  33. 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
- for (const warning of frame.warnings) {
208
- uniqueWarnings.add(warning);
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.warnings.length) {
324
+ if (callframe && callframe.missingDebugInfoDetails) {
320
325
  const icon = UI.Icon.Icon.create('smallicon-warning', 'call-frame-warning-icon');
321
- UI.Tooltip.Tooltip.install(icon, callframe.warnings.join('\n'));
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}
@@ -236,4 +236,5 @@ export enum Type {
236
236
  Warning = 'warning',
237
237
  Info = 'info',
238
238
  Issue = 'issue',
239
+ Error = 'error',
239
240
  }
@@ -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.markAsTab(this.titleElement);
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.markAsTablist(vbox.element);
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
- private displayName: string;
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
@@ -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.1009515"
58
+ "version": "1.0.1010780"
59
59
  }