chrome-devtools-frontend 1.0.944903 → 1.0.945884

package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorController.ts

@@ -25,14 +25,14 @@ export interface LazyUint8Array {
 }
 
 export class RemoteArrayBufferWrapper implements LazyUint8Array {
-  private remoteArrayBuffer: SDK.RemoteObject.RemoteArrayBuffer;
+  #remoteArrayBuffer: SDK.RemoteObject.RemoteArrayBuffer;
 
   constructor(arrayBuffer: SDK.RemoteObject.RemoteArrayBuffer) {
-    this.remoteArrayBuffer = arrayBuffer;
+    this.#remoteArrayBuffer = arrayBuffer;
   }
 
   length(): number {
-    return this.remoteArrayBuffer.byteLength();
+    return this.#remoteArrayBuffer.byteLength();
   }
 
   async getRange(start: number, end: number): Promise<Uint8Array> {
@@ -41,7 +41,7 @@ export class RemoteArrayBufferWrapper implements LazyUint8Array {
       console.error(`Requesting invalid range of memory: (${start}, ${end})`);
       return new Uint8Array(0);
     }
-    const array = await this.remoteArrayBuffer.bytes(start, newEnd);
+    const array = await this.#remoteArrayBuffer.bytes(start, newEnd);
     return new Uint8Array(array);
   }
 }
