Bug 1424156 part 1: Don't treat Web Console input from the user as live content for accessibility. r=nchevobbe
authorJames Teh <jteh@mozilla.com>
Wed, 03 Jan 2018 09:52:17 +1000
changeset 452631 9484bc0662465437abf4b57055936c8d3aed0321
parent 452630 7c76e6168da792f17188dd7e5d260830286f18cb
child 452632 a13e4aa506889920d674306c95eda760a2a29ffa
push id1648
push usermtabara@mozilla.com
push dateThu, 01 Mar 2018 12:45:47 +0000
treeherdermozilla-release@cbb9688c2eeb [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersnchevobbe
bugs1424156
milestone59.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1424156 part 1: Don't treat Web Console input from the user as live content for accessibility. r=nchevobbe Commands entered by the user now get the aria-live="off" attribute. This stops screen readers from echoing commands the user typed, which is redundant and inefficient. MozReview-Commit-ID: GJXiBPMe0W5
devtools/client/webconsole/new-console-output/components/Message.js
--- a/devtools/client/webconsole/new-console-output/components/Message.js
+++ b/devtools/client/webconsole/new-console-output/components/Message.js
@@ -9,17 +9,17 @@
 // React & Redux
 const { Component, createFactory } = require("devtools/client/shared/vendor/react");
 const dom = require("devtools/client/shared/vendor/react-dom-factories");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 const { l10n } =
   require("devtools/client/webconsole/new-console-output/utils/messages");
 const actions =
   require("devtools/client/webconsole/new-console-output/actions/index");
-const { MESSAGE_SOURCE } =
+const { MESSAGE_SOURCE, MESSAGE_TYPE } =
   require("devtools/client/webconsole/new-console-output/constants");
 const CollapseButton =
   require("devtools/client/webconsole/new-console-output/components/CollapseButton");
 const { MessageIndent } =
   require("devtools/client/webconsole/new-console-output/components/MessageIndent");
 const MessageIcon =
   require("devtools/client/webconsole/new-console-output/components/MessageIcon");
 const MessageRepeat =
@@ -240,17 +240,18 @@ class Message extends Component {
 
     const bodyElements = Array.isArray(messageBody) ? messageBody : [messageBody];
 
     return dom.div({
       className: topLevelClasses.join(" "),
       onContextMenu: this.onContextMenu,
       ref: node => {
         this.messageNode = node;
-      }
+      },
+      "aria-live": type === MESSAGE_TYPE.COMMAND ? "off" : "polite"
     },
       timestampEl,
       MessageIndent({indent}),
       icon,
       collapse,
       dom.span({ className: "message-body-wrapper" },
         dom.span({ className: "message-flex-body" },
           // Add whitespaces for formatting when copying to the clipboard.