RPP: add label to FRE dialog for auto annotations

Fixed: 406541372
Change-Id: I054a33b806f73f1346d8abebf62c48aa51ecd8dd
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6401153
Commit-Queue: Alina Varkki <alinavarkki@chromium.org>
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Alina Varkki <alinavarkki@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>

Author: jackfranklin

front_end/panels/common/common.ts

@@ -44,6 +44,7 @@ export class FreDialog {
     header,
     reminderItems,
     onLearnMoreClick,
+    ariaLabel,
   }: {
     header: {
       iconName: string,
@@ -54,8 +55,12 @@ export class FreDialog {
       content: Platform.UIString.LocalizedString|Lit.LitTemplate,
     }>,
     onLearnMoreClick: () => void,
+    ariaLabel?: string,
   }): Promise<boolean> {
     const dialog = new UI.Dialog.Dialog();
+    if (ariaLabel) {
+      dialog.setAriaLabel(ariaLabel);
+    }
     const result = Promise.withResolvers<boolean>();
     // clang-format off
     Lit.render(html`

front_end/panels/timeline/overlays/components/EntryLabelOverlay.ts

@@ -42,6 +42,10 @@ const UIStrings = {
    *@description Text displayed on a button that generates an AI label.
    */
   generateLabelButton: 'Generate label',
+  /**
+   *@description Label used for screenreaders on the FRE dialog
+   */
+  freDialog: 'Get AI-powered annotation suggestions dialog'
 } as const;
 
 /*
@@ -479,7 +483,7 @@ export class EntryLabelOverlay extends HTMLElement {
       try {
         // Trigger a re-render to display the loading component in the place of the button when the label is being generated.
         this.#isAILabelLoading = true;
-        await void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
+        void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
 
         this.#label = await this.#performanceAgent.generateAIEntryLabel(this.#callTree);
         this.dispatchEvent(new EntryLabelChangeEvent(this.#label));
@@ -512,6 +516,7 @@ export class EntryLabelOverlay extends HTMLElement {
    */
   async #showUserAiFirstRunDialog(): Promise<boolean> {
     const userConsented = await PanelCommon.FreDialog.show({
+      ariaLabel: i18nString(UIStrings.freDialog),
       header: {iconName: 'pen-spark', text: lockedString(UIStringsNotTranslate.freDisclaimerHeader)},
       reminderItems: [
         {

front_end/ui/legacy/Dialog.ts

@@ -103,6 +103,10 @@ export class Dialog extends Common.ObjectWrapper.eventMixin<EventTypes, typeof G
     Dialog.instance = null;
   }
 
+  setAriaLabel(label: string): void {
+    ARIAUtils.setLabel(this.contentElement, label);
+  }
+
   setCloseOnEscape(close: boolean): void {
     this.closeOnEscape = close;
   }