@@ -73,16 +73,16 @@ type SerializableSettings = {
 };
 
 export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelObserver<SDK.RuntimeModel.RuntimeModel> {
-  private paneInstance = LinearMemoryInspectorPaneImpl.instance();
-  private bufferIdToRemoteObject: Map<string, SDK.RemoteObject.RemoteObject> = new Map();
-  private settings: Common.Settings.Setting<SerializableSettings>;
+  #paneInstance = LinearMemoryInspectorPaneImpl.instance();
+  #bufferIdToRemoteObject: Map<string, SDK.RemoteObject.RemoteObject> = new Map();
+  #settings: Common.Settings.Setting<SerializableSettings>;
 
   private constructor() {
     super();
     SDK.TargetManager.TargetManager.instance().observeModels(SDK.RuntimeModel.RuntimeModel, this);
     SDK.TargetManager.TargetManager.instance().addModelListener(
         SDK.DebuggerModel.DebuggerModel, SDK.DebuggerModel.Events.GlobalObjectCleared, this.onGlobalObjectClear, this);
-    this.paneInstance.addEventListener(LmiEvents.ViewClosed, this.viewClosed.bind(this));
+    this.#paneInstance.addEventListener(LmiEvents.ViewClosed, this.viewClosed.bind(this));
 
     SDK.TargetManager.TargetManager.instance().addModelListener(
         SDK.DebuggerModel.DebuggerModel, SDK.DebuggerModel.Events.DebuggerPaused, this.onDebuggerPause, this);
@@ -93,7 +93,7 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
       valueTypeModes: Array.from(defaultValueTypeModes),
       endianness: Endianness.Little,
     };
-    this.settings = Common.Settings.Settings.instance().createSetting('lmiInterpreterSettings', defaultSettings);
+    this.#settings = Common.Settings.Settings.instance().createSetting('lmiInterpreterSettings', defaultSettings);
   }
 
   static instance(): LinearMemoryInspectorController {
@@ -130,11 +130,11 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
   saveSettings(data: Settings): void {
     const valueTypes = Array.from(data.valueTypes);
     const modes = [...data.modes];
-    this.settings.set({valueTypes, valueTypeModes: modes, endianness: data.endianness});
+    this.#settings.set({valueTypes, valueTypeModes: modes, endianness: data.endianness});
   }
 
   loadSettings(): Settings {
-    const settings = this.settings.get();
+    const settings = this.#settings.get();
     return {
       valueTypes: new Set(settings.valueTypes),
       modes: new Map(settings.valueTypeModes),
@@ -166,34 +166,34 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
     const memoryProperty = internalProperties?.find(({name}) => name === '[[WebAssemblyMemory]]');
     const memory = memoryProperty?.value;
 
-    if (this.bufferIdToRemoteObject.has(id)) {
-      this.paneInstance.reveal(id, address);
+    if (this.#bufferIdToRemoteObject.has(id)) {
+      this.#paneInstance.reveal(id, address);
       UI.ViewManager.ViewManager.instance().showView('linear-memory-inspector');
       return;
     }
 
     const title = String(memory ? memory.description : buffer.object().description);
-    this.bufferIdToRemoteObject.set(id, buffer.object());
+    this.#bufferIdToRemoteObject.set(id, buffer.object());
     const arrayBufferWrapper = new RemoteArrayBufferWrapper(buffer);
 
-    this.paneInstance.create(id, title, arrayBufferWrapper, address);
+    this.#paneInstance.create(id, title, arrayBufferWrapper, address);
     UI.ViewManager.ViewManager.instance().showView('linear-memory-inspector');
   }
 
   modelRemoved(model: SDK.RuntimeModel.RuntimeModel): void {
-    for (const [bufferId, remoteObject] of this.bufferIdToRemoteObject) {
+    for (const [bufferId, remoteObject] of this.#bufferIdToRemoteObject) {
       if (model === remoteObject.runtimeModel()) {
-        this.bufferIdToRemoteObject.delete(bufferId);
-        this.paneInstance.close(bufferId);
+        this.#bufferIdToRemoteObject.delete(bufferId);
+        this.#paneInstance.close(bufferId);
       }
     }
   }
 
   private onDebuggerPause(event: Common.EventTarget.EventTargetEvent<SDK.DebuggerModel.DebuggerModel>): void {
     const debuggerModel = event.data;
-    for (const [bufferId, remoteObject] of this.bufferIdToRemoteObject) {
+    for (const [bufferId, remoteObject] of this.#bufferIdToRemoteObject) {
       if (debuggerModel.runtimeModel() === remoteObject.runtimeModel()) {
-        this.paneInstance.refreshView(bufferId);
+        this.#paneInstance.refreshView(bufferId);
       }
     }
   }
@@ -203,10 +203,10 @@ export class LinearMemoryInspectorController extends SDK.TargetManager.SDKModelO
   }
 
   private viewClosed({data: bufferId}: Common.EventTarget.EventTargetEvent<string>): void {
-    const remoteObj = this.bufferIdToRemoteObject.get(bufferId);
+    const remoteObj = this.#bufferIdToRemoteObject.get(bufferId);
     if (remoteObj) {
       remoteObj.release();
     }
-    this.bufferIdToRemoteObject.delete(bufferId);
+    this.#bufferIdToRemoteObject.delete(bufferId);
   }
 }

package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorPane.ts

@@ -50,21 +50,21 @@ export class Wrapper extends UI.Widget.VBox {
 
 export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.VBox>(
     UI.Widget.VBox) {
-  private readonly tabbedPane: UI.TabbedPane.TabbedPane;
-  private readonly tabIdToInspectorView: Map<string, LinearMemoryInspectorView>;
+  readonly #tabbedPane: UI.TabbedPane.TabbedPane;
+  readonly #tabIdToInspectorView: Map<string, LinearMemoryInspectorView>;
   constructor() {
     super(false);
     const placeholder = document.createElement('div');
     placeholder.textContent = i18nString(UIStrings.noOpenInspections);
     placeholder.style.display = 'flex';
-    this.tabbedPane = new UI.TabbedPane.TabbedPane();
-    this.tabbedPane.setPlaceholderElement(placeholder);
-    this.tabbedPane.setCloseableTabs(true);
-    this.tabbedPane.setAllowTabReorder(true, true);
-    this.tabbedPane.addEventListener(UI.TabbedPane.Events.TabClosed, this.tabClosed, this);
-    this.tabbedPane.show(this.contentElement);
+    this.#tabbedPane = new UI.TabbedPane.TabbedPane();
+    this.#tabbedPane.setPlaceholderElement(placeholder);
+    this.#tabbedPane.setCloseableTabs(true);
+    this.#tabbedPane.setAllowTabReorder(true, true);
+    this.#tabbedPane.addEventListener(UI.TabbedPane.Events.TabClosed, this.tabClosed, this);
+    this.#tabbedPane.show(this.contentElement);
 
-    this.tabIdToInspectorView = new Map();
+    this.#tabIdToInspectorView = new Map();
   }
 
   static instance(): LinearMemoryInspectorPaneImpl {
@@ -76,17 +76,17 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
 
   create(tabId: string, title: string, arrayWrapper: LazyUint8Array, address?: number): void {
     const inspectorView = new LinearMemoryInspectorView(arrayWrapper, address);
-    this.tabIdToInspectorView.set(tabId, inspectorView);
-    this.tabbedPane.appendTab(tabId, title, inspectorView, undefined, false, true);
-    this.tabbedPane.selectTab(tabId);
+    this.#tabIdToInspectorView.set(tabId, inspectorView);
+    this.#tabbedPane.appendTab(tabId, title, inspectorView, undefined, false, true);
+    this.#tabbedPane.selectTab(tabId);
   }
 
   close(tabId: string): void {
-    this.tabbedPane.closeTab(tabId, false);
+    this.#tabbedPane.closeTab(tabId, false);
   }
 
   reveal(tabId: string, address?: number): void {
-    const view = this.tabIdToInspectorView.get(tabId);
+    const view = this.#tabIdToInspectorView.get(tabId);
     if (!view) {
       throw new Error(`No linear memory inspector view for given tab id: ${tabId}`);
     }
@@ -95,11 +95,11 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
       view.updateAddress(address);
     }
     this.refreshView(tabId);
-    this.tabbedPane.selectTab(tabId);
+    this.#tabbedPane.selectTab(tabId);
   }
 
   refreshView(tabId: string): void {
-    const view = this.tabIdToInspectorView.get(tabId);
+    const view = this.#tabIdToInspectorView.get(tabId);
     if (!view) {
       throw new Error(`View for specified tab id does not exist: ${tabId}`);
     }
@@ -108,7 +108,7 @@ export class LinearMemoryInspectorPaneImpl extends Common.ObjectWrapper.eventMix
 
   private tabClosed(event: Common.EventTarget.EventTargetEvent<UI.TabbedPane.EventData>): void {
     const {tabId} = event.data;
-    this.tabIdToInspectorView.delete(tabId);
+    this.#tabIdToInspectorView.delete(tabId);
     this.dispatchEventToListeners(Events.ViewClosed, tabId);
   }
 }
@@ -122,9 +122,9 @@ export type EventTypes = {
 };
 
 class LinearMemoryInspectorView extends UI.Widget.VBox {
-  private memoryWrapper: LazyUint8Array;
-  private address: number;
-  private inspector: LinearMemoryInspector;
+  #memoryWrapper: LazyUint8Array;
+  #address: number;
+  #inspector: LinearMemoryInspector;
   firstTimeOpen: boolean;
   constructor(memoryWrapper: LazyUint8Array, address: number|undefined = 0) {
     super(false);
@@ -133,21 +133,21 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
       throw new Error('Requested address is out of bounds.');
     }
 
-    this.memoryWrapper = memoryWrapper;
-    this.address = address;
-    this.inspector = new LinearMemoryInspector();
-    this.inspector.addEventListener('memoryrequest', (event: MemoryRequestEvent) => {
+    this.#memoryWrapper = memoryWrapper;
+    this.#address = address;
+    this.#inspector = new LinearMemoryInspector();
+    this.#inspector.addEventListener('memoryrequest', (event: MemoryRequestEvent) => {
       this.memoryRequested(event);
     });
-    this.inspector.addEventListener('addresschanged', (event: AddressChangedEvent) => {
+    this.#inspector.addEventListener('addresschanged', (event: AddressChangedEvent) => {
       this.updateAddress(event.data);
     });
-    this.inspector.addEventListener('settingschanged', (event: SettingsChangedEvent) => {
+    this.#inspector.addEventListener('settingschanged', (event: SettingsChangedEvent) => {
       // Stop event from bubbling up, since no element further up needs the event.
       event.stopPropagation();
       this.saveSettings(event.data);
     });
-    this.contentElement.appendChild(this.inspector);
+    this.contentElement.appendChild(this.#inspector);
     this.firstTimeOpen = true;
   }
 
@@ -160,14 +160,14 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
   }
 
   updateAddress(address: number): void {
-    if (address < 0 || address >= this.memoryWrapper.length()) {
+    if (address < 0 || address >= this.#memoryWrapper.length()) {
       throw new Error('Requested address is out of bounds.');
     }
-    this.address = address;
+    this.#address = address;
   }
 
   refreshData(): void {
-    LinearMemoryInspectorController.getMemoryForAddress(this.memoryWrapper, this.address).then(({memory, offset}) => {
+    LinearMemoryInspectorController.getMemoryForAddress(this.#memoryWrapper, this.#address).then(({memory, offset}) => {
       let valueTypes;
       let valueTypeModes;
       let endianness;
@@ -178,11 +178,11 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
         endianness = settings.endianness;
         this.firstTimeOpen = false;
       }
-      this.inspector.data = {
+      this.#inspector.data = {
         memory,
-        address: this.address,
+        address: this.#address,
         memoryOffset: offset,
-        outerMemoryLength: this.memoryWrapper.length(),
+        outerMemoryLength: this.#memoryWrapper.length(),
         valueTypes,
         valueTypeModes,
         endianness,
@@ -196,12 +196,12 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
       throw new Error('Requested address is out of bounds.');
     }
 
-    LinearMemoryInspectorController.getMemoryRange(this.memoryWrapper, start, end).then(memory => {
-      this.inspector.data = {
+    LinearMemoryInspectorController.getMemoryRange(this.#memoryWrapper, start, end).then(memory => {
+      this.#inspector.data = {
         memory: memory,
         address: address,
         memoryOffset: start,
-        outerMemoryLength: this.memoryWrapper.length(),
+        outerMemoryLength: this.#memoryWrapper.length(),
       };
     });
   }

package/front_end/ui/components/linear_memory_inspector/LinearMemoryNavigator.ts

@@ -98,26 +98,26 @@ export const enum Mode {
 export class LinearMemoryNavigator extends HTMLElement {
   static readonly litTagName = LitHtml.literal`devtools-linear-memory-inspector-navigator`;
 
-  private readonly shadow = this.attachShadow({mode: 'open'});
-  private address = '0';
-  private error: string|undefined = undefined;
-  private valid = true;
-  private canGoBackInHistory = false;
-  private canGoForwardInHistory = false;
+  readonly #shadow = this.attachShadow({mode: 'open'});
+  #address = '0';
+  #error: string|undefined = undefined;
+  #valid = true;
+  #canGoBackInHistory = false;
+  #canGoForwardInHistory = false;
 
   connectedCallback(): void {
-    this.shadow.adoptedStyleSheets = [linearMemoryNavigatorStyles];
+    this.#shadow.adoptedStyleSheets = [linearMemoryNavigatorStyles];
   }
 
   set data(data: LinearMemoryNavigatorData) {
-    this.address = data.address;
-    this.error = data.error;
-    this.valid = data.valid;
-    this.canGoBackInHistory = data.canGoBackInHistory;
-    this.canGoForwardInHistory = data.canGoForwardInHistory;
+    this.#address = data.address;
+    this.#error = data.error;
+    this.#valid = data.valid;
+    this.#canGoBackInHistory = data.canGoBackInHistory;
+    this.#canGoForwardInHistory = data.canGoForwardInHistory;
     this.render();
 
-    const addressInput = this.shadow.querySelector<HTMLInputElement>('.address-input');
+    const addressInput = this.#shadow.querySelector<HTMLInputElement>('.address-input');
     if (addressInput) {
       if (data.mode === Mode.Submitted) {
         addressInput.blur();
@@ -134,9 +134,9 @@ export class LinearMemoryNavigator extends HTMLElement {
       <div class="navigator">
         <div class="navigator-item">
           ${this.createButton({icon: 'ic_undo_16x16_icon', title: i18nString(UIStrings.goBackInAddressHistory),
-              event: new HistoryNavigationEvent(Navigation.Backward), enabled: this.canGoBackInHistory})}
+              event: new HistoryNavigationEvent(Navigation.Backward), enabled: this.#canGoBackInHistory})}
           ${this.createButton({icon: 'ic_redo_16x16_icon', title: i18nString(UIStrings.goForwardInAddressHistory),
-              event: new HistoryNavigationEvent(Navigation.Forward), enabled: this.canGoForwardInHistory})}
+              event: new HistoryNavigationEvent(Navigation.Forward), enabled: this.#canGoForwardInHistory})}
         </div>
         <div class="navigator-item">
           ${this.createButton({icon: 'ic_page_prev_16x16_icon', title: i18nString(UIStrings.previousPage),
@@ -149,18 +149,18 @@ export class LinearMemoryNavigator extends HTMLElement {
             event: new RefreshRequestedEvent(), enabled: true})}
       </div>
       `;
-      render(result, this.shadow, {host: this});
+      render(result, this.#shadow, {host: this});
     // clang-format on
   }
 
   private createAddressInput(): LitHtml.TemplateResult {
     const classMap = {
       'address-input': true,
-      invalid: !this.valid,
+      invalid: !this.#valid,
     };
     return html`
-      <input class=${LitHtml.Directives.classMap(classMap)} data-input="true" .value=${this.address}
-        title=${this.valid ? i18nString(UIStrings.enterAddress) : this.error} @change=${
+      <input class=${LitHtml.Directives.classMap(classMap)} data-input="true" .value=${this.#address}
+        title=${this.#valid ? i18nString(UIStrings.enterAddress) : this.#error} @change=${
         this.onAddressChange.bind(this, Mode.Submitted)} @input=${this.onAddressChange.bind(this, Mode.Edit)}/>`;
   }
 

package/front_end/ui/components/linear_memory_inspector/LinearMemoryValueInterpreter.ts

@@ -16,7 +16,6 @@ import {Endianness} from './ValueInterpreterDisplayUtils.js';
 import type {TypeToggleEvent, ValueInterpreterSettingsData} from './ValueInterpreterSettings.js';
 
 import * as i18n from '../../../core/i18n/i18n.js';
-import inspectorCommonStyles from '../../legacy/inspectorCommon.css.js';
 
 const UIStrings = {
   /**
@@ -66,31 +65,24 @@ export interface LinearMemoryValueInterpreterData {
 export class LinearMemoryValueInterpreter extends HTMLElement {
   static readonly litTagName = LitHtml.literal`devtools-linear-memory-inspector-interpreter`;
 
-  private readonly shadow = this.attachShadow({mode: 'open'});
-  private endianness = Endianness.Little;
-  private buffer = new ArrayBuffer(0);
-  private valueTypes: Set<ValueType> = new Set();
-  private valueTypeModeConfig: Map<ValueType, ValueTypeMode> = new Map();
-  private memoryLength = 0;
-  private showSettings = false;
-
-  constructor() {
-    super();
-    this.shadow.adoptedStyleSheets = [
-      inspectorCommonStyles,
-    ];
-  }
+  readonly #shadow = this.attachShadow({mode: 'open'});
+  #endianness = Endianness.Little;
+  #buffer = new ArrayBuffer(0);
+  #valueTypes: Set<ValueType> = new Set();
+  #valueTypeModeConfig: Map<ValueType, ValueTypeMode> = new Map();
+  #memoryLength = 0;
+  #showSettings = false;
 
   connectedCallback(): void {
-    this.shadow.adoptedStyleSheets = [linearMemoryValueInterpreterStyles];
+    this.#shadow.adoptedStyleSheets = [linearMemoryValueInterpreterStyles];
   }
 
   set data(data: LinearMemoryValueInterpreterData) {
-    this.endianness = data.endianness;
-    this.buffer = data.value;
-    this.valueTypes = data.valueTypes;
-    this.valueTypeModeConfig = data.valueTypeModes || new Map();
-    this.memoryLength = data.memoryLength;
+    this.#endianness = data.endianness;
+    this.#buffer = data.value;
+    this.#valueTypes = data.valueTypes;
+    this.#valueTypeModeConfig = data.valueTypeModes || new Map();
+    this.#memoryLength = data.memoryLength;
     this.render();
   }
 
@@ -101,7 +93,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
       <div class="value-interpreter">
         <div class="settings-toolbar">
           ${this.renderEndiannessSetting()}
-          <button data-settings="true" class="settings-toolbar-button ${this.showSettings ? 'active' : ''}" title=${i18nString(UIStrings.toggleValueTypeSettings)} @click=${this.onSettingsToggle}>
+          <button data-settings="true" class="settings-toolbar-button ${this.#showSettings ? 'active' : ''}" title=${i18nString(UIStrings.toggleValueTypeSettings)} @click=${this.onSettingsToggle}>
             <${IconButton.Icon.Icon.litTagName}
               .data=${{ iconName: 'settings_14x14_icon', color: 'var(--color-text-secondary)', width: '14px' } as IconButton.Icon.IconWithName}>
             </${IconButton.Icon.Icon.litTagName}>
@@ -109,26 +101,26 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
         </div>
         <span class="divider"></span>
         <div>
-          ${this.showSettings ?
+          ${this.#showSettings ?
             html`
               <${ValueInterpreterSettings.litTagName}
-                .data=${{ valueTypes: this.valueTypes } as ValueInterpreterSettingsData}
+                .data=${{ valueTypes: this.#valueTypes } as ValueInterpreterSettingsData}
                 @typetoggle=${this.onTypeToggle}>
               </${ValueInterpreterSettings.litTagName}>` :
             html`
               <${ValueInterpreterDisplay.litTagName}
                 .data=${{
-                  buffer: this.buffer,
-                  valueTypes: this.valueTypes,
-                  endianness: this.endianness,
-                  valueTypeModes: this.valueTypeModeConfig,
-                  memoryLength: this.memoryLength,
+                  buffer: this.#buffer,
+                  valueTypes: this.#valueTypes,
+                  endianness: this.#endianness,
+                  valueTypeModes: this.#valueTypeModeConfig,
+                  memoryLength: this.#memoryLength,
                 } as ValueDisplayData}>
               </${ValueInterpreterDisplay.litTagName}>`}
         </div>
       </div>
     `,
-      this.shadow, { host: this },
+      this.#shadow, { host: this },
     );
     // clang-format on
   }
@@ -150,7 +142,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
         style="border: none; background-color: transparent; cursor: pointer;"
         data-endianness="true" @change=${onEnumSettingChange}>
         ${[Endianness.Little, Endianness.Big].map(endianness => {
-            return html`<option value=${endianness} .selected=${this.endianness === endianness}>${
+            return html`<option value=${endianness} .selected=${this.#endianness === endianness}>${
                 i18n.i18n.lockedString(endianness)}</option>`;
         })}
       </select>
@@ -160,7 +152,7 @@ export class LinearMemoryValueInterpreter extends HTMLElement {
   }
 
   private onSettingsToggle(): void {
-    this.showSettings = !this.showSettings;
+    this.#showSettings = !this.#showSettings;
     this.render();
   }