Console log message to prevent self xss

[kloon]

This adds a developer console message informing the user about the possibility of a self XSS attack if they were asked to enter a value in the console.

This closes #15, it could do with additions like translating the string based on locale and checking if the console support colors and styles, the latter only possible via user agent checking, unfortunately.

Could also be useful to setup a page on wordpress.com explaining self XSS and then linking to that page.

[matticbot]

Test live: https://calypso.live/?branch=add/console-log-self-xss-warning

[gziolo]

There is also #11625 opened with a similar change. We should land one of the solutions. @dmsnell you reviewed the other PR, so it would be nice to finally one of the solutions.

[spen]

What do you think about a "We're hiring" nudge in this?
Something with the sentiment of: "Don't do continue if you don't know what you're doing, but if you do come and join in"

It could just confuse people since it gives mixed messages, so it might not be a great idea 🤷‍♂️

[kloon]

@spen I thought about adding the hiring message but figured it would not go well with the message about self XSS. There's also a x-hacker header with details about hiring on all wp.com pages x-hacker:If you're reading this, you should visit automattic.com/jobs and apply to join the fun, mention this header.

[belcherj]

LGTM, might be good to wait for another review tho

[gziolo]

Agree, it would be nice to get thumbs up from @nb or @ehg before merging this change.

[spen]

Thanks @kloon, I think that make sense so as not to confuse folks :)

Another consideration might be to suppress the message in non-production environments - I'm not sure the best path for doing so in our jade templates, and not sure if this would cause more problems than it solves.

[gziolo]

@hoverduck, does it solve #15 as you expected?

[hoverduck]

@gziolo - Yes, this generally solves #15, although @allendav was the original author...I only ported the issue over from the pre-oss repo 😄

A couple issues, though -
It works fine in Chrome, but I checked IE11 and it doesn't show up. Those were the only browsers I looked at.

And just a nit-pick, but I'd update it to say "This browser feature is intended for developers" (singular) instead of "This browser features is intended for developers" (plural)

[allendav]

Grammar nit: features should probably be feature

Edit: lol - sorry - I see @hoverduck caught that already too

[allendav]

One small change requested. Works well. Pre-approving.

[dmsnell]

@folletto or @melchoyce or @adambbecker or someone could we get some design review of the text here as this will be public-facing communication from Automattic?

a part of me feels like it's too dread-serious for most of our other communication.

[folletto]

Let's just tag Editorial ;)

[michelleweber]

It's okay to be serious when there are potentially bad consequences! That said, I would tweak a bit to give people a little more context about why this is potentially bad:

Wait! This browser feature runs code that can alter your website or its security, and is intended for developers. If you've been told to copy and paste something here to enable a feature, someone may be trying to compromise your account. Please make sure you understand the code and trust the source before adding anything here.

[dmsnell]

Please make sure you understand the code and trust the source before adding anything here.

Thanks @michelleweber! I like how your wording acknowledges that the console can still be useful (we're not trying to forbid people from using it) and that some people will have the right/skill/know-how to get in there and dig around (while still warning off people who may be mislead by something they read online).

[dmsnell]

@kloon and @gziolo I updated this PR to match the text which @michelleweber suggested. If we are okay with it we should probably just merge it

[gziolo]

Yes, feel free to merge 👍

[stephanethomas]

Could we disable this message in development? We have already enough warnings popping up in the console in this environment. And I suspect that if you use the latter, you already know what you're doing.

[kwight]

This does feel very distracting and unnecessary in the development environment; #19355 to remove.