chrome-devtools-frontend 1.0.981004 → 1.0.981537

package/front_end/core/i18n/locales/en-US.json

@@ -10991,6 +10991,9 @@
   "panels/timeline/TimelineUIUtils.ts | pinchUpdate": {
     "message": "Pinch Update"
   },
+  "panels/timeline/TimelineUIUtils.ts | prePaint": {
+    "message": "Pre-Paint"
+  },
   "panels/timeline/TimelineUIUtils.ts | preview": {
     "message": "Preview"
   },

package/front_end/core/i18n/locales/en-XL.json

@@ -10991,6 +10991,9 @@
   "panels/timeline/TimelineUIUtils.ts | pinchUpdate": {
     "message": "P̂ín̂ćĥ Úp̂d́ât́ê"
   },
+  "panels/timeline/TimelineUIUtils.ts | prePaint": {
+    "message": "P̂ŕê-Ṕâín̂t́"
+  },
   "panels/timeline/TimelineUIUtils.ts | preview": {
     "message": "P̂ŕêv́îéŵ"
   },

package/front_end/generated/InspectorBackendCommands.js

@@ -289,6 +289,8 @@ export function registerCommands(inspectorBackend) {
     ClientMetadataHttpNotFound: 'ClientMetadataHttpNotFound',
     ClientMetadataNoResponse: 'ClientMetadataNoResponse',
     ClientMetadataInvalidResponse: 'ClientMetadataInvalidResponse',
+    ClientMetadataMissingPrivacyPolicyUrl: 'ClientMetadataMissingPrivacyPolicyUrl',
+    DisabledInSettings: 'DisabledInSettings',
     ErrorFetchingSignin: 'ErrorFetchingSignin',
     InvalidSigninResponse: 'InvalidSigninResponse',
     AccountsHttpNotFound: 'AccountsHttpNotFound',
@@ -511,8 +513,10 @@ export function registerCommands(inspectorBackend) {
       'CSS.getInlineStylesForNode', [{'name': 'nodeId', 'type': 'number', 'optional': false}],
       ['inlineStyle', 'attributesStyle']);
   inspectorBackend.registerCommand(
-      'CSS.getMatchedStylesForNode', [{'name': 'nodeId', 'type': 'number', 'optional': false}],
-      ['inlineStyle', 'attributesStyle', 'matchedCSSRules', 'pseudoElements', 'inherited', 'cssKeyframesRules']);
+      'CSS.getMatchedStylesForNode', [{'name': 'nodeId', 'type': 'number', 'optional': false}], [
+        'inlineStyle', 'attributesStyle', 'matchedCSSRules', 'pseudoElements', 'inherited', 'inheritedPseudoElements',
+        'cssKeyframesRules'
+      ]);
   inspectorBackend.registerCommand('CSS.getMediaQueries', [], ['medias']);
   inspectorBackend.registerCommand(
       'CSS.getPlatformFontsForNode', [{'name': 'nodeId', 'type': 'number', 'optional': false}], ['fonts']);

package/front_end/generated/protocol.ts

