chrome-devtools-frontend 1.0.933786 → 1.0.934857

package/front_end/panels/sources/CallStackSidebarPane.ts

@@ -82,6 +82,10 @@ const UIStrings = {
   *@description A context menu item in the Call Stack Sidebar Pane of the Sources panel
   */
   addAllContentScriptsToIgnoreList: 'Add all content scripts to ignore list',
+  /**
+  *@description Text in Call Stack Sidebar Pane of the Sources panel when some call frames have warnings
+  */
+  callFrameWarnings: 'Some call frames have warnings',
 };
 const str_ = i18n.i18n.registerUIStrings('panels/sources/CallStackSidebarPane.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -92,6 +96,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
                                                                         UI.ListControl.ListDelegate<Item> {
   private readonly ignoreListMessageElement: Element;
   private readonly notPausedMessageElement: HTMLElement;
+  private readonly callFrameWarningsElement: HTMLElement;
   private readonly items: UI.ListModel.ListModel<Item>;
   private list: UI.ListControl.ListControl<Item>;
   private readonly showMoreMessageElement: Element;
@@ -113,6 +118,12 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     this.notPausedMessageElement.textContent = i18nString(UIStrings.notPaused);
     this.notPausedMessageElement.tabIndex = -1;
 
+    this.callFrameWarningsElement = this.contentElement.createChild('div', 'ignore-listed-message');
+    const icon = UI.Icon.Icon.create('smallicon-warning', 'call-frame-warning-icon');
+    this.callFrameWarningsElement.appendChild(icon);
+    this.callFrameWarningsElement.appendChild(document.createTextNode(i18nString(UIStrings.callFrameWarnings)));
+    this.callFrameWarningsElement.tabIndex = -1;
+
     this.items = new UI.ListModel.ListModel();
     this.list = new UI.ListControl.ListControl(this.items, this, UI.ListControl.ListMode.NonViewport);
     this.contentElement.appendChild(this.list.element);
@@ -164,6 +175,8 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
   private async doUpdate(): Promise<void> {
     this.locationPool.disposeAll();
 
+    this.callFrameWarningsElement.classList.add('hidden');
+
     const details = UI.Context.Context.instance().flavor(SDK.DebuggerModel.DebuggerPausedDetails);
     if (!details) {
       this.notPausedMessageElement.classList.remove('hidden');
@@ -178,6 +191,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     this.notPausedMessageElement.classList.add('hidden');
 
     const itemPromises = [];
+    const uniqueWarnings: Set<string> = new Set();
     for (const frame of details.callFrames) {
       const itemPromise =
           Item.createForDebuggerCallFrame(frame, this.locationPool, this.refreshItem.bind(this)).then(item => {
@@ -185,8 +199,15 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
             return item;
           });
       itemPromises.push(itemPromise);
+      for (const warning of frame.warnings) {
+        uniqueWarnings.add(warning);
+      }
     }
     const items = await Promise.all(itemPromises);
+    if (uniqueWarnings.size) {
+      this.callFrameWarningsElement.classList.remove('hidden');
+      UI.Tooltip.Tooltip.install(this.callFrameWarningsElement, Array.from(uniqueWarnings).join('\n'));
+    }
 
     let asyncStackTrace: Protocol.Runtime.StackTrace|null|undefined = details.asyncStackTrace;
     if (!asyncStackTrace && details.asyncStackTraceId) {

package/front_end/panels/sources/module.json

@@ -3,8 +3,6 @@
     "ui/legacy",
     "panels/search",
     "ui/legacy/components/source_frame",
-    "panels/snippets",
-    "ui/legacy/components/quick_open",
     "ui/legacy/components/inline_editor",
     "ui/legacy/components/color_picker",
     "panels/event_listeners",

package/front_end/panels/sources/sources-meta.ts

@@ -1249,6 +1249,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.searchInAnonymousAndContent),
   settingName: 'searchInAnonymousAndContentScripts',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1267,6 +1268,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.automaticallyRevealFilesIn),
   settingName: 'autoRevealInNavigator',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1285,6 +1287,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.enableJavascriptSourceMaps),
   settingName: 'jsSourceMapsEnabled',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1303,6 +1306,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.enableTabMovesFocus),
   settingName: 'textEditorTabMovesFocus',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1321,6 +1325,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.detectIndentation),
   settingName: 'textEditorAutoDetectIndent',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1339,6 +1344,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.autocompletion),
   settingName: 'textEditorAutocompletion',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1375,6 +1381,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.codeFolding),
   settingName: 'textEditorCodeFolding',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1393,6 +1400,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.showWhitespaceCharacters),
   settingName: 'showWhitespacesInEditor',
   settingType: Common.Settings.SettingType.ENUM,
