[FilesApp-VS] Add aria role to feedback panels

The feedback panels can appear asynchronously during long running file
operations.

Add the aria role 'alert' to trigger screen readers to alert the user
when panels appear.

Bug: 1026501
Tests: browser_test --gtest_filter="*FilesDisplayPanel"
Change-Id: I7b6efd544b78ee23744950eb39e0c787125b14b8
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1925838
Commit-Queue: Noel Gordon <noel@chromium.org>
Reviewed-by: Noel Gordon <noel@chromium.org>
Cr-Commit-Position: refs/heads/master@{#716965}

ui/file_manager/file_manager/foreground/elements/files_xf_elements_unittest.js

@@ -142,6 +142,14 @@ function testFilesDisplayPanelErrorText() {
   // Add a panel item to the display panel container.
   const panelItem = displayPanel.addPanelItem('testpanel');
 
+  /** @type {!HTMLElement} */
+  const text = assert(panelItem.shadowRoot.querySelector('.xf-panel-text'));
+
+  // To work with screen readers, the text element containing
+  // parent element should have aria role 'alert'.
+  const textParent = text.parentElement;
+  assertEquals('alert', textParent.getAttribute('role'));
+
   // Change the primary and secondary text on the panel item.
   panelItem.primaryText = 'foo';
   panelItem.secondaryText = 'bar';

ui/file_manager/file_manager/foreground/elements/xf_panel_item.js

@@ -146,7 +146,7 @@ class PanelItem extends HTMLElement {
                 height: 68px;
               }
             </style>
-            <div class='xf-panel-item'>
+            <div class='xf-panel-item' role='alert'>
                 <xf-circular-progress id='indicator'>
                 </xf-circular-progress>
                 <div class='xf-panel-text'>