chrome-devtools-frontend 1.0.1571007 → 1.0.1572937

package/front_end/core/sdk/OverlayModel.ts

@@ -534,8 +534,9 @@ export class OverlayModel extends SDKModel<EventTypes> implements ProtocolProxyA
       gridHighlightConfig: {},
       flexContainerHighlightConfig: {},
       flexItemHighlightConfig: {},
-      contrastAlgorithm: Root.Runtime.experiments.isEnabled('apca') ? Protocol.Overlay.ContrastAlgorithm.Apca :
-                                                                      Protocol.Overlay.ContrastAlgorithm.Aa,
+      contrastAlgorithm: Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.APCA) ?
+          Protocol.Overlay.ContrastAlgorithm.Apca :
+          Protocol.Overlay.ContrastAlgorithm.Aa,
     };
 
     if (mode === 'all' || mode === 'content') {

package/front_end/core/sdk/SourceMap.ts

@@ -578,7 +578,7 @@ export class SourceMap {
           lineNumber, columnNumber, sourceIndex, sourceURL, sourceLineNumber, sourceColumnNumber, names[nameIndex]));
     }
 
-    if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.USE_SOURCE_MAP_SCOPES)) {
+    if (Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES)) {
       if (!this.#scopesInfo) {
         this.#scopesInfo = new SourceMapScopesInfo(this, {scopes: [], ranges: []});
       }

package/front_end/devtools_compatibility.js

@@ -435,13 +435,7 @@
     LighthouseModeRun: 'DevTools.LighthouseModeRun',
     LighthouseCategoryUsed: 'DevTools.LighthouseCategoryUsed',
     PanelShown: 'DevTools.PanelShown',
-    RecordingAssertion: 'DevTools.RecordingAssertion',
-    RecordingCodeToggled: 'DevTools.RecordingCodeToggled',
-    RecordingCopiedToClipboard: 'DevTools.RecordingCopiedToClipboard',
-    RecordingEdited: 'DevTools.RecordingEdited',
-    RecordingExported: 'DevTools.RecordingExported',
     RecordingReplayFinished: 'DevTools.RecordingReplayFinished',
-    RecordingReplaySpeed: 'DevTools.RecordingReplaySpeed',
     RecordingReplayStarted: 'DevTools.RecordingReplayStarted',
     RecordingToggled: 'DevTools.RecordingToggled',
     SourcesPanelFileDebugged: 'DevTools.SourcesPanelFileDebugged',

package/front_end/entrypoints/main/MainImpl.ts

@@ -329,67 +329,83 @@ export class MainImpl {
   }
 
   #initializeExperiments(): void {
-    Root.Runtime.experiments.register('capture-node-creation-stacks', 'Capture node creation stacks');
-    Root.Runtime.experiments.register('live-heap-profile', 'Live heap profile');
     Root.Runtime.experiments.register(
-        'protocol-monitor', 'Protocol Monitor',
+        Root.ExperimentNames.ExperimentName.CAPTURE_NODE_CREATION_STACKS, 'Capture node creation stacks');
+    Root.Runtime.experiments.register(Root.ExperimentNames.ExperimentName.LIVE_HEAP_PROFILE, 'Live heap profile');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.PROTOCOL_MONITOR, 'Protocol Monitor',
         'https://developer.chrome.com/blog/new-in-devtools-92/#protocol-monitor');
-    Root.Runtime.experiments.register('sampling-heap-profiler-timeline', 'Sampling heap profiler timeline');
     Root.Runtime.experiments.register(
-        'show-option-tp-expose-internals-in-heap-snapshot', 'Show option to expose internals in heap snapshots');
+        Root.ExperimentNames.ExperimentName.SAMPLING_HEAP_PROFILER_TIMELINE, 'Sampling heap profiler timeline');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.SHOW_OPTION_TO_EXPOSE_INTERNALS_IN_HEAP_SNAPSHOT,
+        'Show option to expose internals in heap snapshots');
 
     // Timeline