@@ -1418,6 +1426,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.displayVariableValuesInlineWhile),
   settingName: 'inlineVariableValues',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1436,6 +1445,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.enableAutoFocusOnDebuggerPaused),
   settingName: 'autoFocusOnDebuggerPausedEnabled',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1454,6 +1464,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.enableCssSourceMaps),
   settingName: 'cssSourceMapsEnabled',
   settingType: Common.Settings.SettingType.BOOLEAN,
@@ -1472,6 +1483,7 @@ Common.Settings.registerSettingExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.allowScrollingPastEndOfFile),
   settingName: 'allowScrollPastEof',
   settingType: Common.Settings.SettingType.BOOLEAN,

package/front_end/panels/timeline/timeline-meta.ts

@@ -390,6 +390,7 @@ UI.ActionRegistration.registerActionExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.PERFORMANCE,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.hideChromeFrameInLayersView),
   settingName: 'frameViewerHideChromeWindow',
   settingType: Common.Settings.SettingType.BOOLEAN,

package/front_end/ui/components/text_editor/config.ts

@@ -57,7 +57,7 @@ export const tabMovesFocus = DynamicSetting.bool('textEditorTabMovesFocus', CM.k
   shift: (view: CM.EditorView): boolean => view.state.doc.length ? CM.indentLess(view) : false,
 }]));
 
-export const autocompletion = DynamicSetting.bool('textEditorAutocompletion', CM.autocompletion());
+export const autocompletion = DynamicSetting.bool('textEditorAutocompletion', CM.autocompletion({icons: false}));
 
 export const bracketMatching = DynamicSetting.bool('textEditorBracketMatching', CM.bracketMatching());
 

package/front_end/ui/components/text_editor/theme.ts

