Add aria-activedescendant to listbox in select folder dialog

Bug: 406073540
Change-Id: I8feb7739d06752fb75235f29a6dc70a1a144677c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6450199
Reviewed-by: Ergün Erdoğmuş <[email protected]>
Auto-Submit: Samiya Caur <[email protected]>
Commit-Queue: Ergün Erdoğmuş <[email protected]>

Author: Samiya Caur

front_end/panels/ai_assistance/SelectWorkspaceDialog.ts

@@ -120,10 +120,13 @@ export class SelectWorkspaceDialog extends UI.Widget.VBox {
             ` : nothing}
           </div>
           ${hasFolders ? html`
-            <ul role="listbox" aria-label=${lockedString(UIStringsNotTranslate.selectFolder)} tabindex="0">
+            <ul role="listbox" aria-label=${lockedString(UIStringsNotTranslate.selectFolder)} tabindex="0"
+              aria-activedescendant=${input.folders.length > 0 ? `option-${input.selectedIndex}` : ''}>
               ${input.folders.map((folder, index) => {
+                const optionId = `option-${index}`;
                 return html`
                   <li
+                    id=${optionId}
                     @click=${() => input.onProjectSelected(index)}
                     class=${index === input.selectedIndex ? 'selected' : ''}
                     aria-selected=${index === input.selectedIndex ? 'true' : 'false'}