-    Root.Runtime.experiments.register('timeline-invalidation-tracking', 'Performance panel: invalidation tracking');
-    Root.Runtime.experiments.register('timeline-show-all-events', 'Performance panel: show all events');
-    Root.Runtime.experiments.register('timeline-v8-runtime-call-stats', 'Performance panel: V8 runtime call stats');
     Root.Runtime.experiments.register(
-        Root.Runtime.ExperimentName.TIMELINE_DEBUG_MODE, 'Performance panel: debug mode (trace event details, etc)');
+        Root.ExperimentNames.ExperimentName.TIMELINE_INVALIDATION_TRACKING, 'Performance panel: invalidation tracking');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.TIMELINE_SHOW_ALL_EVENTS, 'Performance panel: show all events');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.TIMELINE_V8_RUNTIME_CALL_STATS, 'Performance panel: V8 runtime call stats');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.TIMELINE_DEBUG_MODE,
+        'Performance panel: debug mode (trace event details, etc)');
 
     // Debugging
-    Root.Runtime.experiments.register('instrumentation-breakpoints', 'Instrumentation breakpoints');
-    Root.Runtime.experiments.register('use-source-map-scopes', 'Use scope information from source maps');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS, 'Instrumentation breakpoints');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES, 'Use scope information from source maps');
 
     // Advanced Perceptual Contrast Algorithm.
     Root.Runtime.experiments.register(
-        'apca', 'Advanced Perceptual Contrast Algorithm (APCA) replacing previous contrast ratio and AA/AAA guidelines',
+        Root.ExperimentNames.ExperimentName.APCA,
+        'Advanced Perceptual Contrast Algorithm (APCA) replacing previous contrast ratio and AA/AAA guidelines',
         'https://developer.chrome.com/blog/new-in-devtools-89/#apca');
 
     // Full Accessibility Tree
     Root.Runtime.experiments.register(
-        'full-accessibility-tree', 'Full accessibility tree view in the Elements panel',
+        Root.ExperimentNames.ExperimentName.FULL_ACCESSIBILITY_TREE,
+        'Full accessibility tree view in the Elements panel',
         'https://developer.chrome.com/blog/new-in-devtools-90/#accessibility-tree',
         'https://g.co/devtools/a11y-tree-feedback');
 
     // Font Editor
     Root.Runtime.experiments.register(
-        'font-editor', 'New font editor in the Styles tab',
+        Root.ExperimentNames.ExperimentName.FONT_EDITOR, 'New font editor in the Styles tab',
         'https://developer.chrome.com/blog/new-in-devtools-89/#font');
 
     // Contrast issues reported via the Issues panel.
     Root.Runtime.experiments.register(
-        'contrast-issues', 'Automatic contrast issue reporting via the Issues panel',
+        Root.ExperimentNames.ExperimentName.CONTRAST_ISSUES, 'Automatic contrast issue reporting via the Issues panel',
         'https://developer.chrome.com/blog/new-in-devtools-90/#low-contrast');
 
     // New cookie features.