@@ -112,6 +112,14 @@ export const editorTheme = CM.EditorView.theme({
     width: 'fit-content',
   },
 
+  '.cm-tooltip.cm-tooltip-autocomplete > ul': {
+    minWidth: '16em',
+    '& > li[aria-selected]': {
+      backgroundColor: 'var(--color-selected-option-background)',
+      color: 'var(--color-selected-option)',
+    },
+  },
+
   '.cm-highlightedLine': {
     animation: 'cm-fading-highlight 2s 0s',
   },

package/front_end/ui/legacy/GlassPane.ts

@@ -58,6 +58,10 @@ export class GlassPane {
     this.widgetInternal.registerRequiredCSS(cssFile);
   }
 
+  registerCSSFiles(cssFiles: CSSStyleSheet[]): void {
+    this.widgetInternal.registerCSSFiles(cssFiles);
+  }
+
   setDefaultFocusedElement(element: Element|null): void {
     this.widgetInternal.setDefaultFocusedElement(element);
   }

package/front_end/ui/legacy/InspectorView.ts

@@ -443,10 +443,6 @@ function getDisableLocaleInfoBarSetting(): Common.Settings.Setting<boolean> {
 }
 
 function shouldShowLocaleInfobar(): boolean {
-  if (!Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.LOCALIZED_DEVTOOLS)) {
-    return false;
-  }
-
   if (getDisableLocaleInfoBarSetting().get()) {
     return false;
   }

package/front_end/ui/legacy/ViewManager.ts

@@ -28,6 +28,11 @@ const UIStrings = {
 };
 const str_ = i18n.i18n.registerUIStrings('ui/legacy/ViewManager.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
+export const defaultOptionsForTabs = {
+  security: true,
+};
+
 export class PreRegisteredView implements View {
   private readonly viewRegistration: ViewRegistration;
   private widgetRequested: boolean;
@@ -615,9 +620,12 @@ export class _TabbedLocation extends Location implements TabbedViewLocation {
   private setOrUpdateCloseableTabsSetting(): void {
     // Update the setting value, we respect the closed state decided by the user
     // and append the new tabs with value of true so they are shown open
-    const defaultOptionsForTabs = {'security': true};
     const tabs = this.closeableTabSetting.get();
-    const newClosable = Object.assign(defaultOptionsForTabs, tabs);
+    const newClosable = Object.assign(
+        {
+          ...defaultOptionsForTabs,
+        },
+        tabs);
     this.closeableTabSetting.set(newClosable);
   }
 

package/front_end/ui/legacy/components/object_ui/CustomPreviewComponent.ts

@@ -9,6 +9,7 @@ import * as UI from '../../legacy.js';
 import type * as Protocol from '../../../../generated/protocol.js';
 
 import {ObjectPropertiesSection} from './ObjectPropertiesSection.js';
+import customPreviewComponentStyles from './customPreviewComponent.css.js';
 
 const UIStrings = {
   /**
@@ -188,7 +189,7 @@ export class CustomPreviewComponent {
     this.element = document.createElement('span');
     this.element.classList.add('source-code');
     const shadowRoot = UI.Utils.createShadowRootWithCoreStyles(this.element, {
-      cssFile: 'ui/legacy/components/object_ui/customPreviewComponent.css',
+      cssFile: [customPreviewComponentStyles],
       delegatesFocus: undefined,
     });
     this.element.addEventListener('contextmenu', this.contextMenuEventFired.bind(this), false);

package/front_end/ui/legacy/components/object_ui/ObjectPopoverHelper.ts

@@ -34,7 +34,9 @@ import * as UI from '../../legacy.js';
 import * as Components from '../utils/utils.js';
 
 import {CustomPreviewComponent} from './CustomPreviewComponent.js';
+import objectPopoverStyles from './objectPopover.css.js';
 import {ObjectPropertiesSection} from './ObjectPropertiesSection.js';
+import objectValueStyles from './objectValue.css.js';
 
 export class ObjectPopoverHelper {
   private readonly linkifier: Components.Linkifier.Linkifier|null;
@@ -72,7 +74,7 @@ export class ObjectPopoverHelper {
       } else {
         popoverContentElement = document.createElement('div');
         popoverContentElement.classList.add('object-popover-content');
-        UI.Utils.appendStyle(popoverContentElement, 'ui/legacy/components/object_ui/objectPopover.css');
+        popover.registerCSSFiles([objectPopoverStyles]);
         const titleElement = popoverContentElement.createChild('div', 'monospace object-popover-title');
         titleElement.createChild('span').textContent = description;
         linkifier = new Components.Linkifier.Linkifier();
@@ -90,8 +92,7 @@ export class ObjectPopoverHelper {
 
     popoverContentElement = document.createElement('span');
     popoverContentElement.dataset.stableNameForTest = 'object-popover-content';
-    UI.Utils.appendStyle(popoverContentElement, 'ui/legacy/components/object_ui/objectValue.css');
-    UI.Utils.appendStyle(popoverContentElement, 'ui/legacy/components/object_ui/objectPopover.css');
+    popover.registerCSSFiles([objectValueStyles, objectPopoverStyles]);
     const valueElement = popoverContentElement.createChild('span', 'monospace object-value-' + result.type);
     valueElement.style.whiteSpace = 'pre';
 

package/front_end/ui/legacy/components/object_ui/ObjectPropertiesSection.ts

@@ -43,6 +43,8 @@ import {CustomPreviewComponent} from './CustomPreviewComponent.js';
 import {JavaScriptAutocomplete} from './JavaScriptAutocomplete.js';
 import {JavaScriptREPL} from './JavaScriptREPL.js';
 import {createSpansForNodeTitle, RemoteObjectPreviewFormatter} from './RemoteObjectPreviewFormatter.js';
+import objectValueStyles from './objectValue.css.js';
+import objectPropertiesSectionStyles from './objectPropertiesSection.css.js';
 
 const UIStrings = {
   /**
@@ -161,8 +163,7 @@ export class ObjectPropertiesSection extends UI.TreeOutline.TreeOutlineInShadow
     }
 
     objectPropertiesSectionMap.set(this.element, this);
-    this.registerRequiredCSS('ui/legacy/components/object_ui/objectValue.css');
-    this.registerRequiredCSS('ui/legacy/components/object_ui/objectPropertiesSection.css');
+    this.registerCSSFiles([objectValueStyles, objectPropertiesSectionStyles]);
     this.rootElement().childrenListElement.classList.add('source-code', 'object-properties-section');
   }
 
@@ -183,7 +184,7 @@ export class ObjectPropertiesSection extends UI.TreeOutline.TreeOutlineInShadow
     const titleElement = document.createElement('span');
     titleElement.classList.add('source-code');
     const shadowRoot = UI.Utils.createShadowRootWithCoreStyles(titleElement, {
-      cssFile: 'ui/legacy/components/object_ui/objectValue.css',
+      cssFile: [objectValueStyles],
       delegatesFocus: undefined,
     });
     const propertyValue =
@@ -578,8 +579,7 @@ export class ObjectPropertiesSectionsTreeOutline extends UI.TreeOutline.TreeOutl
   private readonly editable: boolean;
   constructor(options?: TreeOutlineOptions|null) {
     super();
-    this.registerRequiredCSS('ui/legacy/components/object_ui/objectValue.css');
-    this.registerRequiredCSS('ui/legacy/components/object_ui/objectPropertiesSection.css');
+    this.registerCSSFiles([objectValueStyles, objectPropertiesSectionStyles]);
     this.editable = !(options && options.readOnly);
     this.contentElement.classList.add('source-code');
     this.contentElement.classList.add('object-properties-section');

package/front_end/ui/legacy/components/object_ui/module.json

@@ -1,11 +1,5 @@
 {
   "dependencies": [
     "ui/legacy"
-  ],
-    "resources": [
-    "customPreviewComponent.css",
-    "objectPopover.css",
-    "objectPropertiesSection.css",
-    "objectValue.css"
   ]
 }

package/front_end/ui/legacy/components/perf_ui/perf_ui-meta.ts

@@ -71,6 +71,7 @@ UI.ActionRegistration.registerActionExtension({
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.PERFORMANCE,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.flamechartMouseWheelAction),
   settingName: 'flamechartMouseWheelAction',
   settingType: Common.Settings.SettingType.ENUM,

package/front_end/ui/legacy/components/quick_open/FilteredListWidget.ts

@@ -13,6 +13,8 @@ import * as Diff from '../../../../third_party/diff/diff.js';
 import * as TextPrompt from '../../../../ui/components/text_prompt/text_prompt.js';
 import * as UI from '../../legacy.js';
 
+import filteredListWidgetStyles from './filteredListWidget.css.js';
+
 const UIStrings = {
   /**
   * @description Aria label for quick open dialog prompt
@@ -64,7 +66,6 @@ export class FilteredListWidget extends Common.ObjectWrapper.eventMixin<EventTyp
     const listener = (this.onKeyDown.bind(this) as (arg0: Event) => void);
     this.contentElement.addEventListener('keydown', listener, true);
     UI.ARIAUtils.markAsCombobox(this.contentElement);
-    this.registerRequiredCSS('ui/legacy/components/quick_open/filteredListWidget.css');
 
     this.inputBoxElement = new TextPrompt.TextPrompt.TextPrompt();
     this.inputBoxElement.data = {ariaLabel: i18nString(UIStrings.quickOpenPrompt), prefix: '', suggestion: ''};
@@ -212,6 +213,7 @@ export class FilteredListWidget extends Common.ObjectWrapper.eventMixin<EventTyp
   }
 
   wasShown(): void {
+    this.registerCSSFiles([filteredListWidgetStyles]);
     this.attachProvider();
   }
 

package/front_end/ui/legacy/components/quick_open/quick_open-meta.ts

@@ -3,7 +3,6 @@
 // found in the LICENSE file.
 
 import * as i18n from '../../../../core/i18n/i18n.js';
-import * as Root from '../../../../core/root/root.js';
 import * as UI from '../../legacy.js';
 
 const UIStrings = {
@@ -26,8 +25,6 @@ let loadedQuickOpenModule: (typeof QuickOpen|undefined);
 
 async function loadQuickOpenModule(): Promise<typeof QuickOpen> {
   if (!loadedQuickOpenModule) {
-    // Side-effect import resources in module.json
-    await Root.Runtime.Runtime.instance().loadModulePromise('ui/legacy/components/quick_open');
     loadedQuickOpenModule = await import('./quick_open.js');
   }
   return loadedQuickOpenModule;

package/front_end/ui/legacy/components/source_frame/source_frame-meta.ts

@@ -48,6 +48,7 @@ const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined
 
 Common.Settings.registerSettingExtension({
   category: Common.Settings.SettingCategory.SOURCES,
+  storageType: Common.Settings.SettingStorageType.Synced,
   title: i18nLazyString(UIStrings.defaultIndentation),
   settingName: 'textEditorIndent',
   settingType: Common.Settings.SettingType.ENUM,

package/front_end/ui/legacy/themeColors.css

@@ -163,6 +163,8 @@
   --color-nonmatching-bracket-background: rgb(255 0 0 / 7%);
   --color-editor-selection: #cfe8fc;
   --color-editor-selection-blurred: #e0e0e0;
+  --color-selected-option: #fff;
+  --color-selected-option-background: #1a73e8;
   --color-highlighted-line: rgb(255 255 0 / 50%);
 }
 
@@ -282,5 +284,7 @@
   --color-nonmatching-bracket-background: initial;
   --color-editor-selection: hsl(207deg 88% 22%);
   --color-editor-selection-blurred: #454545;
+  --color-selected-option: #fff;
+  --color-selected-option-background: #0e639c;
   --color-highlighted-line: hsl(133deg 100% 30% / 50%);
 }

package/front_end/ui/legacy/toolbar.css

@@ -7,8 +7,6 @@
 :host {
   flex: none;
   padding: 0 2px;
-
-  --override-toolbar-warning-red: rgb(238 68 47 / 7%);
 }
 
 .toolbar-shadow {
@@ -406,8 +404,24 @@ input[is=history-input]:not(:placeholder-shown) {
   box-shadow: var(--legacy-focus-ring-active-shadow);
 }
 
-.toolbar-item.warning {
-  background: var(--override-toolbar-warning-red);
+.toolbar-item.highlight::before {
+  content: "";
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  right: 2px;
+  bottom: 2px;
+  border-radius: 2px;
+  background: var(--color-primary);
+  z-index: -1;
+}
+
+.toolbar-item.highlight {
+  color: var(--color-button-primary-text);
+}
+
+.toolbar-item.highlight > .icon-mask {
+  background: var(--color-button-primary-text);
 }
 
 devtools-icon.leading-issue-icon {

package/package.json

@@ -55,5 +55,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.933786"
+  "version": "1.0.934857"
 }

package/front_end/panels/changes/module.json

@@ -1,7 +0,0 @@
-{
-  "dependencies": [
-    "ui/legacy/components/text_editor",
-    "panels/snippets",
-    "ui/legacy"
-  ]
-}

package/front_end/panels/snippets/module.json

@@ -1,6 +0,0 @@
-{
-  "dependencies": [
-    "ui/legacy/components/quick_open",
-    "ui/legacy"
-  ]
-}

package/front_end/ui/legacy/components/quick_open/module.json

@@ -1,8 +0,0 @@
-{
-  "dependencies": [
-    "ui/legacy"
-  ],
-    "resources": [
-    "filteredListWidget.css"
-  ]
-}