Added aria-describedby to EuiFilePicker

CHANGELOG.md

@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added default prompt text to `aria-describedby` for EuiFilePicker ([#2919](https://github.com/elastic/eui/pull/2919))
 - Added SASS variables for text variants of the primary palette `$euiColorPrimaryText`, `$euiColorSecondaryText`, etc... Updated components to use these new variables. ([#2873](https://github.com/elastic/eui/pull/2873))
 - Updated SASS mixin `makeHighContrastColor()` to default `$background: $euiPageBackgroundColor` and `$ratio: 4.5`. Created `makeGraphicContrastColor()` for graphic specific contrast levels of 3.0. ([#2873](https://github.com/elastic/eui/pull/2873))
 
@@ -10,7 +11,6 @@
 
 ## [`20.0.0`](https://github.com/elastic/eui/tree/v20.0.0)
 
-- Converted `EuiComboBox`, `EuiComboBoxInput`, `EuiComboBoxPill`, `EuiComboBoxOptionsList`, `EuiComboBoxOption`, and `EuiComboBoxTitle` to TypeScript ([#2838](https://github.com/elastic/eui/pull/2838))
 - Converted `EuiCodeEditor` to TypeScript ([#2836](https://github.com/elastic/eui/pull/2836))
 - Converted `EuiCode` and `EuiCodeBlock` and to TypeScript ([#2835](https://github.com/elastic/eui/pull/2835))
 - Converted `EuiFilePicker` to TypeScript ([#2832](https://github.com/elastic/eui/issues/2832))

src/components/form/file_picker/__snapshots__/file_picker.test.tsx.snap

@@ -8,13 +8,15 @@ exports[`EuiFilePicker is rendered 1`] = `
     class="euiFilePicker__wrap"
   >
     <input
+      aria-describedby="i358365b0-58b5-11ea-be81-ff20ffc93721_358365b1-58b5-11ea-be81-ff20ffc93721"
       aria-label="aria-label"
       class="euiFilePicker__input"
       data-test-subj="test subject string"
       type="file"
     />
     <div
       class="euiFilePicker__prompt"
+      id="i358365b0-58b5-11ea-be81-ff20ffc93721_358365b1-58b5-11ea-be81-ff20ffc93721"
     >
       <div
         aria-hidden="true"

src/components/form/file_picker/file_picker.tsx

@@ -9,6 +9,7 @@ import { EuiProgress } from '../../progress';
 import { EuiIcon } from '../../icon';
 import { EuiI18n } from '../../i18n';
 import { EuiLoadingSpinner } from '../../loading';
+import { htmlIdGenerator } from '../../../services/accessibility/html_id_generator';
 
 const displayToClassNameMap = {
   default: null,
@@ -127,6 +128,12 @@ export class EuiFilePicker extends Component<EuiFilePickerProps> {
             ...rest
           } = this.props;
 
+          let promptId: string = htmlIdGenerator()();
+
+          if (id) {
+            promptId = `${id}-filePicker__prompt`;
+          }
+
           const isOverridingInitialPrompt = this.state.promptText != null;
 
           const normalFormControl = display === 'default';
@@ -198,10 +205,11 @@ export class EuiFilePicker extends Component<EuiFilePickerProps> {
                     onDragLeave={this.hideDrop}
                     onDrop={this.hideDrop}
                     disabled={disabled}
+                    aria-describedby={promptId}
                     {...rest}
                   />
                 </EuiValidatableControl>
-                <div className="euiFilePicker__prompt">
+                <div className="euiFilePicker__prompt" id={promptId}>
                   <EuiIcon
                     className="euiFilePicker__icon"
                     type="importAction"