chrome-devtools-frontend 1.0.945329 → 1.0.946351

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 (120) hide show
  1. package/config/gni/all_devtools_files.gni +0 -5
  2. package/config/gni/devtools_grd_files.gni +1 -33
  3. package/config/gni/devtools_image_files.gni +1 -0
  4. package/front_end/Images/src/circled_exclamation_icon.svg +3 -0
  5. package/front_end/core/host/UserMetrics.ts +0 -1
  6. package/front_end/core/i18n/locales/en-US.json +12 -12
  7. package/front_end/core/i18n/locales/en-XL.json +12 -12
  8. package/front_end/core/root/Runtime.ts +0 -1
  9. package/front_end/core/sdk/CSSMetadata.ts +0 -1
  10. package/front_end/core/sdk/CSSProperty.ts +16 -9
  11. package/front_end/core/sdk/sdk-meta.ts +20 -8
  12. package/front_end/devtools_compatibility.js +0 -7
  13. package/front_end/entrypoints/devtools_app/devtools_app.js +3 -0
  14. package/front_end/entrypoints/devtools_app/devtools_app.json +1 -2
  15. package/front_end/entrypoints/formatter_worker/CSSFormatter.ts +1 -3
  16. package/front_end/entrypoints/formatter_worker/FormatterActions.ts +0 -2
  17. package/front_end/entrypoints/formatter_worker/FormatterWorker.ts +0 -120
  18. package/front_end/entrypoints/formatter_worker/formatter_worker-entrypoint.ts +1 -11
  19. package/front_end/entrypoints/formatter_worker/formatter_worker.ts +5 -0
  20. package/front_end/entrypoints/js_app/js_app.js +3 -0
  21. package/front_end/entrypoints/js_app/js_app.json +1 -2
  22. package/front_end/entrypoints/main/MainImpl.ts +0 -6
  23. package/front_end/entrypoints/ndb_app/ndb_app.js +3 -0
  24. package/front_end/entrypoints/ndb_app/ndb_app.json +1 -2
  25. package/front_end/entrypoints/node_app/node_app.js +3 -0
  26. package/front_end/entrypoints/node_app/node_app.json +1 -2
  27. package/front_end/entrypoints/shell/shell.js +18 -1
  28. package/front_end/entrypoints/worker_app/worker_app.js +3 -0
  29. package/front_end/entrypoints/worker_app/worker_app.json +1 -2
  30. package/front_end/generated/protocol.d.ts +0 -4
  31. package/front_end/legacy_test_runner/sources_test_runner/sources_test_runner.js +0 -1
  32. package/front_end/models/bindings/DebuggerWorkspaceBinding.ts +1 -1
  33. package/front_end/models/bindings/ResourceMapping.ts +1 -1
  34. package/front_end/models/emulation/EmulatedDevices.ts +2 -4
  35. package/front_end/models/formatter/FormatterWorkerPool.ts +0 -18
  36. package/front_end/models/text_utils/CodeMirrorUtils.ts +6 -51
  37. package/front_end/models/text_utils/TextUtils.ts +1 -2
  38. package/front_end/models/text_utils/text_utils-legacy.ts +0 -5
  39. package/front_end/panels/animation/AnimationTimeline.ts +1 -1
  40. package/front_end/panels/application/ApplicationPanelSidebar.ts +2 -4
  41. package/front_end/panels/application/BackForwardCacheView.ts +8 -1
  42. package/front_end/panels/elements/StyleEditorWidget.ts +13 -2
  43. package/front_end/panels/elements/StylePropertyTreeElement.ts +8 -12
  44. package/front_end/panels/elements/StylesSidebarPane.ts +35 -9
  45. package/front_end/panels/elements/elementsTreeOutline.css +0 -13
  46. package/front_end/panels/network/NetworkConfigView.ts +10 -0
  47. package/front_end/panels/network/NetworkItemView.ts +10 -1
  48. package/front_end/panels/network/networkConfigView.css +5 -0
  49. package/front_end/panels/profiler/heapProfiler.css +2 -5
  50. package/front_end/panels/profiler/profilesPanel.css +1 -1
  51. package/front_end/panels/settings/emulation/components/UserAgentClientHintsForm.ts +6 -4
  52. package/front_end/panels/settings/emulation/components/userAgentClientHintsForm.css +0 -12
  53. package/front_end/panels/sources/DebuggerPlugin.ts +6 -2
  54. package/front_end/panels/sources/sourcesView.css +0 -130
  55. package/front_end/panels/webauthn/WebauthnPane.ts +31 -32
  56. package/front_end/third_party/codemirror/codemirror-tsconfig.json +1 -25
  57. package/front_end/ui/components/adorners/Adorner.ts +14 -14
  58. package/front_end/ui/components/buttons/Button.ts +133 -42
  59. package/front_end/ui/components/buttons/button.css +31 -0
  60. package/front_end/ui/components/data_grid/DataGrid.ts +131 -122
  61. package/front_end/ui/components/data_grid/DataGridController.ts +42 -42
  62. package/front_end/ui/components/diff_view/DiffView.ts +4 -4
  63. package/front_end/ui/components/docs/button/basic.html +3 -0
  64. package/front_end/ui/components/docs/button/basic.ts +58 -0
  65. package/front_end/ui/components/expandable_list/ExpandableList.ts +11 -11
  66. package/front_end/ui/components/icon_button/Icon.ts +24 -21
  67. package/front_end/ui/components/icon_button/IconButton.ts +31 -31
  68. package/front_end/ui/components/issue_counter/IssueCounter.ts +52 -52
  69. package/front_end/ui/components/issue_counter/IssueLinkIcon.ts +42 -42
  70. package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspector.ts +67 -67
  71. package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorController.ts +22 -22
  72. package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorPane.ts +36 -36
  73. package/front_end/ui/components/linear_memory_inspector/LinearMemoryNavigator.ts +19 -19
  74. package/front_end/ui/components/linear_memory_inspector/LinearMemoryValueInterpreter.ts +24 -32
  75. package/front_end/ui/components/linear_memory_inspector/LinearMemoryViewer.ts +52 -52
  76. package/front_end/ui/components/linear_memory_inspector/ValueInterpreterDisplay.ts +21 -21
  77. package/front_end/ui/components/linear_memory_inspector/ValueInterpreterSettings.ts +6 -6
  78. package/front_end/ui/components/markdown_view/MarkdownImage.ts +14 -14
  79. package/front_end/ui/components/markdown_view/MarkdownLink.ts +8 -8
  80. package/front_end/ui/components/markdown_view/MarkdownView.ts +6 -6
  81. package/front_end/ui/components/render_coordinator/RenderCoordinator.ts +33 -33
  82. package/front_end/ui/components/report_view/ReportView.ts +18 -18
  83. package/front_end/ui/components/request_link_icon/RequestLinkIcon.ts +53 -53
  84. package/front_end/ui/components/settings/SettingCheckbox.ts +15 -15
  85. package/front_end/ui/components/survey_link/SurveyLink.ts +28 -28
  86. package/front_end/ui/components/text_editor/TextEditor.ts +55 -52
  87. package/front_end/ui/components/text_editor/config.ts +3 -3
  88. package/front_end/ui/components/text_editor/javascript.ts +27 -9
  89. package/front_end/ui/components/text_editor/theme.ts +1 -0
  90. package/front_end/ui/components/text_prompt/TextPrompt.ts +19 -19
  91. package/front_end/ui/components/tree_outline/TreeOutline.ts +56 -56
  92. package/front_end/ui/legacy/Infobar.ts +9 -0
  93. package/front_end/ui/legacy/ListWidget.ts +2 -2
  94. package/front_end/ui/legacy/components/object_ui/ObjectPropertiesSection.ts +2 -3
  95. package/front_end/ui/legacy/components/object_ui/objectPropertiesSection.css +0 -1
  96. package/front_end/ui/legacy/components/object_ui/object_ui-legacy.ts +0 -8
  97. package/front_end/ui/legacy/components/object_ui/object_ui.ts +0 -4
  98. package/front_end/ui/legacy/components/source_frame/SourceFrame.ts +3 -0
  99. package/front_end/ui/legacy/inspectorSyntaxHighlight.css +0 -211
  100. package/front_end/ui/legacy/legacy-legacy.ts +0 -6
  101. package/front_end/ui/legacy/legacy.ts +0 -2
  102. package/front_end/ui/legacy/tabbedPane.css +1 -1
  103. package/inspector_overlay/main.ts +12 -2
  104. package/package.json +1 -1
  105. package/scripts/check_gn.js +1 -1
  106. package/scripts/eslint_rules/lib/l10n_filename_matches.js +17 -4
  107. package/scripts/eslint_rules/tests/l10n_filename_matches_test.js +21 -0
  108. package/scripts/hosted_mode/server.js +17 -2
  109. package/front_end/entrypoints/shell/shell-meta-files.ts +0 -22
  110. package/front_end/entrypoints/shell/shell.json +0 -5
  111. package/front_end/ui/legacy/TextEditor.ts +0 -82
  112. package/front_end/ui/legacy/components/object_ui/JavaScriptAutocomplete.ts +0 -836
  113. package/front_end/ui/legacy/components/text_editor/CodeMirrorTextEditor.ts +0 -1676
  114. package/front_end/ui/legacy/components/text_editor/TextEditorAutocompleteController.ts +0 -586
  115. package/front_end/ui/legacy/components/text_editor/autocompleteTooltip.css +0 -20
  116. package/front_end/ui/legacy/components/text_editor/cm_modes.ts +0 -23
  117. package/front_end/ui/legacy/components/text_editor/cmdevtools.css +0 -995
  118. package/front_end/ui/legacy/components/text_editor/module.json +0 -7
  119. package/front_end/ui/legacy/components/text_editor/text_editor-legacy.ts +0 -33
  120. package/front_end/ui/legacy/components/text_editor/text_editor.ts +0 -13
