Add aria labeling to our markdown iframes

app/src/ui/lib/sandboxed-markdown.tsx

@@ -42,6 +42,10 @@ interface ISandboxedMarkdownProps {
   readonly markdownContext?: MarkdownContext
 
   readonly underlineLinks: boolean
+
+  /** An area label to explain to screen reader users what the contents of the
+   * iframe are before they navigate into them. */
+  readonly ariaLabel: string
 }
 
 interface ISandboxedMarkdownState {
@@ -378,6 +382,7 @@ export class SandboxedMarkdown extends React.PureComponent<
           className="sandboxed-markdown-component"
           sandbox=""
           ref={this.onFrameRef}
+          aria-label={this.props.ariaLabel}
         />
         {tooltipElements.map(e => (
           <Tooltip

app/src/ui/notifications/pull-request-comment-like.tsx

@@ -176,6 +176,7 @@ export abstract class PullRequestCommentLike extends React.Component<IPullReques
         onMarkdownLinkClicked={this.onMarkdownLinkClicked}
         markdownContext={'PullRequestComment'}
         underlineLinks={this.props.underlineLinks}
+        ariaLabel="Pull request markdown comment"
       />
     )
   }

app/src/ui/pull-request-quick-view.tsx

@@ -216,6 +216,7 @@ export class PullRequestQuickView extends React.Component<
           onMarkdownLinkClicked={this.onMarkdownLinkClicked}
           onMarkdownParsed={this.onMarkdownParsed}
           underlineLinks={this.props.underlineLinks}
+          ariaLabel="Pull request markdown body"
         />
       </div>
     )

app/src/ui/release-notes/release-notes-dialog.tsx

@@ -120,6 +120,7 @@ export class ReleaseNotes extends React.Component<IReleaseNotesProps, {}> {
         emoji={this.props.emoji}
         onMarkdownLinkClicked={this.onMarkdownLinkClicked}
         underlineLinks={this.props.underlineLinks}
+        ariaLabel="Release notes generated from markdown"
       />
     )
   }