@@ -1069,6 +1069,8 @@ export namespace Audits {
     ClientMetadataHttpNotFound = 'ClientMetadataHttpNotFound',
     ClientMetadataNoResponse = 'ClientMetadataNoResponse',
     ClientMetadataInvalidResponse = 'ClientMetadataInvalidResponse',
+    ClientMetadataMissingPrivacyPolicyUrl = 'ClientMetadataMissingPrivacyPolicyUrl',
+    DisabledInSettings = 'DisabledInSettings',
     ErrorFetchingSignin = 'ErrorFetchingSignin',
     InvalidSigninResponse = 'InvalidSigninResponse',
     AccountsHttpNotFound = 'AccountsHttpNotFound',
@@ -1763,6 +1765,16 @@ export namespace CSS {
     matchedCSSRules: RuleMatch[];
   }
 
+  /**
+   * Inherited pseudo element matches from pseudos of an ancestor node.
+   */
+  export interface InheritedPseudoElementMatches {
+    /**
+     * Matches of pseudo styles from the pseudos of an ancestor node.
+     */
+    pseudoElements: PseudoElementMatches[];
+  }
+
   /**
    * Match data for a CSS rule.
    */
@@ -2504,6 +2516,10 @@ export namespace CSS {
      * A chain of inherited styles (from the immediate node parent up to the DOM tree root).
      */
     inherited?: InheritedStyleEntry[];
+    /**
+     * A chain of inherited pseudo element styles (from the immediate node parent up to the DOM tree root).
+     */
+    inheritedPseudoElements?: InheritedPseudoElementMatches[];
     /**
      * A list of CSS keyframed animations matching this node.
      */

package/front_end/models/timeline_model/TimelineModel.ts

@@ -1462,6 +1462,7 @@ export enum RecordType {
   PaintSetup = 'PaintSetup',
   Paint = 'Paint',
   PaintImage = 'PaintImage',
+  PrePaint = 'PrePaint',
   Rasterize = 'Rasterize',
   RasterTask = 'RasterTask',
   ScrollLayer = 'ScrollLayer',

package/front_end/panels/console/ConsoleFormat.ts

@@ -196,3 +196,26 @@ export const format = (fmt: string, args: SDK.RemoteObject.RemoteObject[]): {
   addStringToken(fmt);
   return {tokens, args: args.slice(argIndex)};
 };
+
+export const updateStyle = (currentStyle: Map<string, {value: string, priority: string}>, styleToAdd: string): void => {
+  const ALLOWED_PROPERTY_PREFIXES = ['background', 'border', 'color', 'font', 'line', 'margin', 'padding', 'text'];
+  const BLOCKED_URL_SCHEMES = ['chrome', 'resource', 'about', 'app', 'http', 'https', 'ftp', 'file'];
+
+  currentStyle.clear();
+  const buffer = document.createElement('span');
+  buffer.setAttribute('style', styleToAdd);
+  for (const property of buffer.style) {
+    if (!ALLOWED_PROPERTY_PREFIXES.some(
+            prefix => property.startsWith(prefix) || property.startsWith(`-webkit-${prefix}`))) {
+      continue;
+    }
+    const value = buffer.style.getPropertyValue(property);
+    if (BLOCKED_URL_SCHEMES.some(scheme => value.includes(scheme + ':'))) {
+      continue;
+    }
+    currentStyle.set(property, {
+      value,
+      priority: buffer.style.getPropertyPriority(property),
+    });
+  }
+};

package/front_end/panels/console/ConsoleViewMessage.ts

@@ -53,7 +53,7 @@ import * as UI from '../../ui/legacy/legacy.js';
 import objectValueStyles from '../../ui/legacy/components/object_ui/objectValue.css.js';
 import type {Chrome} from '../../../extension-api/ExtensionAPI.js'; // eslint-disable-line rulesdir/es_modules_import
 
-import {format} from './ConsoleFormat.js';
+import {format, updateStyle} from './ConsoleFormat.js';
 import type {ConsoleViewportElement} from './ConsoleViewport.js';
 import consoleViewStyles from './consoleView.css.js';
 import {augmentErrorStackWithScriptIds, parseSourcePositionsFromErrorStack} from './ErrorStackParser.js';
@@ -925,26 +925,10 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
           }
           break;
         }
-        case 'style': {
+        case 'style':
           // Make sure that allowed properties do not interfere with link visibility.
-          const ALLOWED_PROPERTY_PREFIXES =
-              ['background', 'border', 'color', 'font', 'line', 'margin', 'padding', 'text'];
-
-          currentStyle.clear();
-          const buffer = document.createElement('span');
-          buffer.setAttribute('style', token.value);
-          for (const property of buffer.style) {
-            if (!ALLOWED_PROPERTY_PREFIXES.some(
-                    prefix => property.startsWith(prefix) || property.startsWith(`-webkit-${prefix}`))) {
-              continue;
-            }
-            currentStyle.set(property, {
-              value: buffer.style.getPropertyValue(property),
-              priority: buffer.style.getPropertyPriority(property),
-            });
-          }
+          updateStyle(currentStyle, token.value);
           break;
-        }
       }
     }
     return args;

package/front_end/panels/emulation/AdvancedApp.ts

@@ -2,9 +2,10 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as Common from '../../core/common/common.js';
+import type * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as UI from '../../ui/legacy/legacy.js';
+import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
 
 import {DeviceModeWrapper} from './DeviceModeWrapper.js';
 import type {Bounds} from './InspectedPagePlaceholder.js';
@@ -77,7 +78,10 @@ export class AdvancedApp implements Common.App.App {
   }
 
   deviceModeEmulationFrameLoaded(toolboxDocument: Document): void {
-    Common.Settings.Settings.instance().createSetting('uiTheme', 'default');
+    ThemeSupport.ThemeSupport.instance().applyTheme(toolboxDocument);
+    ThemeSupport.ThemeSupport.instance().addEventListener(ThemeSupport.ThemeChangeEvent.eventName, () => {
+      ThemeSupport.ThemeSupport.instance().applyTheme(toolboxDocument);
+    });
     UI.UIUtils.initializeUIUtils(toolboxDocument);
     UI.UIUtils.installComponentRootStyles((toolboxDocument.body as Element));
     UI.ContextMenu.ContextMenu.installHandler(toolboxDocument);

package/front_end/panels/timeline/TimelineUIUtils.ts

@@ -132,6 +132,12 @@ const UIStrings = {
   */
   paintImage: 'Paint Image',
   /**
+  *@description Noun for an event in the Performance panel. Pre-paint is a
+  *step before the 'Paint' event. A paint event is when the browser records the
+  *instructions for drawing the page. This step is the setup beforehand.
+  */
+  prePaint: 'Pre-Paint',
+  /**
   *@description Text in Timeline UIUtils of the Performance panel
   */
   updateLayer: 'Update Layer',
@@ -1283,6 +1289,7 @@ export class TimelineUIUtils {
     eventStyles[type.UpdateLayer] = new TimelineRecordStyle(i18nString(UIStrings.updateLayer), painting, true);
     eventStyles[type.UpdateLayerTree] = new TimelineRecordStyle(i18nString(UIStrings.updateLayerTree), rendering);
     eventStyles[type.Paint] = new TimelineRecordStyle(i18nString(UIStrings.paint), painting);
+    eventStyles[type.PrePaint] = new TimelineRecordStyle(i18nString(UIStrings.prePaint), rendering);
     eventStyles[type.RasterTask] = new TimelineRecordStyle(i18nString(UIStrings.rasterizePaint), painting);
     eventStyles[type.ScrollLayer] = new TimelineRecordStyle(i18nString(UIStrings.scroll), rendering);
     eventStyles[type.CompositeLayers] = new TimelineRecordStyle(i18nString(UIStrings.compositeLayers), painting);