chrome-devtools-frontend 1.0.1622369 → 1.0.1624409

package/front_end/Images/src/expand.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M192-96v-72h576v72H192Zm288-144L336-384l51-51 57 57v-204l-57 57-51-51 144-144 144 144-51 51-57-57v204l57-57 51 51-144 144ZM192-792v-72h576v72H192Z"/></svg>

package/front_end/entrypoints/greendev_floaty/FloatyEntrypoint.ts

@@ -7,8 +7,11 @@ import '../../core/sdk/sdk-meta.js';
 import '../../models/workspace/workspace-meta.js';
 import '../../models/logs/logs-meta.js';
 import '../../panels/sensors/sensors-meta.js';
+import '../../panels/sources/sources-meta.js';
 import '../../entrypoints/inspector_main/inspector_main-meta.js';
 import '../../entrypoints/main/main-meta.js';
+import '../../ui/legacy/components/source_frame/source_frame-meta.js';
+import '../../ui/components/markdown_view/markdown_view.js';
 
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
@@ -22,6 +25,8 @@ import type * as Protocol from '../../generated/protocol.js';
 import * as AiAssistance from '../../models/ai_assistance/ai_assistance.js';
 import * as Greendev from '../../models/greendev/greendev.js';
 import type {SyncMessage} from '../../panels/greendev/GreenDevShared.js';
+import * as Marked from '../../third_party/marked/marked.js';
+import * as MarkdownView from '../../ui/components/markdown_view/markdown_view.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
 
@@ -294,6 +299,8 @@ class GreenDevFloaty {
       nodeDescription: document.querySelector('.green-dev-floaty-dialog-node-description')?.textContent,
     });
 
