New issue
Advanced search Search tips

Issue 800149 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Feb 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Chrome , Mac
Pri: 2
Type: Bug



Sign in to add a comment

MD Extensions: Error Console: A11y: Unhelpful code snippet

Project Member Reported by hcarmona@chromium.org, Jan 9 2018

Issue description

Steps to reproduce:
1. Enable Dev Mode
2. Install attached extension
3. Click the "Errors" button

Expected:
App is a joy to use

Actual:
One of the first items in the page is a block of line numbers (unlabeled) followed by a block of code (also unlabeled)
 
errors.zip
851 bytes Download
My plan to address this is to aria-hidden="true" for the entire code snippet as it's not helpful and context is disconnected from the error for screen reader users.

Attaching screenshot of section that will be hidden from a11y.

There is still a link to open in developer mode and a stack trace that shows where in the code the error came from, so I don't believe functionality will be impacted.

lpalmaro@ do you have any objections against this?
hiding.png
68.3 KB View Download
After off-bug chat with lpalmaro@ we will be creating a prototype to see if we can make this code snippet more accessible to keep feature parity.

This section should be:
 - Useful (Let user know what line is highlighted)
 - Not annoying (Allow to easily skip section)
 - Have keyboard navigation for up/down
Cc: bettes@chromium.org
Screenshot for change. Highlight had to change format.
+bettes for UX feedback
updated-highlight.png
41.3 KB View Download
Project Member

Comment 4 by bugdroid1@chromium.org, Feb 2 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0

commit 5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0
Author: Hector Carmona <hcarmona@chromium.org>
Date: Fri Feb 02 01:09:28 2018

MD Extensions: A11y - Make code snippet more accessible.

Screenshot in Bug.

Bug:  800149 
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ic439125d601f66904ec3c5dfb30d71b1a45fec5f
Reviewed-on: https://chromium-review.googlesource.com/884998
Reviewed-by: Devlin <rdevlin.cronin@chromium.org>
Reviewed-by: David Tseng <dtseng@chromium.org>
Commit-Queue: Hector Carmona <hcarmona@chromium.org>
Cr-Commit-Position: refs/heads/master@{#533886}
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/app/md_extensions_strings.grdp
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/browser/resources/md_extensions/code_section.html
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/browser/resources/md_extensions/code_section.js
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/browser/resources/md_extensions/compiled_resources2.gyp
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/browser/ui/webui/extensions/extensions_ui.cc
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/test/data/webui/extensions/cr_extensions_browsertest.js
[modify] https://crrev.com/5e94fbb88e7870ea45ae1d7fcb3349f859f1a0c0/chrome/test/data/webui/extensions/extension_code_section_test.js

Yellow LGTM
Status: Fixed (was: Started)

Sign in to add a comment