-    Root.Runtime.experiments.register('experimental-cookie-features', 'Experimental cookie features');
+    Root.Runtime.experiments.register(
+        Root.ExperimentNames.ExperimentName.EXPERIMENTAL_COOKIE_FEATURES, 'Experimental cookie features');
 
     // Change grouping of sources panel to use Authored/Deployed trees
     Root.Runtime.experiments.register(
-        Root.Runtime.ExperimentName.AUTHORED_DEPLOYED_GROUPING, 'Group sources into authored and deployed trees',
-        'https://goo.gle/authored-deployed', 'https://goo.gle/authored-deployed-feedback');
+        Root.ExperimentNames.ExperimentName.AUTHORED_DEPLOYED_GROUPING,
+        'Group sources into authored and deployed trees', 'https://goo.gle/authored-deployed',
+        'https://goo.gle/authored-deployed-feedback');
 
     // Hide third party code (as determined by ignore lists or source maps)
     Root.Runtime.experiments.register(
-        Root.Runtime.ExperimentName.JUST_MY_CODE, 'Hide ignore-listed code in Sources tree view');
+        Root.ExperimentNames.ExperimentName.JUST_MY_CODE, 'Hide ignore-listed code in Sources tree view');
 
     Root.Runtime.experiments.register(
-        Root.Runtime.ExperimentName.TIMELINE_SHOW_POST_MESSAGE_EVENTS,
+        Root.ExperimentNames.ExperimentName.TIMELINE_SHOW_POST_MESSAGE_EVENTS,
         'Performance panel: show postMessage dispatch and handling flows',
     );
 
     Root.Runtime.experiments.enableExperimentsByDefault([
-      Root.Runtime.ExperimentName.FULL_ACCESSIBILITY_TREE,
-      ...(Root.Runtime.Runtime.queryParam('isChromeForTesting') ? ['protocol-monitor'] : []),
+      Root.ExperimentNames.ExperimentName.FULL_ACCESSIBILITY_TREE,
+      Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES,
+      ...(Root.Runtime.Runtime.queryParam('isChromeForTesting') ?
+              [Root.ExperimentNames.ExperimentName.PROTOCOL_MONITOR] :
+              []),
     ]);
 
     Root.Runtime.experiments.cleanUpStaleExperiments();
@@ -402,7 +418,7 @@ export class MainImpl {
     if (Host.InspectorFrontendHost.isUnderTest()) {
       const testParam = Root.Runtime.Runtime.queryParam('test');
       if (testParam?.includes('live-line-level-heap-profile.js')) {
-        Root.Runtime.experiments.enableForTest('live-heap-profile');
+        Root.Runtime.experiments.enableForTest(Root.ExperimentNames.ExperimentName.LIVE_HEAP_PROFILE);
       }
     }
 
@@ -565,6 +581,10 @@ export class MainImpl {
         AiAssistanceModel.ConversationHandler.ConversationHandlerEvents.EXTERNAL_CONVERSATION_STARTED,
         event => void VisualLogging.logFunctionCall(`start-conversation-${event.data}`, 'external'));
 
+    if (Root.Runtime.hostConfig.devToolsGeminiRebranding?.enabled) {
+      await PanelCommon.GeminiRebrandPromoDialog.maybeShow();
+    }
+
     MainImpl.timeEnd('Main._createAppUI');
 
     const appProvider = Common.AppProvider.getRegisteredAppProviders()[0];
@@ -672,7 +692,7 @@ export class MainImpl {
           const runnable = await lateInitializationLoader();
           return await runnable.run();
         });
-    if (Root.Runtime.experiments.isEnabled('live-heap-profile')) {
+    if (Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.LIVE_HEAP_PROFILE)) {
       const PerfUI = await import('../../ui/legacy/components/perf_ui/perf_ui.js');
       const setting = 'memory-live-heap-profile';
       if (Common.Settings.Settings.instance().moduleSetting(setting).get()) {

package/front_end/entrypoints/main/main-meta.ts

@@ -877,7 +877,7 @@ UI.ContextMenu.registerProvider({
     ];
   },
   async loadProvider() {
-    return new UI.XLink.ContextMenuProvider();
+    return new UI.LinkContextMenuProvider.LinkContextMenuProvider();
   },
   experiment: undefined,
 });

package/front_end/generated/SupportedCSSProperties.js