@@ -25,14 +25,14 @@ export interface LazyUint8Array {
25
25
  }
26
26
 
27
27
  export class RemoteArrayBufferWrapper implements LazyUint8Array {
28
- private remoteArrayBuffer: SDK.RemoteObject.RemoteArrayBuffer;
28
+ #remoteArrayBuffer: SDK.RemoteObject.RemoteArrayBuffer;
29
29
 
30
30
  constructor(arrayBuffer: SDK.RemoteObject.RemoteArrayBuffer) {
31
- this.remoteArrayBuffer = arrayBuffer;
31
+ this.#remoteArrayBuffer = arrayBuffer;
32
32
  }
33
33
 
34
34
  length(): number {
35
- return this.remoteArrayBuffer.byteLength();
35
+ return this.#remoteArrayBuffer.byteLength();
36
36
  }
37
37
 
38
38
  async getRange(start: number, end: number): Promise<Uint8Array> {
@@ -41,7 +41,7 @@ export class RemoteArrayBufferWrapper implements LazyUint8Array {
41
41
  console.error(`Requesting invalid range of memory: (${start}, ${end})`);
42
42
  return new Uint8Array(0);
43
43
  }
44
- const array = await this.remoteArrayBuffer.bytes(start, newEnd);
44
+ const array = await this.#remoteArrayBuffer.bytes(start, newEnd);
45
45
  return new Uint8Array(array);
46
46
  }
47
47
  }
