1124210 - Color picker hex color values should be copied as lowercase

Status: RESOLVED FIXED

(DevTools :: Inspector, defect)

Description

[Dane MacMillan [:danemacmillan]]

Given that nearly every CSS style guide in existence recommends using lowercase hex color values, the Developer Tools color picker should display all hex color values as lowercase, and more importantly, *copy* them as lowercase. Every time I scan through my code, I know immediately when a color value was copied from the color picker, because it is all in uppercase.

Mind you, even the Inspector's "Rules" and "Computed" tabs display hex color values as all uppercase. Those should be changed, too.

Uppercase hex color values are tantamount to uppercase HTML tags. Those days are behind us.

For reference, here are just a few style guides recommending lowercase hex color values:

Google:
- https://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml?showone=Capitalization#Capitalization

jQuery:
- http://contribute.jquery.org/style-guide/css/#formatting

Wordpress:
- https://make.wordpress.org/core/handbook/coding-standards/css/#properties

Codeguide.co:
- http://codeguide.co/#css-syntax

Comment 1

[Sandeep Murthy]

Attachment: Screencaps confirming bug #1124210 - color picker hex values in upper case in desktop Nightly Firefox Developer (Tools > Web Developer > Inspector)

Screencaps confirming bug #1124210 - color picker hex values in upper case in desktop Nightly Firefox Developer (Tools > Web Developer > Inspector)

Comment 2

[Sandeep Murthy]

This is true - color hex values are displayed upper case in almost all the inspector utilities in Tools for both the Nightly and standard Firefox versions, including the color picker. Have uploaded a tarball of a couple of screenscaps showing this in action.

Comment 3

[Sandeep Murthy]

Attachment: bug-1124210-sc2.png

screencap showing color picker hex values in upper case in desktop Nightly Firefox Developer (Tools > Web Developer > Inspector)

Comment 4

[Sandeep Murthy]

Attachment: bug-1124210-sc1.png

screencap showing color picker hex values in upper case in desktop Nightly Firefox Developer (Tools > Web Developer > Inspector)

Comment 5

[Tom Tromey :tromey]

As part of as-authored I plan to make this case-preserving.
Additionally, I think switching the default to lower case wouldn't hurt.

Comment 6

[Tom Tromey :tromey]

Attachment: preserve color case when using color picker

Comment 7

[Tom Tromey :tromey]

Attachment: preserve color case when using color picker

Updated more tests.

Comment 8

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Comment on attachment 8667469 [details] [diff] [review]
preserve color case when using color picker

Review of attachment 8667469 [details] [diff] [review]:
-----------------------------------------------------------------

These files are all my babies so it was nice to see these improvements.

All my fault for using .toUpperCase in css-color.js::hasAlpha().

Great job!

Comment 9

[Tom Tromey :tromey]

Attachment: preserve color case when using color picker

Updated for change in patch for bug 965181.

Comment 10

[Tom Tromey :tromey]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=fb4fbd6f6c44

Comment 11

[Pulsebot]

https://hg.mozilla.org/integration/fx-team/rev/a666cafe449f

Comment 12

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/a666cafe449f