chrome-devtools-frontend 1.0.1514545 → 1.0.1515796

package/front_end/models/ai_code_completion/AiCodeCompletion.ts

@@ -202,70 +202,133 @@ export class AiCodeCompletion extends Common.ObjectWrapper.ObjectWrapper<EventTy
     };
   }
 
+  async #completeCodeCached(request: Host.AidaClient.CompletionRequest): Promise<{
+    response: Host.AidaClient.CompletionResponse | null,
+    fromCache: boolean,
+  }> {
+    const cachedResponse = this.#checkCachedRequestForResponse(request);
+    if (cachedResponse) {
+      return {response: cachedResponse, fromCache: true};
+    }
+
+    const response = await this.#aidaClient.completeCode(request);
+    if (!response) {
+      return {
+        response: null,
+        fromCache: false,
+      };
+    }
+
+    this.#updateCachedRequest(request, response);
+    return {
+      response,
+      fromCache: false,
+    };
+  }
+
+  #pickSampleFromResponse(response: Host.AidaClient.CompletionResponse): Host.AidaClient.GenerationSample|null {
+    if (!response.generatedSamples.length) {
+      return null;
+    }
+
+    // `currentHint` is the portion of a standard autocomplete suggestion that the user has not yet typed.
+    // For example, if the user types `document.queryS` and the autocomplete suggests `document.querySelector`,
+    // the `currentHint` is `elector`.
+    const currentHintInMenu = this.#editor.editor.plugin(TextEditor.Config.showCompletionHint)?.currentHint;
+    // TODO(ergunsh): We should not do this check here. Instead, the AI code suggestions should be provided
+    // as it is to the view plugin. The view plugin should choose which one to use based on the completion hint
+    // and selected completion.
+    if (!currentHintInMenu) {
+      return response.generatedSamples[0];
+    }
+
+    // TODO(ergunsh): This does not handle looking for `selectedCompletion`. The `currentHint` is `null`
+    // for the Sources panel case.
+    // Even though there is no match, we still return the first suggestion which will be displayed
+    // when the traditional autocomplete menu is closed.
+    return response.generatedSamples.find(sample => sample.generationString.startsWith(currentHintInMenu)) ??
+        response.generatedSamples[0];
+  }
+
+  async #generateSampleForRequest(request: Host.AidaClient.CompletionRequest, cursor: number): Promise<{
+    suggestionText: string,
+    sampleId: number,
+    fromCache: boolean,
+    citations: Host.AidaClient.Citation[],
+    rpcGlobalId?: Host.AidaClient.RpcGlobalId,
+  }|null> {
+    const {response, fromCache} = await this.#completeCodeCached(request);
+    debugLog('At cursor position', cursor, {request, response, fromCache});
+    if (!response) {
+      return null;
+    }
+
+    const suggestionSample = this.#pickSampleFromResponse(response);
+    if (!suggestionSample) {
+      return null;
+    }
+
+    const shouldBlock =
+        suggestionSample.attributionMetadata?.attributionAction === Host.AidaClient.RecitationAction.BLOCK;
+    if (shouldBlock) {
+      return null;
+    }
+
+    const suggestionText = this.#trimSuggestionOverlap(suggestionSample.generationString, request);
+    if (suggestionText.length === 0) {
+      return null;
+    }
+
+    return {
+      suggestionText,
+      sampleId: suggestionSample.sampleId,
+      fromCache,
+      citations: suggestionSample.attributionMetadata?.citations ?? [],
+      rpcGlobalId: response.metadata.rpcGlobalId,
+    };
+  }
+
   async #requestAidaSuggestion(request: Host.AidaClient.CompletionRequest, cursor: number): Promise<void> {
     const startTime = performance.now();