@@ -73,16 +73,16 @@ type SerializableSettings = {
73
73
  };
74
74
 
75
75
  export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelObserver<SDK.RuntimeModel.RuntimeModel> {
76
- private paneInstance = LinearMemoryInspectorPaneImpl.instance();
77
- private bufferIdToRemoteObject: Map<string, SDK.RemoteObject.RemoteObject> = new Map();
78
- private settings: Common.Settings.Setting<SerializableSettings>;
76
+ #paneInstance = LinearMemoryInspectorPaneImpl.instance();
77
+ #bufferIdToRemoteObject: Map<string, SDK.RemoteObject.RemoteObject> = new Map();
78
+ #settings: Common.Settings.Setting<SerializableSettings>;
79
79
 
80
80
  private constructor() {
81
81
  super();
82
82
  SDK.TargetManager.TargetManager.instance().observeModels(SDK.RuntimeModel.RuntimeModel, this);
83
83
  SDK.TargetManager.TargetManager.instance().addModelListener(
84
84
  SDK.DebuggerModel.DebuggerModel, SDK.DebuggerModel.Events.GlobalObjectCleared, this.onGlobalObjectClear, this);
85
- this.paneInstance.addEventListener(LmiEvents.ViewClosed, this.viewClosed.bind(this));
85
+ this.#paneInstance.addEventListener(LmiEvents.ViewClosed, this.viewClosed.bind(this));
86
86
 
87
87
  SDK.TargetManager.TargetManager.instance().addModelListener(
88
88
  SDK.DebuggerModel.DebuggerModel, SDK.DebuggerModel.Events.DebuggerPaused, this.onDebuggerPause, this);
@@ -93,7 +93,7 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
93
93
  valueTypeModes: Array.from(defaultValueTypeModes),
94
94
  endianness: Endianness.Little,
95
95
  };
96
- this.settings = Common.Settings.Settings.instance().createSetting('lmiInterpreterSettings', defaultSettings);
96
+ this.#settings = Common.Settings.Settings.instance().createSetting('lmiInterpreterSettings', defaultSettings);
97
97
  }
98
98
 
