New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 738029 link

Starred by 2 users

Issue metadata

Status: Fixed
Owner:
Closed: Oct 12
Cc:
Components:
EstimatedDays: 1
NextAction: ----
OS: All
Pri: 3
Type: Bug
Team-Accessibility



Sign in to add a comment

PHP function names are not readable in devTools dark theme.

Reported by jlmi...@gmail.com, Jun 29 2017

Issue description

Chrome Version       : 59.0.3071.109
OS Version: 10.0
URLs (if applicable) :
Other browsers tested:
  Add OK or FAIL after other browsers where you have tested this issue:
     Safari 5:
  Firefox 4.x:
     IE 7/8/9:

What steps will reproduce the problem?
1. Open a PHP file in devTools
2. Switch to dark theme
3. type "function foo(bar){}"

What is the expected result?
The function name "foo" can be read.

What happens instead of that?
The dark-blue function name "foo" is completely not readable against the dark-gray background.

Please provide any additional information below. Attach a screenshot if
possible.

UserAgentString: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.109 Safari/537.36



 

Comment 1 by kochi@chromium.org, Jun 30 2017

Components: Platform>Apps>DevTools>Accessibility

Comment 2 by ajha@chromium.org, Jul 4 2017

Cc: ajha@chromium.org
Labels: Needs-Feedback
function foo is clearly readable for me on Windows-10, chrome version: 59.0.3071.115 with 'DevTools Theme: Zero Dark Matrix'. Attached is the screen-shot of the same.

jlmike7@: Could you please attach any screenshot of the issue. Also please mention the dark them used in your case.
738029_Readable.png
61.7 KB View Download

Comment 3 by jlmi...@gmail.com, Jul 5 2017

I am using the built-in dark theme that comes with Chrome.  (ellipsis menu -> settings -> theme dropdown -> dark)

Attached are some screenshots.
Capture.PNG
845 bytes View Download
Capture2.PNG
11.1 KB View Download
Project Member

Comment 4 by sheriffbot@chromium.org, Jul 5 2017

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "ajha@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Labels: Needs-Feedback
Tested the issue using latest stable #59.0.3071.115 Windows-10, Mac 10.12.5 and Linux Ubuntu 14.04 and was able to read the foo function.

Please find the attached screen cast and let us know your observations.

Thanks!!
Jul 6 2017 5-57 AM.webm
5.9 MB View Download

Comment 6 by jlmi...@gmail.com, Jul 6 2017

I apologize, I should have mentioned earlier that this is not in the JavaScript console.  This is when you open a PHP document in the Sources tab.
Capture.PNG
11.1 KB View Download
Capture2.PNG
5.0 KB View Download
Project Member

Comment 7 by sheriffbot@chromium.org, Jul 6 2017

Cc: sandeepkumars@chromium.org
Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "sandeepkumars@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Components: Platform>DevTools Platform>DevTools>UX
EstimatedDays: 1
Labels: -OS-Windows OS-All
NextAction: 2017-07-14
Status: Available (was: Unconfirmed)
The contrast here is extremely off.

The rule in question is for `cm-def` (`.cm-s-default .cm-def`) which I assume is short for definition targets. I personally find a cyanish color (rgb(0, 255, 184)) much more tasteful right off. I haven't checked any a11y rules regarding this though.
Selection_001.png
2.5 KB View Download
NextAction: ----

Comment 10 by jlmi...@gmail.com, Jul 13 2017

That new color looks perfect!  That is exactly what I was referring to.  Is this something that will be changed in future chrome updates, or something I will have to somehow change myself?
Owner: einbinder@chromium.org
Status: Assigned (was: Available)
Labels: a11y-secondary
Labels: -a11y-secondary win-a11y
Labels: a11y-secondary
Labels: -win-a11y
Project Member

Comment 16 by bugdroid1@chromium.org, Dec 15 2017

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

commit eb9d2f406efa17875900dd731dde8c62e28341d7
Author: Joel Einbinder <einbinder@chromium.org>
Date: Fri Dec 15 23:49:33 2017

DevTools: Improve dark theme syntax highlight colors

Some dark theme colors were being unintentionally overwritten by the
light theme. Some other colors were never defined in the dark theme.

Bug:  738029 
Change-Id: I161a23dbf296980af0c4f4a9fab49558e9941fd1
Reviewed-on: https://chromium-review.googlesource.com/826037
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#524524}
[modify] https://crrev.com/eb9d2f406efa17875900dd731dde8c62e28341d7/third_party/WebKit/Source/devtools/front_end/ui/inspectorSyntaxHighlight.css
[modify] https://crrev.com/eb9d2f406efa17875900dd731dde8c62e28341d7/third_party/WebKit/Source/devtools/front_end/ui/inspectorSyntaxHighlightDark.css

Status: Fixed (was: Assigned)

Sign in to add a comment