-    let servedFromCache = false;
     this.dispatchEventToListeners(Events.REQUEST_TRIGGERED, {});
 
     try {
-      let response = this.#checkCachedRequestForResponse(request);
-      if (!response) {
-        response = await this.#aidaClient.completeCode(request);
-        if (response) {
-          this.#updateCachedRequest(request, response);
-        }
-      } else {
-        servedFromCache = true;
+      const sampleResponse = await this.#generateSampleForRequest(request, cursor);
+      if (!sampleResponse) {
+        this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {});
+        return;
       }
-      debugLog('At cursor position', cursor, {request, response});
-      if (response && response.generatedSamples.length > 0 && response.generatedSamples[0].generationString) {
-        if (response.generatedSamples[0].attributionMetadata?.attributionAction ===
-            Host.AidaClient.RecitationAction.BLOCK) {
-          this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {});
-          return;
-        }
 
-        // Use the suffix from the request to find and remove any overlap.
-        let suggestionText = response.generatedSamples[0].generationString;
-        if (request.suffix && request.suffix.length > 0) {
-          suggestionText = this.#trimSuggestionOverlap(response.generatedSamples[0].generationString, request.suffix);
+      const {
+        suggestionText,
+        sampleId,
+        fromCache,
+        citations,
+        rpcGlobalId,
+      } = sampleResponse;
+      const remainingDelay = Math.max(DELAY_BEFORE_SHOWING_RESPONSE_MS - (performance.now() - startTime), 0);
+      this.#renderingTimeout = window.setTimeout(() => {
+        this.#editor.dispatch({
+          effects: TextEditor.Config.setAiAutoCompleteSuggestion.of({
+            text: suggestionText,
+            from: cursor,
+            rpcGlobalId,
+            sampleId,
+          })
+        });
+
+        if (fromCache) {
+          Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiCodeCompletionResponseServedFromCache);
         }
-        if (suggestionText.length === 0) {
-          this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {});
-          return;
+
+        if (rpcGlobalId) {
+          const latency = performance.now() - startTime;
+          this.#registerUserImpression(rpcGlobalId, sampleId, latency);
         }
 