@@ -730,14 +730,13 @@ export const generatedProperties = [
    "text-emphasis-color",
    "text-emphasis-position",
    "text-emphasis-style",
-   "text-grow",
+   "text-fit",
    "text-indent",
    "text-justify",
    "text-orientation",
    "text-overflow",
    "text-rendering",
    "text-shadow",
-   "text-shrink",
    "text-size-adjust",
    "text-spacing-trim",
    "text-transform",
@@ -1794,8 +1793,7 @@ export const generatedProperties = [
   "keywords": [
    "all",
    "around",
-   "between",
-   "none"
+   "between"
   ],
   "name": "column-rule-visibility-items"
  },
@@ -3826,8 +3824,7 @@ export const generatedProperties = [
   "keywords": [
    "all",
    "around",
-   "between",
-   "none"
+   "between"
   ],
   "name": "row-rule-visibility-items"
  },
@@ -4440,7 +4437,7 @@ export const generatedProperties = [
   "name": "text-emphasis-style"
  },
  {
-  "name": "text-grow"
+  "name": "text-fit"
  },
  {
   "inherited": true,
@@ -4489,9 +4486,6 @@ export const generatedProperties = [
   ],
   "name": "text-shadow"
  },
- {
-  "name": "text-shrink"
- },
  {
   "inherited": true,
   "keywords": [
@@ -5525,8 +5519,7 @@ export const generatedPropertyValues = {
   "values": [
    "all",
    "around",
-   "between",
-   "none"
+   "between"
   ]
  },
  "column-rule-width": {
@@ -6649,8 +6642,7 @@ export const generatedPropertyValues = {
   "values": [
    "all",
    "around",
-   "between",
-   "none"
+   "between"
   ]
  },
  "row-rule-width": {

package/front_end/models/ai_assistance/agents/PerformanceAgent.ts

@@ -10,10 +10,8 @@ import * as Root from '../../../core/root/root.js';
 import * as SDK from '../../../core/sdk/sdk.js';
 import * as Tracing from '../../../services/tracing/tracing.js';
 import * as Annotations from '../../annotations/annotations.js';
-import * as Logs from '../../logs/logs.js';
 import * as SourceMapScopes from '../../source_map_scopes/source_map_scopes.js';
 import * as Trace from '../../trace/trace.js';
-import {ArtifactsManager} from '../ArtifactsManager.js';
 import {
   PerformanceInsightFormatter,
 } from '../data_formatters/PerformanceInsightFormatter.js';
@@ -69,77 +67,6 @@ const greenDevAdditionalAnnotationsGuidelines = `
 - The annotationMessage should be descriptive and relevant to why the element or network request is being highlighted.
 `;
 
-const getGreenDevAdditionalWidgetGuidelines = (): string => {
-  // GreenDev is experimenting with multiple ways to display widget:
-  // if widgetsFromFunctionCalls is true, then we use function calls to add widgets
-  // otherwise we use ai-insight tags
-  const widgetsFromFunctionCalls = true;
-
-  if (widgetsFromFunctionCalls) {
-    return `
-- CRITICAL: You have access to a function for adding rich, interactive widgets to your response: \`addWidget\`.
-  You MUST use this function whenever you refer to a corresponding entity.
-
-- **\`addWidget({widget: {type: 'insight', insightType: '...'}})\`**:
-  - **When to use**: Call this function every time you mention a specific performance insight (e.g., LCP, INP, CLS culprits).
-  - **Purpose**: It embeds an interactive widget that provides a detailed breakdown and visualization of the insight.
-  - **Example**: If you are explaining the causes of a poor LCP score, you MUST also call \`addWidget({widget: {type: 'insight', insightType: 'LCPBreakdown'}})\`.
-
-- **\`addWidget({widget: {type: 'network-request', eventKey: '...'}})\`**:
-  - **When to use**: Call this function whenever you discuss a specific network request.
-  - **Purpose**: It adds a widget displaying the full details of the network request, such as its timing, headers, and priority.
-  - **Critical**: The eventKey should be the trace event key (only the number, no letters prefix or -) of that script's network request.
-  - **Example**: If you identify a render-blocking script, you MUST also call \`addWidget({widget: {type: 'network-request', eventKey: '...'}})\`.
-
-- **\`addWidget({widget: {type: 'flamechart', start: ..., end: ...}})\`**:
-  - **When to use**: Call this function to highlight a specific time range within the trace, especially when discussing long tasks, specific events, or periods of high activity.
-    - **Purpose**: It embeds a focused flame chart visualization for the given time range (in microseconds).
-    - **Example**: If you find a long task that is blocking the main thread, you MUST also call \`addWidget({widget: {type: 'flamechart', start: 123456, end: 789012}})\`.
-
-- **General Rules**:
-  - You MUST call this function as soon as you identify the entity you are discussing.
-  - Do NOT add more than one widget for the same insight, network request, or time range to avoid redundancy.
-  - If you have already shown a widget for any specific insight, network request, or time range, do not show it again.
-`;
-  }
-
-  return `
-- **Visualizing Insights**: When discussing the breakdown of specific metrics or a performance problem,
-you must render the appropriate Insight Overview component. Use these tags on a new line within your response:
-  - For LCP breakdown: <ai-insight value="LCPBreakdown">
-  - For INP breakdown: <ai-insight value="INPBreakdown">
-  - For CLS culprits: <ai-insight value="CLSCulprits">
-  - For third parties: <ai-insight value="ThirdParties">
-  - For document latency: <ai-insight value="DocumentLatency">
-  - For DOM size: <ai-insight value="DOMSize">
-  - For duplicate JavaScript: <ai-insight value="DuplicatedJavaScript">
-  - For font display: <ai-insight value="FontDisplay">
-  - For forced reflow: <ai-insight value="ForcedReflow">
-  - For image delivery: <ai-insight value="ImageDelivery">
-  - For LCP discovery: <ai-insight value="LCPDiscovery">
-  - For legacy JavaScript: <ai-insight value="LegacyJavaScript">
-  - For network dependency tree: <ai-insight value="NetworkDependencyTree">
-  - For render blocking: <ai-insight value="RenderBlocking">
-  - For slow CSS selector: <ai-insight value="SlowCSSSelector">
-  - For viewport: <ai-insight value="Viewport">
-  - For modern HTTP: <ai-insight value="ModernHTTP">
-  - For cache: <ai-insight value="Cache">
-- Do not place the <ai-insight> tag inside markdown code blocks (backticks). Output the tag directly as raw text.
-- **Visualizing Network Request Details**: When discussing a specific network request, represent its details in a structured widget for improved readability and focus.
-  - Use this tag on a new line within your response, replacing \`EVENT_KEY\` (only the number, no letters prefix or -) with the actual trace event key:
-    - For network event details: <network-request-widget value="EVENT_KEY">
-- **Visualizing Flamechart**: When discussing an interesting part of the trace, represent its details in a structured widget for improved readability and focus.
-  - Use this tag on a new line within your response, replacing "MIN_MICROSECONDS" and "MAX_MICROSECONDS" with the actual start and end times in microseconds:
-    - For a flame chart of a specific time range: <flame-chart-widget start="MIN_MICROSECONDS" end="MAX_MICROSECONDS">
-    - CRITICAL: MIN_MICROSECONDS and MAX_MICROSECONDS must be within the flamechart bounds and in microseconds.
-  - When you mention a specific performance event like LCP, INP, or a long task, you MUST also include a flamechart widget focused on the exact time range of that event.
-    - This provides essential visual context to your explanation.
-- CRITICAL: Avoid Redundancy - When using insight or network request widgets, do not repeat details in the text response.
-  - For example, for LCP, the phases like Time to First Byte will be part of the insight widget, so you must not state them in the text. This applies to other insights and network request timings.
-- Do not display any of the same widgets more than once. For example, if you have already displayed a network request widget for a specific event, do not display it again in the same response.
-`;
-};
-
 /**
  * Preamble clocks in at ~1341 tokens.
  *   The prose is around 4.5 chars per token.
@@ -148,7 +75,6 @@ you must render the appropriate Insight Overview component. Use these tags on a
  * Check token length in https://aistudio.google.com/
  */
 const buildPreamble = (): string => {
-  const greenDevEnabled = Boolean(Root.Runtime.hostConfig.devToolsGreenDevUi?.enabled);
   const annotationsEnabled = Annotations.AnnotationRepository.annotationsEnabled();
   return `You are an assistant, expert in web performance and highly skilled with Chrome DevTools.
 
@@ -203,7 +129,6 @@ Note: if the user asks a specific question about the trace (such as "What is my
 - Be direct and to the point. Avoid unnecessary introductory phrases or filler content. Focus on delivering actionable advice efficiently.
 
 ${annotationsEnabled ? greenDevAdditionalAnnotationsGuidelines : ''}
-${greenDevEnabled ? getGreenDevAdditionalWidgetGuidelines() : ''}
 
 ## Strict Constraints
 
@@ -1248,111 +1173,6 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
         },
       });
     }
-
-    if (Root.Runtime.hostConfig.devToolsGreenDevUi?.enabled) {
-      this.declareFunction<
-          {
-            type: 'insight' | 'network-request' | 'flamechart',
-            insightType?: Trace.Insights.Types.InsightKeys,
-            eventKey?: number,
-            start?: number,
-            end?: number,
-          },
-          object|{error: string}>('addWidget', {
-        description:
-            'Adds an insight widget to the response. When mentioning an insight, call this function to also display an appropriate widget. Use this as much as possible to provide a better user experience.',
-        parameters: {
-          type: Host.AidaClient.ParametersTypes.OBJECT,
-          description: '',
-          nullable: false,
-          properties: {
-            type: {
-              type: Host.AidaClient.ParametersTypes.STRING,
-              description: 'The type of the widget to add. Possible values: insight, network-request, flamechart',
-              nullable: false,
-            },
-            insightType: {
-              type: Host.AidaClient.ParametersTypes.STRING,
-              description: 'The type of the insight widget. Include for insight widgets.',
-              nullable: true,
-            },
-            eventKey: {
-              type: Host.AidaClient.ParametersTypes.STRING,
-              description: 'The event key for the network request widget. Include for network request widgets.',
-              nullable: true,
-            },
-            start: {
-              type: Host.AidaClient.ParametersTypes.INTEGER,
-              description: 'The start time for the flame chart widget. Include for flame chart widgets.',
-              nullable: true,
-            },
-            end: {
-              type: Host.AidaClient.ParametersTypes.INTEGER,
-              description: 'The end time for the flame chart widget. Include for flame chart widgets.',
-              nullable: true,
-            },
-          },
-          required: ['type']
-        },
-        handler: async params => {
-          switch (params.type) {
-            case 'insight':
-              if (!params.insightType) {
-                return {error: 'Missing insightType for insight widget'};
-              }
-              ArtifactsManager.instance().addArtifact({type: 'insight', insightType: params.insightType});
-              return {result: {success: true}};
-            case 'network-request': {
-              if (!params.eventKey) {
-                return {error: 'Missing eventKey for network-request widget'};
-              }
-              const rawTraceEvent =
-                  Trace.Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getRawTraceEvents().at(
-                      Number(params.eventKey));
-              // Get the trace event object if it is available.
-              // If the trace is uploaded, we need to use the synthetic event.
-              if (rawTraceEvent && Trace.Types.Events.isSyntheticNetworkRequest(rawTraceEvent)) {
-                const rawTraceEventId = rawTraceEvent?.args?.data?.requestId;
-                const rawTraceEventUrl = rawTraceEvent?.args?.data?.url;
-                const networkRequest = rawTraceEvent ? Logs.NetworkLog.NetworkLog.instance()
-                                                           .requestsForId(rawTraceEventId)
-                                                           .find(r => r.url() === rawTraceEventUrl) :
-                                                       null;
-                if (networkRequest) {
-                  ArtifactsManager.instance().addArtifact({type: 'network-request', request: networkRequest});
-                  return {result: {success: true}};
-                }
-              }
-
-              const syntheticRequest = Trace.Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager()
-                                           .syntheticEventForRawEventIndex(Number(params.eventKey));
-
-              if (syntheticRequest && Trace.Types.Events.isSyntheticNetworkRequest(syntheticRequest)) {
-                ArtifactsManager.instance().addArtifact({
-                  type: 'network-request',
-                  request: syntheticRequest,
-                });
-                return {result: {success: true}};
-              }
-
-              return {result: {error: 'Could not find network request'}};
-            }
-            case 'flamechart':
-              if (params.start === undefined || params.end === undefined) {
-                return {error: 'Missing start or end for flamechart widget'};
-              }
-              ArtifactsManager.instance().addArtifact({
-                type: 'flamechart',
-                start: Trace.Types.Timing.Micro(params.start),
-                end: Trace.Types.Timing.Micro(params.end),
-              });
-              return {result: {success: true}};
-            default:
-              return {error: 'Invalid widget type'};
-          }
-        },
-      });
-    }
   }
 
   async addElementAnnotation(elementId: string, annotationMessage: string):

package/front_end/models/ai_assistance/ai_assistance.ts

@@ -13,7 +13,6 @@ import * as StylingAgent from './agents/StylingAgent.js';
 import * as AiConversation from './AiConversation.js';
 import * as AiHistoryStorage from './AiHistoryStorage.js';
 import * as AiUtils from './AiUtils.js';
-import * as ArtifactsManager from './ArtifactsManager.js';
 import * as BuiltInAi from './BuiltInAi.js';
 import * as ChangeManager from './ChangeManager.js';
 import * as ConversationHandler from './ConversationHandler.js';
@@ -39,7 +38,6 @@ export {
   AiHistoryStorage,
   AIQueries,
   AiUtils,
-  ArtifactsManager,
   BuiltInAi,
   ChangeManager,
   ConversationHandler,

package/front_end/models/breakpoints/BreakpointManager.ts

@@ -91,7 +91,7 @@ export class BreakpointManager extends Common.ObjectWrapper.ObjectWrapper<EventT
   }
 
   modelAdded(debuggerModel: SDK.DebuggerModel.DebuggerModel): void {
-    if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
+    if (Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
       debuggerModel.setSynchronizeBreakpointsCallback(this.restoreBreakpointsForScript.bind(this));
     }
   }
@@ -128,7 +128,7 @@ export class BreakpointManager extends Common.ObjectWrapper.ObjectWrapper<EventT
   // This method explicitly awaits the source map (if necessary) and the uiSourceCodes
   // required to set all breakpoints that are related to this script.
   async restoreBreakpointsForScript(script: SDK.Script.Script): Promise<void> {
-    if (!Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
+    if (!Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
       return;
     }
     if (!script.sourceURL) {
@@ -1006,7 +1006,7 @@ export class ModelBreakpoint {
           };
         }));
         newState = positions.slice(0);  // Create a copy
-      } else if (!Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
+      } else if (!Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS)) {
         // Use this fallback if we do not have instrumentation breakpoints enabled yet. This currently makes
         // sure that v8 knows about the breakpoint and is able to restore it whenever the script is parsed.
         const lastResolvedState = this.#breakpoint.getLastResolvedState();

package/front_end/models/issues_manager/ContrastCheckTrigger.ts

@@ -45,7 +45,7 @@ export class ContrastCheckTrigger {
   }
 
   #checkContrast(resourceTreeModel: SDK.ResourceTreeModel.ResourceTreeModel): void {
-    if (!Root.Runtime.experiments.isEnabled('contrast-issues')) {
+    if (!Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.CONTRAST_ISSUES)) {
       return;
     }
     void resourceTreeModel.target().auditsAgent().invoke_checkContrast({});
@@ -60,7 +60,7 @@ export class ContrastCheckTrigger {
 
   async #frameAdded(event: Common.EventTarget.EventTargetEvent<SDK.ResourceTreeModel.ResourceTreeFrame>):
       Promise<void> {
-    if (!Root.Runtime.experiments.isEnabled('contrast-issues')) {
+    if (!Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.CONTRAST_ISSUES)) {
       return;
     }
     const frame = event.data;

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -6594,6 +6594,14 @@ export const NativeFunctions = [
     name: "setHTML",
     signatures: [["html","?options"]]
   },
+  {
+    name: "streamAppendHTMLUnsafe",
+    signatures: [["?options"]]
+  },
+  {
+    name: "streamHTMLUnsafe",
+    signatures: [["?options"]]
+  },
   {
     name: "scrollIntoViewIfNeeded",
     signatures: [["?centerIfNeeded"]]

package/front_end/models/source_map_scopes/NamesResolver.ts

@@ -371,7 +371,7 @@ export const resolveScopeChain =
     return scopeChain;
   }
 
-  scopeChain = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.USE_SOURCE_MAP_SCOPES) ?
+  scopeChain = Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES) ?
       callFrame.script.sourceMap()?.resolveScopeChain(callFrame) :
       null;
   if (scopeChain) {

package/front_end/models/trace/EventsSerializer.ts

@@ -19,11 +19,15 @@ export class EventsSerializer {
       return `${Types.File.EventKeyType.LEGACY_TIMELINE_FRAME}-${event.index}`;
     }
 
+    if (Types.Events.isJSSample(event)) {
+      return null;
+    }
+
     const rawEvents = Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getRawTraceEvents();
     const isSynthetic = Types.Events.isSyntheticBased(event);
     const index = rawEvents.indexOf(isSynthetic ? event.rawSourceEvent : event);
     if (index === -1) {
-      throw new Error(`Unknown trace event: ${event.name}`);
+      return null;
     }
 
     const key: Types.File.SyntheticEventKey|Types.File.RawEventKey = Types.Events.isSyntheticBased(event) ?

package/front_end/models/trace/ModelImpl.ts

@@ -10,10 +10,6 @@ import type * as Insights from './insights/insights.js';
 import {TraceParseProgressEvent, TraceProcessor} from './Processor.js';
 import * as Types from './types/types.js';
 
-// Note: this model is implemented in a way that can support multiple trace
-// processors. Currently there is only one implemented, but you will see
-// references to "processors" plural because it can easily be extended in the future.
-
 /**
  * The Model is responsible for parsing arrays of raw trace events and storing the
  * resulting data. It can store multiple traces at once, and can return the data for

package/front_end/models/trace/types/TraceEvents.ts

@@ -1832,6 +1832,10 @@ export interface SyntheticJSSample extends Event {
   ph: Phase.INSTANT;
 }
 
+export function isJSSample(event: Event): event is SyntheticJSSample {
+  return event.name === Name.JS_SAMPLE;
+}
+
 export function isSyntheticInteraction(event: Event): event is SyntheticInteractionPair {
   return Boolean(
       'interactionId' in event && event.args?.data && 'beginEvent' in event.args.data && 'endEvent' in event.args.data);

package/front_end/panels/accessibility/AXBreadcrumbsPane.ts

@@ -77,7 +77,7 @@ export class AXBreadcrumbsPane extends AccessibilitySubPane {
     const previewToggle = new Feedback.PreviewToggle.PreviewToggle();
     previewToggle.setAttribute('jslog', `${VisualLogging.toggle('full-accessibility-tree')}`);
     const name = i18nString(UIStrings.fullTreeExperimentName);
-    const experiment = Root.Runtime.ExperimentName.FULL_ACCESSIBILITY_TREE;
+    const experiment = Root.ExperimentNames.ExperimentName.FULL_ACCESSIBILITY_TREE;
     const onChangeCallback: (checked: boolean) => void = checked => {
       Host.userMetrics.experimentChanged(experiment, checked);
       UI.InspectorView.InspectorView.instance().displayReloadRequiredWarning(i18nString(UIStrings.reloadRequired));

package/front_end/panels/accessibility/AccessibilitySidebarView.ts

@@ -95,7 +95,7 @@ export class AccessibilitySidebarView extends UI.Widget.VBox {
     if (!accessibilityModel) {
       return;
     }
-    if (!Root.Runtime.experiments.isEnabled('full-accessibility-tree')) {
+    if (!Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.FULL_ACCESSIBILITY_TREE)) {
       accessibilityModel.clear();
     }
     await accessibilityModel.requestPartialAXTree(node);