Color name grey vs gray

https://learn.freecodecamp.org/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once

The spelling grey failed the tests even though now both British English grey and American English gray spellings work in CSS.

2 Likes

The instructions explicitly say to use “gray” because the tests look at the actual text you enter. Following the instructions is one of the requirements.

1 Like

I get it, but it would be super for it to work with both spellings.
Austin Powers would approve.

1 Like

Despite being a Brit, I agree with @ArielLeslie . Try using the spelling “colour” and you’ll quickly find that not all British English spellings work — it’s only pure luck that “grey” does.

Being able to follow arbitrary instructions to the letter is one of the less fashionable skills in the programmer skillset, but it’s just as essential as logical thinking or creative problem solving. The fact that this arbitrary requirement is imposed by fCC and not W3C or WHATWG makes no difference — you still have to follow it within its applicable domain (in this case, the challenge in question).

It’s a misspelling surely? It should just accept the correct spelling, “grey”. Might as well include teaching students proper English in the FCC remit. Should be easy enough to implement, there’s even a handy plugin for the rest of the CSS to make sure it’s all using the correct spellings, I’m sure there’s something similar for the JS

Definitely something PR-worthy I think

2 Likes

You could solve this issue by changing the required color/colour in the test to something unambiguous other than gray/grey.
I’m sure there is probably some UI guideline about reducing ambiguity for the user.
All I can say is at some point grey was added in CSS named colours so therefore to write a test that doesn’t accept this is in my opinion, lazy.
Nothing to do with “pure luck”. :smile:
As you can see, both spellings are accepted for all shades of grey/gray:
https://www.w3schools.com/Colors/colors_names.asp
named colors defined by SVG 1.1 : [https://www.w3.org/TR/SVG/types.html#ColorKeywords]
Roughly when it was added: https://youtu.be/HmStJQzclHc?t=3m26s

I think the issue here for me is the principal that I wrote some valid code that works but it failed the test. So maybe the person who wrote the test did not realise this?
To say “you didn’t read the instructions properly” is kind of a cop out.

Queen Liz would be proud :joy: :tophat: :uk:

On the other hand… if the challenge explicitly tells you to use incorrect American spellings, I don’t see any ambiguity in that. If you’re using a library that contains a misspelled method, you still have to spell it consistently with the library method, or your code won’t run.

If the test case said “the --penguin-skin variable should be set to a color with a value of rgb(128,128,128)” and didn’t accept grey, you’d have a point. But instead, the test case says “penguin class should declare the --penguin-skin variable and assign it to gray.” I’d say that’s extremely unambiguous.

1 Like

I think you completely missed the point. The point of raising this issue in the first place is to “improve” the challenge.
My suggestion to “improve” the challenge would be to accept both spellings but if that’s too difficult to implement, no problem.

Ultimately, it’s an open design question as to whether this should be changed. The mantra “be conservative in what you send and liberal in what you accept” is as widely repeated as it is rebutted.

If you feel strongly enough about it, I’d recommend opening an issue and submitting a pull request yourself if you can.

I don’t feel adding 1 extra valid case is being “liberal in what you accept”.
As for opening an issue, it’s ok. I will leave this suggestion here and see if anyone else agrees with me.

I would be interested in why you think they added the acceptance of the different spelling in the first place?

PS. I’m not sure what the links you added relate to. They seem to be about Internet Protocols where I am discussing improving a unit test.

Well, it’s more liberal than accepting only 1 possible answer. Just a matter of degree.

If by “they” you mean W3C including it in the CSS spec, it looks like it was originally added to increase compatibility with the SVG spec:

The table below provides a list of the X11 colors [X11COLORS] supported by popular browsers with the addition of gray/grey variants from SVG 1.0.

They relate to the principle of being conservative in what you send and liberal in what you accept. Again… it’s an open design question as to how far you should take this principle. Internet protocols are just one example of a domain to which it’s been applied.

I still don’t know what this means. Send what? Receive what? Who’s doing the sending?

PS. In future I’m not bothering to submit feedback on the course. :zipper_mouth_face:

Sorry, I should’ve been clearer. Sometimes, the words used are “input” and “output” or other equivalents.

In the case in question, W3C (and browser implementations of CSS) are being “liberal in what they accept [as input]” by allowing aliases for some of the color names. Meanwhile, being “conservative in what you input [or send]” would mean using the canonical name (“gray”) in your code, just in case the alias isn’t supported in some old browsers or something.

The challenge, meanwhile, is somewhat more conservative in what it accepts. That may or may not be a conscious design decision (I suspect it was mainly due to ease of implementation).

That’s up to you, but again, I’d recommend submitting any feedback via the issue tracker on the GitHub repo, rather than here. Many of the main fCC contributors don’t read the forums (and if they do, they don’t use them for issue tracking), so it’s pretty unlikely posting here will lead to anything being changed.

I agree, a Github issue should be created and it can be discussed. I see value in having the requirements changed in some manner for the challenge if it can cause confusion to “non-American English” students.

A change to the test should be pretty simple.
But just avoiding the use of gray may make sense also. But that may affect multiple challenges.