+    let agentFinished = false;
+    let steps = 0;
     try {
       let results;
       if (useGreenDevAgent && this.#agent instanceof AiAssistance.GreenDevAgent.GreenDevAgent) {
@@ -302,7 +309,7 @@ class GreenDevFloaty {
           return;
         }
 
-        // --- Add the Accessibility Tree ---
+        // --- Get the Accessibility Tree ---
         const accessibilityModel = target.model(SDK.AccessibilityModel.AccessibilityModel);
         let axTree = '';
         if (accessibilityModel) {
@@ -315,7 +322,7 @@ class GreenDevFloaty {
           }
         }
 
-        // --- Add the most recent network requests ---
+        // --- Get the most recent network requests ---
         const allNetworkRequests = await AiAssistance.GreenDevAgent.GreenDevAgent.getNetworkContextData(target);
         const networkResourcesMax = 50;
         const startNetworkIndex = Math.max(0, allNetworkRequests.length - networkResourcesMax);
@@ -330,13 +337,13 @@ class GreenDevFloaty {
                   allNetworkRequests.length -
                   lastNetworkRequests.length} additional requests are available (network requests shown are capped at ${
                   networkResourcesMax} requests).` :
-              'No further network requests have been issued.';
+              'No further network requests are available.';
 
           formattedNetworkContext = `Showing network requests with indices ${startNetworkIndex}-${
               startNetworkIndex + lastNetworkRequests.length - 1}:\n\n${formattedNetworkContext}\n\n${footer}`;
         }
 
-        // --- Add the most recent console messages ---
+        // --- Get the most recent console messages ---
         const consoleModel = target.model(SDK.ConsoleModel.ConsoleModel);
         const allConsoleMessages = consoleModel ? consoleModel.messages() : [];
         const consoleMsgLimit = 50;
@@ -358,7 +365,7 @@ class GreenDevFloaty {
                   allConsoleMessages.length -
                   lastConsoleMessages.length} additional messages are available (errors shown are capped at ${
                   consoleMsgLimit} most recent).` :
-              'No further console messages have been emitted.';
+              'No further console messages are available.';
 
           formattedConsoleMessages = `Showing console messages with indices ${startIndex}-${
               startIndex + lastConsoleMessages.length - 1}:\n\n${formattedConsoleMessages}\n\n${footer}`;
@@ -366,8 +373,15 @@ class GreenDevFloaty {
 
         const mainUrl = target.inspectedURL();
 
-        // --- Add some context information about the selected node ---
+        // --- Get the React Props for the selected node (if available) ---
+        const reactComponentProps = this.#backendNodeId ?
+            await this.#agent.getReactComponentProps(this.#backendNodeId, false) :
+            'Could not get the backendNodeId for the selected element.';
+
+        // --- Get some context information about the selected node ---
         const elementContext = await AiAssistance.StylingAgent.StylingAgent.describeElement(this.#node);
+
+        // Now construct the full context.
         const context = `# Page URL
 
 ${mainUrl}
@@ -376,6 +390,10 @@ ${mainUrl}
 
 ${elementContext}
 
+# React component props:
+
+${reactComponentProps}
+
 # Recent network requests
 
 ${formattedNetworkContext}
@@ -401,15 +419,53 @@ ${axTree}`;
 
       for await (const result of results) {
         switch (result.type) {
-          case ResponseType.ANSWER:
-            aiContent.textContent = result.text;
+          case ResponseType.QUERYING:
+            steps++;
+            break;
+          case ResponseType.ANSWER: {
+            aiContent.textContent = '';
+            // Add a space in the protocol, which prevents links from being linkified in
+            // the markup. Why? Because there's an exception thrown if the links don't match the
+            // allowlist in getMarkdownLink(). Need to figure out later.
+            let sanitizedText = result.text.replace(/https:\/\//g, 'https: //');
+            sanitizedText = sanitizedText.replace(/http:\/\//g, 'http: //');
+            const markdown = new MarkdownView.MarkdownView.MarkdownView();
+            markdown.data = {
+              tokens: Marked.Marked.lexer(sanitizedText),
+            };
+            aiContent.append(markdown);
+            void new Promise(resolve => setTimeout(resolve, 0)).then(() => {
+              const style = document.createElement('style');
+              style.textContent =
+                  '.message { font-size: 1.0rem; } .message code { font-size: 1.0rem; font-family: \'Roboto Mono\', ' +
+                  'monospace; color: green; } .message ul { margin-left: 20px; }';
+              markdown.shadowRoot?.appendChild(style);
+
+              const codeBlocks = markdown.shadowRoot?.querySelectorAll('devtools-code-block');
+              if (codeBlocks) {
+                for (const codeBlock of codeBlocks) {
+                  const style = document.createElement('style');
+                  style.textContent = `
+.heading { color: black; background-color: #f2f6ff; font-family: 'Roboto Mono', monospace; padding: 2px 4px;
+           border-top-left-radius: 8px; border-top-right-radius: 8px; margin-bottom: 3px; }
+.code { background-color: #f8f9fa; font-family: 'Roboto Mono', monospace; padding: 5px;
+        border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
+.editor-wrapper { margin-left: 20px; }
+                  `;
+                  codeBlock.shadowRoot?.appendChild(style);
+                }
+              }
+            });
             this.#syncChannel.postMessage(
                 {type: 'update-last-message', text: result.text, sessionId: this.#backendNodeId});
+            agentFinished = true;
             break;
+          }
           case ResponseType.ERROR:
             aiContent.textContent = this.#formatError(result.error);
             this.#syncChannel.postMessage(
                 {type: 'update-last-message', text: this.#formatError(result.error), sessionId: this.#backendNodeId});
+            agentFinished = true;
             break;
           case ResponseType.SIDE_EFFECT:
             result.confirm(true);
@@ -423,6 +479,14 @@ ${axTree}`;
       }
     } catch (e) {
       aiContent.textContent = `Exception: ${e instanceof Error ? e.message : String(e)}`;
+      agentFinished = true;
+    }
+
+    const MAX_AGENT_STEPS = AiAssistance.AiAgent.MAX_STEPS;
+    if (!agentFinished && steps >= MAX_AGENT_STEPS) {
+      aiContent.textContent = `The agent has reached its internal limit of ${MAX_AGENT_STEPS} steps per turn before
+      finding an answer. Please try again with a more specific query or say 'continue' (to get ${MAX_AGENT_STEPS}
+      more steps and continue trying).`;
     }
   };
 

package/front_end/entrypoints/greendev_floaty/floaty.html

@@ -20,7 +20,7 @@
       <div class="green-dev-floaty-dialog-blue-card">
         <div class="green-dev-floaty-dialog-node-description"></div>
         <div class="input-row">
-          <input type="text" class="green-dev-floaty-dialog-text-field" placeholder="Why is this not centered?">
+          <input type="text" class="green-dev-floaty-dialog-text-field" placeholder="Why is this hanging?">
           <button class="green-dev-floaty-dialog-play-button"></button>
         </div>
         <div class="green-dev-floaty-disclaimer">

package/front_end/generated/Deprecation.ts

@@ -210,6 +210,10 @@ export const UIStrings = {
    * @description Standard message when one web API is deprecated in favor of another.
    */
   PrefixedVideoSupportsFullscreen: "HTMLVideoElement.webkitSupportsFullscreen is deprecated. Please use Document.fullscreenEnabled instead.",
+  /**
+   * @description Warning displayed to developers when an SVG filter is applied to a disallowed content type.
+   */
+  PreventSvgFilterPaint: "SVG filters cannot be applied to cross-origin iframes, restricted iframes (e.g., sandboxed), or plugins.",
   /**
    * @description Standard message when one web API is deprecated in favor of another.
    */
@@ -390,6 +394,9 @@ export const DEPRECATIONS_METADATA: Partial<Record<string, DeprecationDescriptor
     "chromeStatusFeature": 5176235376246784,
     "milestone": 106
   },
+  "PreventSvgFilterPaint": {
+    "chromeStatusFeature": 5117170452398080
+  },
   "RTCConstraintEnableDtlsSrtpFalse": {
     "milestone": 97
   },

package/front_end/generated/InspectorBackendCommands.ts

@@ -1032,7 +1032,7 @@ inspectorBackend.registerEnum("Page.AdFrameExplanation", {ParentIsAd: "ParentIsA
 inspectorBackend.registerEnum("Page.SecureContextType", {Secure: "Secure", SecureLocalhost: "SecureLocalhost", InsecureScheme: "InsecureScheme", InsecureAncestor: "InsecureAncestor"});
 inspectorBackend.registerEnum("Page.CrossOriginIsolatedContextType", {Isolated: "Isolated", NotIsolated: "NotIsolated", NotIsolatedFeatureDisabled: "NotIsolatedFeatureDisabled"});
 inspectorBackend.registerEnum("Page.GatedAPIFeatures", {SharedArrayBuffers: "SharedArrayBuffers", SharedArrayBuffersTransferAllowed: "SharedArrayBuffersTransferAllowed", PerformanceMeasureMemory: "PerformanceMeasureMemory", PerformanceProfile: "PerformanceProfile"});
-inspectorBackend.registerEnum("Page.PermissionsPolicyFeature", {Accelerometer: "accelerometer", AllScreensCapture: "all-screens-capture", AmbientLightSensor: "ambient-light-sensor", AriaNotify: "aria-notify", AttributionReporting: "attribution-reporting", Autofill: "autofill", Autoplay: "autoplay", Bluetooth: "bluetooth", BrowsingTopics: "browsing-topics", Camera: "camera", CapturedSurfaceControl: "captured-surface-control", ChDpr: "ch-dpr", ChDeviceMemory: "ch-device-memory", ChDownlink: "ch-downlink", ChEct: "ch-ect", ChPrefersColorScheme: "ch-prefers-color-scheme", ChPrefersReducedMotion: "ch-prefers-reduced-motion", ChPrefersReducedTransparency: "ch-prefers-reduced-transparency", ChRtt: "ch-rtt", ChSaveData: "ch-save-data", ChUa: "ch-ua", ChUaArch: "ch-ua-arch", ChUaBitness: "ch-ua-bitness", ChUaHighEntropyValues: "ch-ua-high-entropy-values", ChUaPlatform: "ch-ua-platform", ChUaModel: "ch-ua-model", ChUaMobile: "ch-ua-mobile", ChUaFormFactors: "ch-ua-form-factors", ChUaFullVersion: "ch-ua-full-version", ChUaFullVersionList: "ch-ua-full-version-list", ChUaPlatformVersion: "ch-ua-platform-version", ChUaWow64: "ch-ua-wow64", ChViewportHeight: "ch-viewport-height", ChViewportWidth: "ch-viewport-width", ChWidth: "ch-width", ClipboardRead: "clipboard-read", ClipboardWrite: "clipboard-write", ComputePressure: "compute-pressure", ControlledFrame: "controlled-frame", CrossOriginIsolated: "cross-origin-isolated", DeferredFetch: "deferred-fetch", DeferredFetchMinimal: "deferred-fetch-minimal", DeviceAttributes: "device-attributes", DigitalCredentialsCreate: "digital-credentials-create", DigitalCredentialsGet: "digital-credentials-get", DirectSockets: "direct-sockets", DirectSocketsMulticast: "direct-sockets-multicast", DirectSocketsPrivate: "direct-sockets-private", DisplayCapture: "display-capture", DocumentDomain: "document-domain", EncryptedMedia: "encrypted-media", ExecutionWhileOutOfViewport: "execution-while-out-of-viewport", ExecutionWhileNotRendered: "execution-while-not-rendered", FocusWithoutUserActivation: "focus-without-user-activation", Fullscreen: "fullscreen", Frobulate: "frobulate", Gamepad: "gamepad", Geolocation: "geolocation", Gyroscope: "gyroscope", Hid: "hid", IdentityCredentialsGet: "identity-credentials-get", IdleDetection: "idle-detection", InterestCohort: "interest-cohort", JoinAdInterestGroup: "join-ad-interest-group", KeyboardMap: "keyboard-map", LanguageDetector: "language-detector", LanguageModel: "language-model", LocalFonts: "local-fonts", LocalNetwork: "local-network", LocalNetworkAccess: "local-network-access", LoopbackNetwork: "loopback-network", Magnetometer: "magnetometer", ManualText: "manual-text", MediaPlaybackWhileNotVisible: "media-playback-while-not-visible", Microphone: "microphone", Midi: "midi", OnDeviceSpeechRecognition: "on-device-speech-recognition", OtpCredentials: "otp-credentials", Payment: "payment", PictureInPicture: "picture-in-picture", PrivateAggregation: "private-aggregation", PrivateStateTokenIssuance: "private-state-token-issuance", PrivateStateTokenRedemption: "private-state-token-redemption", PublickeyCredentialsCreate: "publickey-credentials-create", PublickeyCredentialsGet: "publickey-credentials-get", RecordAdAuctionEvents: "record-ad-auction-events", Rewriter: "rewriter", RunAdAuction: "run-ad-auction", ScreenWakeLock: "screen-wake-lock", Serial: "serial", SharedStorage: "shared-storage", SharedStorageSelectUrl: "shared-storage-select-url", SmartCard: "smart-card", SpeakerSelection: "speaker-selection", StorageAccess: "storage-access", SubApps: "sub-apps", Summarizer: "summarizer", SyncXhr: "sync-xhr", Translator: "translator", Unload: "unload", Usb: "usb", UsbUnrestricted: "usb-unrestricted", VerticalScroll: "vertical-scroll", WebAppInstallation: "web-app-installation", WebPrinting: "web-printing", WebShare: "web-share", WindowManagement: "window-management", Writer: "writer", XrSpatialTracking: "xr-spatial-tracking"});
+inspectorBackend.registerEnum("Page.PermissionsPolicyFeature", {Accelerometer: "accelerometer", AllScreensCapture: "all-screens-capture", AmbientLightSensor: "ambient-light-sensor", AriaNotify: "aria-notify", AttributionReporting: "attribution-reporting", Autofill: "autofill", Autoplay: "autoplay", Bluetooth: "bluetooth", BrowsingTopics: "browsing-topics", Camera: "camera", CapturedSurfaceControl: "captured-surface-control", ChDpr: "ch-dpr", ChDeviceMemory: "ch-device-memory", ChDownlink: "ch-downlink", ChEct: "ch-ect", ChPrefersColorScheme: "ch-prefers-color-scheme", ChPrefersReducedMotion: "ch-prefers-reduced-motion", ChPrefersReducedTransparency: "ch-prefers-reduced-transparency", ChRtt: "ch-rtt", ChSaveData: "ch-save-data", ChUa: "ch-ua", ChUaArch: "ch-ua-arch", ChUaBitness: "ch-ua-bitness", ChUaHighEntropyValues: "ch-ua-high-entropy-values", ChUaPlatform: "ch-ua-platform", ChUaModel: "ch-ua-model", ChUaMobile: "ch-ua-mobile", ChUaFormFactors: "ch-ua-form-factors", ChUaFullVersion: "ch-ua-full-version", ChUaFullVersionList: "ch-ua-full-version-list", ChUaPlatformVersion: "ch-ua-platform-version", ChUaWow64: "ch-ua-wow64", ChViewportHeight: "ch-viewport-height", ChViewportWidth: "ch-viewport-width", ChWidth: "ch-width", ClipboardRead: "clipboard-read", ClipboardWrite: "clipboard-write", ComputePressure: "compute-pressure", ControlledFrame: "controlled-frame", CrossOriginIsolated: "cross-origin-isolated", DeferredFetch: "deferred-fetch", DeferredFetchMinimal: "deferred-fetch-minimal", DeviceAttributes: "device-attributes", DigitalCredentialsCreate: "digital-credentials-create", DigitalCredentialsGet: "digital-credentials-get", DirectSockets: "direct-sockets", DirectSocketsMulticast: "direct-sockets-multicast", DirectSocketsPrivate: "direct-sockets-private", DisplayCapture: "display-capture", DocumentDomain: "document-domain", EncryptedMedia: "encrypted-media", ExecutionWhileOutOfViewport: "execution-while-out-of-viewport", ExecutionWhileNotRendered: "execution-while-not-rendered", FocusWithoutUserActivation: "focus-without-user-activation", Fullscreen: "fullscreen", Frobulate: "frobulate", Gamepad: "gamepad", Geolocation: "geolocation", Gyroscope: "gyroscope", Hid: "hid", IdentityCredentialsGet: "identity-credentials-get", IdleDetection: "idle-detection", InterestCohort: "interest-cohort", JoinAdInterestGroup: "join-ad-interest-group", KeyboardMap: "keyboard-map", LanguageDetector: "language-detector", LanguageModel: "language-model", LocalFonts: "local-fonts", LocalNetwork: "local-network", LocalNetworkAccess: "local-network-access", LoopbackNetwork: "loopback-network", Magnetometer: "magnetometer", ManualText: "manual-text", MediaPlaybackWhileNotVisible: "media-playback-while-not-visible", Microphone: "microphone", Midi: "midi", OnDeviceSpeechRecognition: "on-device-speech-recognition", OtpCredentials: "otp-credentials", Payment: "payment", PictureInPicture: "picture-in-picture", PrivateAggregation: "private-aggregation", PrivateStateTokenIssuance: "private-state-token-issuance", PrivateStateTokenRedemption: "private-state-token-redemption", PublickeyCredentialsCreate: "publickey-credentials-create", PublickeyCredentialsGet: "publickey-credentials-get", RecordAdAuctionEvents: "record-ad-auction-events", Rewriter: "rewriter", RunAdAuction: "run-ad-auction", ScreenWakeLock: "screen-wake-lock", Serial: "serial", SharedStorage: "shared-storage", SharedStorageSelectUrl: "shared-storage-select-url", SmartCard: "smart-card", SpeakerSelection: "speaker-selection", StorageAccess: "storage-access", SubApps: "sub-apps", Summarizer: "summarizer", SyncXhr: "sync-xhr", Tools: "tools", Translator: "translator", Unload: "unload", Usb: "usb", UsbUnrestricted: "usb-unrestricted", VerticalScroll: "vertical-scroll", WebAppInstallation: "web-app-installation", WebPrinting: "web-printing", WebShare: "web-share", WindowManagement: "window-management", Writer: "writer", XrSpatialTracking: "xr-spatial-tracking"});
 inspectorBackend.registerEnum("Page.PermissionsPolicyBlockReason", {Header: "Header", IframeAttribute: "IframeAttribute", InFencedFrameTree: "InFencedFrameTree", InIsolatedApp: "InIsolatedApp"});
 inspectorBackend.registerEnum("Page.OriginTrialTokenStatus", {Success: "Success", NotSupported: "NotSupported", Insecure: "Insecure", Expired: "Expired", WrongOrigin: "WrongOrigin", InvalidSignature: "InvalidSignature", Malformed: "Malformed", WrongVersion: "WrongVersion", FeatureDisabled: "FeatureDisabled", TokenDisabled: "TokenDisabled", FeatureDisabledForUser: "FeatureDisabledForUser", UnknownTrial: "UnknownTrial"});
 inspectorBackend.registerEnum("Page.OriginTrialStatus", {Enabled: "Enabled", ValidTokenNotProvided: "ValidTokenNotProvided", OSNotSupported: "OSNotSupported", TrialNotAllowed: "TrialNotAllowed"});

package/front_end/generated/SupportedCSSProperties.js

@@ -1076,7 +1076,7 @@ export const generatedProperties = [
  {
   "inherited": true,
   "keywords": [
-   "auto",
+   "ellipsis",
    "no-ellipsis"
   ],
   "name": "block-ellipsis"
@@ -1945,7 +1945,7 @@ export const generatedProperties = [
  },
  {
   "keywords": [
-   "auto",
+   "normal",
    "collapse",
    "-webkit-legacy"
   ],
@@ -3950,7 +3950,7 @@ export const generatedProperties = [
   "inherited": true,
   "keywords": [
    "auto",
-   "none"
+   "spaces"
   ],
   "name": "ruby-overhang"
  },
@@ -5324,7 +5324,7 @@ export const generatedPropertyValues = {
  },
  "block-ellipsis": {
   "values": [
-   "auto",
+   "ellipsis",
    "no-ellipsis"
   ]
  },
@@ -5767,7 +5767,7 @@ export const generatedPropertyValues = {
  },
  "continue": {
   "values": [
-   "auto",
+   "normal",
    "collapse",
    "-webkit-legacy"
   ]
@@ -6885,7 +6885,7 @@ export const generatedPropertyValues = {
  "ruby-overhang": {
   "values": [
    "auto",
-   "none"
+   "spaces"
   ]
  },
  "ruby-position": {

package/front_end/generated/protocol.ts

@@ -14509,6 +14509,7 @@ export namespace Page {
     SubApps = 'sub-apps',
     Summarizer = 'summarizer',
     SyncXhr = 'sync-xhr',
+    Tools = 'tools',
     Translator = 'translator',
     Unload = 'unload',
     Usb = 'usb',