-        const remainderDelay = Math.max(DELAY_BEFORE_SHOWING_RESPONSE_MS - (performance.now() - startTime), 0);
-        // Delays the rendering of the Code completion
-        this.#renderingTimeout = window.setTimeout(() => {
-          // We are not cancelling the previous responses even when there are more recent responses
-          // from the LLM as:
-          // In case the user kept typing characters that are prefix of the previous suggestion, it
-          // is a valid suggestion and we should display it to the user.
-          // In case the user typed a different character, the config for AI auto complete suggestion
-          // will set the suggestion to null.
-          this.#editor.dispatch({
-            effects: TextEditor.Config.setAiAutoCompleteSuggestion.of({
-              text: suggestionText,
-              from: cursor,
-              rpcGlobalId: response.metadata.rpcGlobalId,
-              sampleId: response.generatedSamples[0].sampleId,
-            })
-          });
-          if (servedFromCache) {
-            Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiCodeCompletionResponseServedFromCache);
-          }
-          debugLog('Suggestion dispatched to the editor', response.generatedSamples[0], 'at cursor position', cursor);
-          if (response.metadata.rpcGlobalId) {
-            const latency = performance.now() - startTime;
-            this.#registerUserImpression(response.metadata.rpcGlobalId, response.generatedSamples[0].sampleId, latency);
-          }
-          const citations = response.generatedSamples[0].attributionMetadata?.citations;
-          this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {citations});
-        }, remainderDelay);
-      } else {
-        this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {});
-      }
+        debugLog('Suggestion dispatched to the editor', suggestionText, 'at cursor position', cursor);
+        this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {citations});
+      }, remainingDelay);
     } catch (e) {
       debugLog('Error while fetching code completion suggestions from AIDA', e);
       this.dispatchEventToListeners(Events.RESPONSE_RECEIVED, {});
@@ -289,7 +352,12 @@ export class AiCodeCompletion extends Common.ObjectWrapper.ObjectWrapper<EventTy
   /**
    * Removes the end of a suggestion if it overlaps with the start of the suffix.
    */
-  #trimSuggestionOverlap(generationString: string, suffix: string): string {
+  #trimSuggestionOverlap(generationString: string, request: Host.AidaClient.CompletionRequest): string {
+    const suffix = request.suffix;
+    if (!suffix) {
+      return generationString;
+    }
+
     // Iterate from the longest possible overlap down to the shortest
     for (let i = Math.min(generationString.length, suffix.length); i > 0; i--) {
       const overlapCandidate = suffix.substring(0, i);

package/front_end/models/cpu_profile/ProfileTreeModel.ts

@@ -12,7 +12,7 @@ export class ProfileNode {
   total: number;
   id: number;
   parent: ProfileNode|null;
-  children: ProfileNode[];
+  children: this[];
   functionName: string;
   depth!: number;
   deoptReason!: string|null;

package/front_end/models/extensions/ExtensionPanel.ts

@@ -69,6 +69,10 @@ export class ExtensionPanel extends UI.Panel.Panel implements UI.SearchableView.
     return false;
   }
 
+  supportsWholeWordSearch(): boolean {
+    return false;
+  }
+
   supportsRegexSearch(): boolean {
     return false;
   }

package/front_end/models/heap_snapshot_model/HeapSnapshotModel.ts

@@ -239,12 +239,16 @@ export class NodeFilter {
 export class SearchConfig {
   query: string;
   caseSensitive: boolean;
+  wholeWord: boolean;
   isRegex: boolean;
   shouldJump: boolean;
   jumpBackward: boolean;
-  constructor(query: string, caseSensitive: boolean, isRegex: boolean, shouldJump: boolean, jumpBackward: boolean) {
+  constructor(
+      query: string, caseSensitive: boolean, wholeWord: boolean, isRegex: boolean, shouldJump: boolean,
+      jumpBackward: boolean) {
     this.query = query;
     this.caseSensitive = caseSensitive;
+    this.wholeWord = wholeWord;
     this.isRegex = isRegex;
     this.shouldJump = shouldJump;
     this.jumpBackward = jumpBackward;

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -6088,7 +6088,7 @@ export const NativeFunctions = [
   },
   {
     name: "addAnimation",
-    signatures: [["animation"]]
+    signatures: [["animation","action","behavior"]]
   },
   {
     name: "removeAnimation",
@@ -6765,6 +6765,10 @@ export const NativeFunctions = [
     name: "DragEvent",
     signatures: [["type","?eventInitDict"]]
   },
+  {
+    name: "EmailVerifiedEvent",
+    signatures: [["type","?eventInitDict"]]
+  },
   {
     name: "ErrorEvent",
     signatures: [["type","?eventInitDict"]]
@@ -7605,7 +7609,7 @@ export const NativeFunctions = [
     signatures: [["element","x","y","?dwidth","?dheight"]]
   },
   {
-    name: "drawHTML",
+    name: "drawElementImage",
     signatures: [["element","x","y","?dwidth","?dheight"]]
   },
   {
@@ -8420,10 +8424,6 @@ export const NativeFunctions = [
     name: "RTCRtpScriptTransform",
     signatures: [["worker","?options","?transfer"]]
   },
-  {
-    name: "sendRtp",
-    signatures: [["packet","options"]]
-  },
   {
     name: "setHeaderExtensionsToNegotiate",
     signatures: [["extensions"]]
@@ -8891,7 +8891,7 @@ export const NativeFunctions = [
     signatures: [["provokeMode"]]
   },
   {
-    name: "texHTML2D",
+    name: "texElementImage2D",
     signatures: [["target","level","internalformat","format","type","element"]]
   },
   {

package/front_end/models/text_utils/TextUtils.ts

@@ -367,6 +367,32 @@ export const performSearchInSearchMatches = function(
   return result;
 };
 
+/**
+ * Finds the longest overlapping string segment between the end of the first
+ * string and the beginning of the second string.
+ *
+ * @param s1 The first string (whose suffix will be checked).
+ * @param s2 The second string (whose prefix will be checked).
+ * @returns The overlapping string segment, or an empty string ("")
+ * if no overlap is found.
+ */
+export const getOverlap = function(s1: string, s2: string): string|null {
+  const minLen = Math.min(s1.length, s2.length);
+  // Check from longest possible overlap down to 1
+  for (let n = minLen; n > 0; n--) {
+    // slice(-n) gets the last 'n' chars
+    const suffix = s1.slice(-n);
+    // substring(0, n) gets the first 'n' chars
+    const prefix = s2.substring(0, n);
+
+    if (suffix === prefix) {
+      return suffix;
+    }
+  }
+
+  return null;
+};
+
 export interface ParsedFilter {
   key?: string;
   text?: string|null;

package/front_end/models/trace/Processor.ts

@@ -443,7 +443,7 @@ export class TraceProcessor extends EventTarget {
       let model: Insights.Types.InsightModel|Error;
       try {
         options.logger?.start(`insights:${name}`);
-        model = insight.generateInsight(data, context);
+        model = insight.generateInsight(data, context, options.insightTimeFormatters);
         model.frameId = context.frameId;
         const navId = context.navigation?.args.data?.navigationId;
         if (navId) {

package/front_end/models/trace/helpers/Trace.ts

@@ -766,7 +766,7 @@ export function extractSampleTraceId(event: Types.Events.Event): number|null {
   return event.args?.sampleTraceId ?? event.args?.data?.sampleTraceId ?? null;
 }
 
-// This exactly matches EntryStyles.visibleTypes. See the runtime verification in maybeInitSylesMap.
+// This exactly matches Trace.Styles.visibleTypes. See the runtime verification in maybeInitStylesMap.
 // TODO(crbug.com/410884528)
 export const VISIBLE_TRACE_EVENT_TYPES = new Set<Types.Events.Name>([
   Types.Events.Name.ABORT_POST_TASK_CALLBACK,

package/front_end/models/trace/insights/DocumentLatency.ts

@@ -190,11 +190,14 @@ function finalize(partialModel: PartialInsightModel<DocumentLatencyInsightModel>
 }
 
 export function generateInsight(
-    data: Handlers.Types.HandlerData, context: InsightSetContext): DocumentLatencyInsightModel {
+    data: Handlers.Types.HandlerData, context: InsightSetContext,
+    timeFormatters?: Types.Configuration.InsightTimeFormatters): DocumentLatencyInsightModel {
   if (!context.navigation) {
     return finalize({});
   }
 
+  const millisToString = timeFormatters?.milli ?? i18n.TimeUtilities.millisToString;
+
   const documentRequest = data.NetworkRequests.byId.get(context.navigationId);
   if (!documentRequest) {
     return finalize({warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});
@@ -212,7 +215,8 @@ export function generateInsight(
     overallSavingsMs = Math.max(serverResponseTime - TARGET_MS, 0);
   }
 
-  const redirectDuration = Math.round(documentRequest.args.data.syntheticData.redirectionDuration / 1000);
+  const redirectDuration =
+      Math.round(documentRequest.args.data.syntheticData.redirectionDuration / 1000) as Types.Timing.Milli;
   overallSavingsMs += redirectDuration;
 
   const metricSavings = {
@@ -237,16 +241,14 @@ export function generateInsight(
         noRedirects: {
           label: noRedirects ? i18nString(UIStrings.passingRedirects) : i18nString(UIStrings.failedRedirects, {
             PH1: documentRequest.args.data.redirects.length,
-            PH2: i18n.TimeUtilities.millisToString(redirectDuration),
+            PH2: millisToString(redirectDuration),
           }),
           value: noRedirects
         },
         serverResponseIsFast: {
           label: serverResponseIsFast ?
-              i18nString(
-                  UIStrings.passingServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}) :
-              i18nString(
-                  UIStrings.failedServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}),
+              i18nString(UIStrings.passingServerResponseTime, {PH1: millisToString(serverResponseTime)}) :
+              i18nString(UIStrings.failedServerResponseTime, {PH1: millisToString(serverResponseTime)}),
           value: serverResponseIsFast
         },
         usesCompression: {

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

@@ -8,6 +8,7 @@ import type * as Protocol from '../../../generated/protocol.js';
 import type * as Lantern from '../lantern/lantern.js';
 
 import type * as File from './File.js';
+import type {Milli} from './Timing.js';
 
 export interface Configuration {
   /**
@@ -83,6 +84,17 @@ export interface ParseOptions {
     end: (id: string) => void,
   };
   lanternSettings?: Omit<Lantern.Types.Simulation.Settings, 'networkAnalysis'>;
+  /**
+   * Used when an Insight needs to format a time to string as part of its
+   * output. By default we use the i18n.TimeUtilities in DevTools but this
+   * enables it to be overridden, which is useful if you are consuming the trace
+   * engine outside of DevTools.
+   */
+  insightTimeFormatters?: InsightTimeFormatters;
+}
+
+export interface InsightTimeFormatters {
+  milli: (x: Milli) => string;
 }
 
 export interface ResolveSourceMapParams {

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -22,7 +22,6 @@ import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 import * as NetworkForward from '../network/forward/forward.js';
 import * as NetworkPanel from '../network/network.js';
 import * as TimelinePanel from '../timeline/timeline.js';
-import * as TimelineUtils from '../timeline/utils/utils.js';
 
 import aiAssistancePanelStyles from './aiAssistancePanel.css.js';
 import {
@@ -275,7 +274,7 @@ async function getEmptyStateSuggestions(
       ];
     case AiAssistanceModel.ConversationType.PERFORMANCE_INSIGHT:
     case AiAssistanceModel.ConversationType.PERFORMANCE_CALL_TREE: {
-      const focus = context?.getItem() as TimelineUtils.AIContext.AgentFocus | null;
+      const focus = context?.getItem() as AiAssistanceModel.AgentFocus | null;
       if (focus?.data.type === 'call-tree') {
         return [
           {title: 'What\'s the purpose of this work?', jslogContext: 'performance-default'},
@@ -433,7 +432,7 @@ function createRequestContext(request: SDK.NetworkRequest.NetworkRequest|null):
   return new AiAssistanceModel.RequestContext(request, calculator);
 }
 
-function createPerformanceTraceContext(focus: TimelineUtils.AIContext.AgentFocus|null):
+function createPerformanceTraceContext(focus: AiAssistanceModel.AgentFocus|null):
     AiAssistanceModel.PerformanceTraceContext|null {
   if (!focus) {
     return null;
@@ -710,7 +709,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
     this.#selectedRequest =
         createRequestContext(UI.Context.Context.instance().flavor(SDK.NetworkRequest.NetworkRequest));
     this.#selectedPerformanceTrace =
-        createPerformanceTraceContext(UI.Context.Context.instance().flavor(TimelineUtils.AIContext.AgentFocus));
+        createPerformanceTraceContext(UI.Context.Context.instance().flavor(AiAssistanceModel.AgentFocus));
     this.#selectedFile = createFileContext(UI.Context.Context.instance().flavor(Workspace.UISourceCode.UISourceCode));
     this.#updateConversationState({agent: this.#conversationAgent});
 
@@ -723,7 +722,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
     UI.Context.Context.instance().addFlavorChangeListener(
         SDK.NetworkRequest.NetworkRequest, this.#handleNetworkRequestFlavorChange);
     UI.Context.Context.instance().addFlavorChangeListener(
-        TimelineUtils.AIContext.AgentFocus, this.#handlePerformanceTraceFlavorChange);
+        AiAssistanceModel.AgentFocus, this.#handlePerformanceTraceFlavorChange);
     UI.Context.Context.instance().addFlavorChangeListener(
         Workspace.UISourceCode.UISourceCode, this.#handleUISourceCodeFlavorChange);
 
@@ -760,7 +759,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
     UI.Context.Context.instance().removeFlavorChangeListener(
         SDK.NetworkRequest.NetworkRequest, this.#handleNetworkRequestFlavorChange);
     UI.Context.Context.instance().removeFlavorChangeListener(
-        TimelineUtils.AIContext.AgentFocus, this.#handlePerformanceTraceFlavorChange);
+        AiAssistanceModel.AgentFocus, this.#handlePerformanceTraceFlavorChange);
     UI.Context.Context.instance().removeFlavorChangeListener(
         Workspace.UISourceCode.UISourceCode, this.#handleUISourceCodeFlavorChange);
     UI.ViewManager.ViewManager.instance().removeEventListener(
@@ -838,7 +837,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
       };
 
   #handlePerformanceTraceFlavorChange =
-      (ev: Common.EventTarget.EventTargetEvent<TimelineUtils.AIContext.AgentFocus>): void => {
+      (ev: Common.EventTarget.EventTargetEvent<AiAssistanceModel.AgentFocus>): void => {
         if (this.#selectedPerformanceTrace?.getItem() === ev.data) {
           return;
         }

package/front_end/panels/ai_assistance/components/ChatView.ts

@@ -14,7 +14,6 @@ import * as SDK from '../../../core/sdk/sdk.js';
 import * as AiAssistanceModel from '../../../models/ai_assistance/ai_assistance.js';
 import * as Workspace from '../../../models/workspace/workspace.js';
 import * as ElementsPanel from '../../../panels/elements/elements.js';
-import * as TimelineUtils from '../../../panels/timeline/utils/utils.js';
 import * as PanelUtils from '../../../panels/utils/utils.js';
 import * as Marked from '../../../third_party/marked/marked.js';
 import * as Buttons from '../../../ui/components/buttons/buttons.js';
@@ -1040,7 +1039,7 @@ function renderContextIcon(context: AiAssistanceModel.ConversationContext<unknow
   if (item instanceof Workspace.UISourceCode.UISourceCode) {
     return PanelUtils.PanelUtils.getIconForSourceFile(item);
   }
-  if (item instanceof TimelineUtils.AIContext.AgentFocus) {
+  if (item instanceof AiAssistanceModel.AgentFocus) {
     return html`<devtools-icon name="performance" title="Performance"></devtools-icon>`;
   }
   if (item instanceof SDK.DOMModel.DOMNode) {

package/front_end/panels/application/components/BackForwardCacheStrings.ts

@@ -3,6 +3,8 @@
 // found in the LICENSE file.
 
 import * as i18n from '../../../core/i18n/i18n.js';
+import type * as Platform from '../../../core/platform/platform.js';
+import type * as Protocol from '../../../generated/protocol.js';
 
 const UIStrings = {
   /**
@@ -552,7 +554,10 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('panels/application/components/BackForwardCacheStrings.ts', UIStrings);
 const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
 
-export const NotRestoredReasonDescription = {
+type NotRestoredReason =
+    Record<Protocol.Page.BackForwardCacheNotRestoredReason, {name: () => Platform.UIString.LocalizedString}>;
+
+export const NotRestoredReasonDescription: NotRestoredReason = {
   NotPrimaryMainFrame: {name: i18nLazyString(UIStrings.notMainFrame)},
   BackForwardCacheDisabled: {name: i18nLazyString(UIStrings.backForwardCacheDisabled)},
   RelatedActiveContentsExist: {name: i18nLazyString(UIStrings.relatedActiveContentsExist)},
@@ -567,6 +572,7 @@ export const NotRestoredReasonDescription = {
   JavaScriptExecution: {name: i18nLazyString(UIStrings.JavaScriptExecution)},
   RendererProcessKilled: {name: i18nLazyString(UIStrings.rendererProcessKilled)},
   RendererProcessCrashed: {name: i18nLazyString(UIStrings.rendererProcessCrashed)},
+  // @ts-expect-error kept for backwards compatibly
   GrantedMediaStreamAccess: {name: i18nLazyString(UIStrings.grantedMediaStreamAccess)},
   CacheFlushed: {name: i18nLazyString(UIStrings.cacheFlushed)},
   ServiceWorkerVersionActivation: {name: i18nLazyString(UIStrings.serviceWorkerVersionActivation)},
@@ -713,4 +719,4 @@ export const NotRestoredReasonDescription = {
       {name: i18n.i18n.lockedLazyString('CacheLimitPrunedOnModerateMemoryPressure')},
   CacheLimitPrunedOnCriticalMemoryPressure:
       {name: i18n.i18n.lockedLazyString('CacheLimitPrunedOnCriticalMemoryPressure')},
-};
+} as const;

package/front_end/panels/common/BadgeNotification.ts

@@ -21,16 +21,16 @@ const UIStrings = {
   /**
    * @description Title for close button
    */
-  dismiss: 'Dismiss',
+  close: 'Close',
   /**
    * @description Activity based badge award notification text
    * @example {Badge Title} PH1
    */
-  activityBasedBadgeAwardMessage: 'You earned the {PH1} badge! It has been added to your Developer Profile.',
+  activityBasedBadgeAwardMessage: 'You earned the {PH1} badge! It’s been added to your Developer Profile.',
   /**
    * @description Action title for navigating to the badge settings in Google Developer Profile section
    */
-  badgeSettings: 'Badge settings',
+  manageSettings: 'Manage settings',
   /**
    * @description Action title for opening the Google Developer Program profile page of the user in a new tab
    */
@@ -55,7 +55,7 @@ const UIStrings = {
   /**
    * @description Action title for enabling the "Receive badges" setting
    */
-  receiveBadges: 'Receive badges',
+  receiveBadges: 'Turn on badges',
   /**
    * @description Action title for creating a Google Developer Program profle
    */
@@ -103,10 +103,10 @@ const DEFAULT_VIEW = (input: ViewInput, _output: undefined, target: HTMLElement)
         class="dismiss notification-button"
         @click=${input.onCloseClick}
         jslog=${VisualLogging.action('badge-notification.dismiss').track({click: true})}
-        aria-label=${i18nString(UIStrings.dismiss)}
+        aria-label=${i18nString(UIStrings.close)}
         .iconName=${'cross'}
         .variant=${Buttons.Button.Variant.ICON}
-        .title=${i18nString(UIStrings.dismiss)}
+        .title=${i18nString(UIStrings.close)}
         .inverseColorTheme=${true}
     ></devtools-button>`;
 
@@ -114,7 +114,7 @@ const DEFAULT_VIEW = (input: ViewInput, _output: undefined, target: HTMLElement)
     <style>${badgeNotificationStyles}</style>
     <div class="container">
       <div class="badge-container">
-        <img class="badge-image" src=${input.imageUri}>
+        <img class="badge-image" role="presentation" src=${input.imageUri}>
       </div>
       <div class="action-and-text-container">
         <div class="label-container">
@@ -145,6 +145,8 @@ export class BadgeNotification extends UI.Widget.Widget {
     super(element);
     this.#view = view;
 
+    // eslint-disable-next-line
+    this.contentElement.role = 'alert';
     this.markAsRoot();
   }
 
@@ -240,7 +242,7 @@ export class BadgeNotification extends UI.Widget.Widget {
       message: i18nString(UIStrings.activityBasedBadgeAwardMessage, {PH1: badge.title}),
       actions: [
         {
-          label: i18nString(UIStrings.badgeSettings),
+          label: i18nString(UIStrings.manageSettings),
           onClick: () => {
             this.#close();
             revealBadgeSettings();