99
99
  static instance(): LinearMemoryInspectorController {
@@ -130,11 +130,11 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
130
130
  saveSettings(data: Settings): void {
131
131
  const valueTypes = Array.from(data.valueTypes);
132
132
  const modes = [...data.modes];
133
- this.settings.set({valueTypes, valueTypeModes: modes, endianness: data.endianness});
133
+ this.#settings.set({valueTypes, valueTypeModes: modes, endianness: data.endianness});
134
134
  }
135
135
 
136
136
  loadSettings(): Settings {
137
- const settings = this.settings.get();
137
+ const settings = this.#settings.get();
138
138
  return {
139
139
  valueTypes: new Set(settings.valueTypes),
140
140
  modes: new Map(settings.valueTypeModes),
@@ -166,34 +166,34 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
166
166
  const memoryProperty = internalProperties?.find(({name}) => name === '[[WebAssemblyMemory]]');
167
167
  const memory = memoryProperty?.value;
168
168
 
169
- if (this.bufferIdToRemoteObject.has(id)) {
170
- this.paneInstance.reveal(id, address);
169
+ if (this.#bufferIdToRemoteObject.has(id)) {
170
+ this.#paneInstance.reveal(id, address);
171
171
  UI.ViewManager.ViewManager.instance().showView('linear-memory-inspector');
172
172
  return;
173
173
  }
174
174
 
175
175
  const title = String(memory ? memory.description : buffer.object().description);
176
- this.bufferIdToRemoteObject.set(id, buffer.object());
176
+ this.#bufferIdToRemoteObject.set(id, buffer.object());
177
177
  const arrayBufferWrapper = new RemoteArrayBufferWrapper(buffer);
178
178
 
179
- this.paneInstance.create(id, title, arrayBufferWrapper, address);
179
+ this.#paneInstance.create(id, title, arrayBufferWrapper, address);
180
180
  UI.ViewManager.ViewManager.instance().showView('linear-memory-inspector');
181
181
  }
182
182
 
183
183
  modelRemoved(model: SDK.RuntimeModel.RuntimeModel): void {
184
- for (const [bufferId, remoteObject] of this.bufferIdToRemoteObject) {
184
+ for (const [bufferId, remoteObject] of this.#bufferIdToRemoteObject) {
185
185
  if (model === remoteObject.runtimeModel()) {
186
- this.bufferIdToRemoteObject.delete(bufferId);
187
- this.paneInstance.close(bufferId);
186
+ this.#bufferIdToRemoteObject.delete(bufferId);
187
+ this.#paneInstance.close(bufferId);
188
188
  }
189
189
  }
190
190
  }
191
191
 
192
192
  private onDebuggerPause(event: Common.EventTarget.EventTargetEvent<SDK.DebuggerModel.DebuggerModel>): void {
193
193
  const debuggerModel = event.data;
194
- for (const [bufferId, remoteObject] of this.bufferIdToRemoteObject) {
194
+ for (const [bufferId, remoteObject] of this.#bufferIdToRemoteObject) {
195
195
  if (debuggerModel.runtimeModel() === remoteObject.runtimeModel()) {
196
- this.paneInstance.refreshView(bufferId);
196
+ this.#paneInstance.refreshView(bufferId);
197
197
  }
198
198
  }
199
199
  }
@@ -203,10 +203,10 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
203
203
  }
204
204
 
205
205
  private viewClosed({data: bufferId}: Common.EventTarget.EventTargetEvent<string>): void {
206
- const remoteObj = this.bufferIdToRemoteObject.get(bufferId);
206
+ const remoteObj = this.#bufferIdToRemoteObject.get(bufferId);
207
207
  if (remoteObj) {
208
208
  remoteObj.release();
209
209
  }
210
- this.bufferIdToRemoteObject.delete(bufferId);
210
+ this.#bufferIdToRemoteObject.delete(bufferId);
211
211
  }
212
212
  }
@@ -50,21 +50,21 @@ export class Wrapper extends UI.Widget.VBox {
50
50
 
51
51
  export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.VBox>(
52
52
  UI.Widget.VBox) {
53
- private readonly tabbedPane: UI.TabbedPane.TabbedPane;
54
- private readonly tabIdToInspectorView: Map<string, LinearMemoryInspectorView>;
53
+ readonly #tabbedPane: UI.TabbedPane.TabbedPane;
54
+ readonly #tabIdToInspectorView: Map<string, LinearMemoryInspectorView>;
55
55
  constructor() {
56
56
  super(false);
57
57
  const placeholder = document.createElement('div');
58
58
  placeholder.textContent = i18nString(UIStrings.noOpenInspections);
59
59
  placeholder.style.display = 'flex';
60
- this.tabbedPane = new UI.TabbedPane.TabbedPane();
61
- this.tabbedPane.setPlaceholderElement(placeholder);
62
- this.tabbedPane.setCloseableTabs(true);
63
- this.tabbedPane.setAllowTabReorder(true, true);
64
- this.tabbedPane.addEventListener(UI.TabbedPane.Events.TabClosed, this.tabClosed, this);
65
- this.tabbedPane.show(this.contentElement);
60
+ this.#tabbedPane = new UI.TabbedPane.TabbedPane();
61
+ this.#tabbedPane.setPlaceholderElement(placeholder);
62
+ this.#tabbedPane.setCloseableTabs(true);
63
+ this.#tabbedPane.setAllowTabReorder(true, true);
64
+ this.#tabbedPane.addEventListener(UI.TabbedPane.Events.TabClosed, this.tabClosed, this);
65
+ this.#tabbedPane.show(this.contentElement);
66
66
 
67
- this.tabIdToInspectorView = new Map();
67
+ this.#tabIdToInspectorView = new Map();
68
68
  }
69
69
 
70
70
  static instance(): LinearMemoryInspectorPaneImpl {
@@ -76,17 +76,17 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
76
76
 
77
77
  create(tabId: string, title: string, arrayWrapper: LazyUint8Array, address?: number): void {
78
78
  const inspectorView = new LinearMemoryInspectorView(arrayWrapper, address);
79
- this.tabIdToInspectorView.set(tabId, inspectorView);
80
- this.tabbedPane.appendTab(tabId, title, inspectorView, undefined, false, true);
81
- this.tabbedPane.selectTab(tabId);
79
+ this.#tabIdToInspectorView.set(tabId, inspectorView);
80
+ this.#tabbedPane.appendTab(tabId, title, inspectorView, undefined, false, true);
81
+ this.#tabbedPane.selectTab(tabId);
82
82
  }
83
83
 
84
84
  close(tabId: string): void {
85
- this.tabbedPane.closeTab(tabId, false);
85
+ this.#tabbedPane.closeTab(tabId, false);
86
86
  }
87
87
 
88
88
  reveal(tabId: string, address?: number): void {
89
- const view = this.tabIdToInspectorView.get(tabId);
89
+ const view = this.#tabIdToInspectorView.get(tabId);
90
90
  if (!view) {
91
91
  throw new Error(`No linear memory inspector view for given tab id: ${tabId}`);
92
92
  }
@@ -95,11 +95,11 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
95
95
  view.updateAddress(address);
96
96
  }
97
97
  this.refreshView(tabId);
98
- this.tabbedPane.selectTab(tabId);
98
+ this.#tabbedPane.selectTab(tabId);
99
99
  }
100
100
 
101
101
  refreshView(tabId: string): void {
102
- const view = this.tabIdToInspectorView.get(tabId);
102
+ const view = this.#tabIdToInspectorView.get(tabId);
103
103
  if (!view) {
104
104
  throw new Error(`View for specified tab id does not exist: ${tabId}`);
105
105
  }
@@ -108,7 +108,7 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
108
108
 
109
109
  private tabClosed(event: Common.EventTarget.EventTargetEvent<UI.TabbedPane.EventData>): void {
110
110
  const {tabId} = event.data;
111
- this.tabIdToInspectorView.delete(tabId);
111
+ this.#tabIdToInspectorView.delete(tabId);
112
112
  this.dispatchEventToListeners(Events.ViewClosed, tabId);
113
113
  }
114
114
  }
@@ -122,9 +122,9 @@ export type EventTypes = {
122
122
  };
123
123
 
124
124
  class LinearMemoryInspectorView extends UI.Widget.VBox {
125
- private memoryWrapper: LazyUint8Array;
126
- private address: number;
127
- private inspector: LinearMemoryInspector;
125
+ #memoryWrapper: LazyUint8Array;
126
+ #address: number;
127
+ #inspector: LinearMemoryInspector;
128
128
  firstTimeOpen: boolean;
129
129
  constructor(memoryWrapper: LazyUint8Array, address: number|undefined = 0) {
130
130
  super(false);
@@ -133,21 +133,21 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
133
133
  throw new Error('Requested address is out of bounds.');
134
134
  }
135
135
 
136
- this.memoryWrapper = memoryWrapper;
137
- this.address = address;
138
- this.inspector = new LinearMemoryInspector();
139
- this.inspector.addEventListener('memoryrequest', (event: MemoryRequestEvent) => {
136
+ this.#memoryWrapper = memoryWrapper;
137
+ this.#address = address;
138
+ this.#inspector = new LinearMemoryInspector();
139
+ this.#inspector.addEventListener('memoryrequest', (event: MemoryRequestEvent) => {
140
140
  this.memoryRequested(event);
141
141
  });
142
- this.inspector.addEventListener('addresschanged', (event: AddressChangedEvent) => {
142
+ this.#inspector.addEventListener('addresschanged', (event: AddressChangedEvent) => {
143
143
  this.updateAddress(event.data);
144
144
  });
145
- this.inspector.addEventListener('settingschanged', (event: SettingsChangedEvent) => {
145
+ this.#inspector.addEventListener('settingschanged', (event: SettingsChangedEvent) => {
146
146
  // Stop event from bubbling up, since no element further up needs the event.
147
147
  event.stopPropagation();
148
148
  this.saveSettings(event.data);
149
149
  });
150
- this.contentElement.appendChild(this.inspector);
150
+ this.contentElement.appendChild(this.#inspector);
151
151
  this.firstTimeOpen = true;
152
152
  }
153
153
 
@@ -160,14 +160,14 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
160
160
  }
161
161
 
162
162
  updateAddress(address: number): void {
163
- if (address < 0 || address >= this.memoryWrapper.length()) {
163
+ if (address < 0 || address >= this.#memoryWrapper.length()) {
164
164
  throw new Error('Requested address is out of bounds.');
165
165
  }
166
- this.address = address;
166
+ this.#address = address;
167
167
  }
168
168
 
169
169
  refreshData(): void {
170
- LinearMemoryInspectorController.getMemoryForAddress(this.memoryWrapper, this.address).then(({memory, offset}) => {
170
+ LinearMemoryInspectorController.getMemoryForAddress(this.#memoryWrapper, this.#address).then(({memory, offset}) => {
171
171
  let valueTypes;
172
172
  let valueTypeModes;
173
173
  let endianness;
@@ -178,11 +178,11 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
178
178
  endianness = settings.endianness;
179
179
  this.firstTimeOpen = false;
180
180
  }
181
- this.inspector.data = {
181
+ this.#inspector.data = {
182
182
  memory,
183
- address: this.address,
183
+ address: this.#address,
184
184
  memoryOffset: offset,
185
- outerMemoryLength: this.memoryWrapper.length(),
185
+ outerMemoryLength: this.#memoryWrapper.length(),
186
186
  valueTypes,
187
187
  valueTypeModes,
188
188
  endianness,
@@ -196,12 +196,12 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
196
196
  throw new Error('Requested address is out of bounds.');
197
197
  }
198
198
 
199
- LinearMemoryInspectorController.getMemoryRange(this.memoryWrapper, start, end).then(memory => {
200
- this.inspector.data = {
199
+ LinearMemoryInspectorController.getMemoryRange(this.#memoryWrapper, start, end).then(memory => {
200
+ this.#inspector.data = {
201
201
  memory: memory,
202
202
  address: address,
203
203
  memoryOffset: start,
204
- outerMemoryLength: this.memoryWrapper.length(),
204
+ outerMemoryLength: this.#memoryWrapper.length(),
205
205
  };
206
206
  });
207
207
  }
@@ -98,26 +98,26 @@ export const enum Mode {
98
98
  export class LinearMemoryNavigator extends HTMLElement {
99
99
  static readonly litTagName = LitHtml.literal`devtools-linear-memory-inspector-navigator`;
100
100
 
101
- private readonly shadow = this.attachShadow({mode: 'open'});
102
- private address = '0';
103
- private error: string|undefined = undefined;
104
- private valid = true;
105
- private canGoBackInHistory = false;
106
- private canGoForwardInHistory = false;
101
+ readonly #shadow = this.attachShadow({mode: 'open'});
102
+ #address = '0';
103
+ #error: string|undefined = undefined;
104
+ #valid = true;
105
+ #canGoBackInHistory = false;
106
+ #canGoForwardInHistory = false;
107
107
 
108
108
  connectedCallback(): void {
109
- this.shadow.adoptedStyleSheets = [linearMemoryNavigatorStyles];
109
+ this.#shadow.adoptedStyleSheets = [linearMemoryNavigatorStyles];
110
110
  }
111
111
 
112
112
  set data(data: LinearMemoryNavigatorData) {
113
- this.address = data.address;
114
- this.error = data.error;
115
- this.valid = data.valid;
116
- this.canGoBackInHistory = data.canGoBackInHistory;
117
- this.canGoForwardInHistory = data.canGoForwardInHistory;
113
+ this.#address = data.address;
114
+ this.#error = data.error;
115
+ this.#valid = data.valid;
116
+ this.#canGoBackInHistory = data.canGoBackInHistory;
117
+ this.#canGoForwardInHistory = data.canGoForwardInHistory;
118
118
  this.render();
119
119
 
120
- const addressInput = this.shadow.querySelector<HTMLInputElement>('.address-input');
120
+ const addressInput = this.#shadow.querySelector<HTMLInputElement>('.address-input');
121
121
  if (addressInput) {
122
122
  if (data.mode === Mode.Submitted) {
123
123
  addressInput.blur();
@@ -134,9 +134,9 @@ export class LinearMemoryNavigator extends HTMLElement {
134
134
  <div class="navigator">
135
135
  <div class="navigator-item">
136
136
  ${this.createButton({icon: 'ic_undo_16x16_icon', title: i18nString(UIStrings.goBackInAddressHistory),
137
- event: new HistoryNavigationEvent(Navigation.Backward), enabled: this.canGoBackInHistory})}
137
+ event: new HistoryNavigationEvent(Navigation.Backward), enabled: this.#canGoBackInHistory})}
138
138
  ${this.createButton({icon: 'ic_redo_16x16_icon', title: i18nString(UIStrings.goForwardInAddressHistory),
139
- event: new HistoryNavigationEvent(Navigation.Forward), enabled: this.canGoForwardInHistory})}
139
+ event: new HistoryNavigationEvent(Navigation.Forward), enabled: this.#canGoForwardInHistory})}
140
140
  </div>
141
141
  <div class="navigator-item">
142
142
  ${this.createButton({icon: 'ic_page_prev_16x16_icon', title: i18nString(UIStrings.previousPage),
@@ -149,18 +149,18 @@ export class LinearMemoryNavigator extends HTMLElement {
149
149
  event: new RefreshRequestedEvent(), enabled: true})}
150
150
  </div>
151
151
  `;
152
- render(result, this.shadow, {host: this});
152
+ render(result, this.#shadow, {host: this});
153
153
  // clang-format on
154
154
  }
155
155
 
156
156
  private createAddressInput(): LitHtml.TemplateResult {
157
157
  const classMap = {
158
158
  'address-input': true,
159
- invalid: !this.valid,
159
+ invalid: !this.#valid,
160
160
  };
161
161
  return html`
162
- <input class=${LitHtml.Directives.classMap(classMap)} data-input="true" .value=${this.address}
163
- title=${this.valid ? i18nString(UIStrings.enterAddress) : this.error} @change=${
162
+ <input class=${LitHtml.Directives.classMap(classMap)} data-input="true" .value=${this.#address}
163
+ title=${this.#valid ? i18nString(UIStrings.enterAddress) : this.#error} @change=${
164
164
  this.onAddressChange.bind(this, Mode.Submitted)} @input=${this.onAddressChange.bind(this, Mode.Edit)}/>`;
165
165
  }
166
166
 
@@ -16,7 +16,6 @@ import {Endianness} from './ValueInterpreterDisplayUtils.js';
16
16
  import type {TypeToggleEvent, ValueInterpreterSettingsData} from './ValueInterpreterSettings.js';
17
17
 
18
18
  import * as i18n from '../../../core/i18n/i18n.js';
19
- import inspectorCommonStyles from '../../legacy/inspectorCommon.css.js';
20
19
 
21
20
  const UIStrings = {
22
21
  /**
@@ -66,31 +65,24 @@ export interface LinearMemoryValueInterpreterData {
66
65
  export class LinearMemoryValueInterpreter extends HTMLElement {
67
66
  static readonly litTagName = LitHtml.literal`devtools-linear-memory-inspector-interpreter`;
68
67
 
69
- private readonly shadow = this.attachShadow({mode: 'open'});
70
- private endianness = Endianness.Little;
71
- private buffer = new ArrayBuffer(0);
72
- private valueTypes: Set<ValueType> = new Set();
73
- private valueTypeModeConfig: Map<ValueType, ValueTypeMode> = new Map();
74
- private memoryLength = 0;
75
- private showSettings = false;
76
-
77
- constructor() {
78
- super();
79
- this.shadow.adoptedStyleSheets = [
80
- inspectorCommonStyles,
81
- ];
82
- }
68
+ readonly #shadow = this.attachShadow({mode: 'open'});
69
+ #endianness = Endianness.Little;
70
+ #buffer = new ArrayBuffer(0);
71
+ #valueTypes: Set<ValueType> = new Set();
72
+ #valueTypeModeConfig: Map<ValueType, ValueTypeMode> = new Map();
73
+ #memoryLength = 0;
74
+ #showSettings = false;
83
75
 
84
76
  connectedCallback(): void {
85
- this.shadow.adoptedStyleSheets = [linearMemoryValueInterpreterStyles];
77
+ this.#shadow.adoptedStyleSheets = [linearMemoryValueInterpreterStyles];
86
78
  }
87
79
 
88
80
  set data(data: LinearMemoryValueInterpreterData) {
89
- this.endianness = data.endianness;
90
- this.buffer = data.value;
91
- this.valueTypes = data.valueTypes;
92
- this.valueTypeModeConfig = data.valueTypeModes || new Map();
93
- this.memoryLength = data.memoryLength;
81
+ this.#endianness = data.endianness;
82
+ this.#buffer = data.value;
83
+ this.#valueTypes = data.valueTypes;
84
+ this.#valueTypeModeConfig = data.valueTypeModes || new Map();
85
+ this.#memoryLength = data.memoryLength;
94
86
  this.render();
95
87
  }
96
88
 
@@ -101,7 +93,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
101
93
  <div class="value-interpreter">
102
94
  <div class="settings-toolbar">
103
95
  ${this.renderEndiannessSetting()}
104
- <button data-settings="true" class="settings-toolbar-button ${this.showSettings ? 'active' : ''}" title=${i18nString(UIStrings.toggleValueTypeSettings)} @click=${this.onSettingsToggle}>
96
+ <button data-settings="true" class="settings-toolbar-button ${this.#showSettings ? 'active' : ''}" title=${i18nString(UIStrings.toggleValueTypeSettings)} @click=${this.onSettingsToggle}>
105
97
  <${IconButton.Icon.Icon.litTagName}
106
98
  .data=${{ iconName: 'settings_14x14_icon', color: 'var(--color-text-secondary)', width: '14px' } as IconButton.Icon.IconWithName}>
107
99
  </${IconButton.Icon.Icon.litTagName}>
@@ -109,26 +101,26 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
109
101
  </div>
110
102
  <span class="divider"></span>
111
103
  <div>
112
- ${this.showSettings ?
104
+ ${this.#showSettings ?
113
105
  html`
114
106
  <${ValueInterpreterSettings.litTagName}
115
- .data=${{ valueTypes: this.valueTypes } as ValueInterpreterSettingsData}
107
+ .data=${{ valueTypes: this.#valueTypes } as ValueInterpreterSettingsData}
116
108
  @typetoggle=${this.onTypeToggle}>
117
109
  </${ValueInterpreterSettings.litTagName}>` :
118
110
  html`
119
111
  <${ValueInterpreterDisplay.litTagName}
120
112
  .data=${{
121
- buffer: this.buffer,
122
- valueTypes: this.valueTypes,
123
- endianness: this.endianness,
124
- valueTypeModes: this.valueTypeModeConfig,
125
- memoryLength: this.memoryLength,
113
+ buffer: this.#buffer,
114
+ valueTypes: this.#valueTypes,
115
+ endianness: this.#endianness,
116
+ valueTypeModes: this.#valueTypeModeConfig,
117
+ memoryLength: this.#memoryLength,
126
118
  } as ValueDisplayData}>
127
119
  </${ValueInterpreterDisplay.litTagName}>`}
128
120
  </div>
129
121
  </div>
130
122
  `,
131
- this.shadow, { host: this },
123
+ this.#shadow, { host: this },
132
124
  );
133
125
  // clang-format on
134
126
  }
@@ -150,7 +142,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
150
142
  style="border: none; background-color: transparent; cursor: pointer;"
151
143
  data-endianness="true" @change=${onEnumSettingChange}>
152
144
  ${[Endianness.Little, Endianness.Big].map(endianness => {
153
- return html`<option value=${endianness} .selected=${this.endianness === endianness}>${
145
+ return html`<option value=${endianness} .selected=${this.#endianness === endianness}>${
154
146
  i18n.i18n.lockedString(endianness)}</option>`;
155
147
  })}
156
148
  </select>
@@ -160,7 +152,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
160
152
  }
161
153
 
162
154
  private onSettingsToggle(): void {
163
- this.showSettings = !this.showSettings;
155
+ this.#showSettings = !this.#showSettings;
164
156
  this.render();
165
157
  }
166
158