Merge pull request desktop#19684 from desktop/ignore-text-area-aria-l…

…abelling

Ignore Files text area aria labelling

app/src/ui/lib/text-area.tsx

@@ -46,6 +46,13 @@ interface ITextAreaProps {
 
   /** A callback to receive the underlying `textarea` instance. */
   readonly onTextAreaRef?: (instance: HTMLTextAreaElement | null) => void
+
+  /** Optional aria-label attribute */
+  readonly ariaLabel?: string
+
+  /** Optional aria-describedby attribute - usually for associating a descriptive
+   * message to the input such as a validation error, warning, or caption */
+  readonly ariaDescribedBy?: string
 }
 
 /** A textarea element with app-standard styles. */
@@ -84,6 +91,8 @@ export class TextArea extends React.Component<ITextAreaProps, {}> {
           onKeyDown={this.props.onKeyDown}
           ref={this.props.onTextAreaRef}
           onContextMenu={this.onContextMenu}
+          aria-label={this.props.ariaLabel}
+          aria-describedby={this.props.ariaDescribedBy}
         />
       </label>
     )

app/src/ui/repository-settings/git-ignore.tsx

@@ -15,7 +15,7 @@ export class GitIgnore extends React.Component<IGitIgnoreProps, {}> {
   public render() {
     return (
       <DialogContent>
-        <p>
+        <p id="ignored-files-description">
           Editing <Ref>.gitignore</Ref>. This file specifies intentionally
           untracked files that Git should ignore. Files already tracked by Git
           are not affected.{' '}
@@ -25,6 +25,8 @@ export class GitIgnore extends React.Component<IGitIgnoreProps, {}> {
         </p>
 
         <TextArea
+          ariaLabel="Ignored files"
+          ariaDescribedBy="ignored-files-description"
           placeholder="Ignored files"
           value={this.props.text || ''}
           onValueChanged={this.props.onIgnoreTextChanged}