1179876 - Add links to an "MDN error reference" from console errors

Status: RESOLVED FIXED

(DevTools :: Console, defect)

Description

[Florian Scholz (Open Web Docs)]

The web console emits thousands of error messages to web developers everyday. While seasoned web developers understand what is going on, especially beginners need help to understand them. Often the message gets copied, put into google, and answered on Stackoverflow.

What we could do is adding a [Learn More] link to error messages (like we already do for warnings, see CORS), so that we offer developers a direct way to get to know more about what just happened.

This could also be an icon to reduce the text noise (say a question mark in a circle).

More information is available in this etherpad: https://etherpad.mozilla.org/webconsole-mdn-error-msg and the discussion is happening here: https://groups.google.com/forum/#!topic/mozilla.dev.developer-tools/zUiTSyjIvOs

This bug is about the devtools implementation in the console.

The current [Learn More] function lives here: https://dxr.mozilla.org/mozilla-central/source/browser/devtools/webconsole/webconsole.js#1693

A link to the error docs could look like his:
https://developer.mozilla.org/docs/Web/JavaScript/Errors/JSMSG_BAD_RADIX

where "JSMSG_BAD_RADIX" is an "errorNumber" from https://dxr.mozilla.org/mozilla-central/source/js/src/js.msg

I will file a depended bug to get "errorNumber" added to nsIScriptError.

Comment 2

[Sylvestre Ledru [:Sylvestre]]

Release Note Request (optional, but appreciated)
[Why is this notable]: Great new features for developers - http://imgur.com/EOztwbI
[Suggested wording]: Console errors provide links to an "MDN error reference"
[Links (documentation, blog post, etc)]: having a doc would help

Comment 3

[Florian Scholz (Open Web Docs)]

Attachment: Add more doc links to console errors

Comment 4

[Morgan Phillips [:mrrrgn]]

Comment on attachment 8758019 [details] [diff] [review]
Add more doc links to console errors

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

So much \m/! :)

Comment 5

[Florian Scholz (Open Web Docs)]

Attachment: errordocs.patch

Okay, some more docs written. Let's land these :)

Comment 6

[Florian Scholz (Open Web Docs)]

Morgan, I updated the patch to include some more docs. Can you land this? I have no clue how to do that properly and might not have required permissions etc.

Comment 7

[Morgan Phillips [:mrrrgn]]

(In reply to Florian Scholz [:fscholz] (MDN) from comment #6)
> Morgan, I updated the patch to include some more docs. Can you land this? I
> have no clue how to do that properly and might not have required permissions
> etc.

No problem, will land the patch tonight.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/8203279f09e3
Permafails browser_webconsole_bug_653531_highlighter_console_helper.js; r=backout

Comment 9

[Morgan Phillips [:mrrrgn]]

Comment on attachment 8758916 [details] [diff] [review]
errordocs.patch

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

I did a poor job reviewing this my first pass through. There is a bug here that needs fixin' also the bug number in the commit message is wrong.

::: devtools/server/actors/errordocs.js
@@ +51,3 @@
>  };
>  
> +exports.GetURL = (errorName) => baseURL + ErrorDocs[errorName];

This should be something like:

exports.GetURL = (errorName) => {
    let doc = ErrorDocs[errorName];
    if (doc)
        return baseURL + doc;
    return undefined;
}

Otherwise every possible error will return a learn more link to baseURL/undefined.

Comment 10

[Morgan Phillips [:mrrrgn]]

s/possible error/error that doesn't have a doc url/

Comment 11

[Florian Scholz (Open Web Docs)]

Attachment: errordocs.patch

Comment 12

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/8203279f09e3

Comment 13

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/8203279f09e3

Comment 14

[Florian Scholz (Open Web Docs)]

Yup, this was backed out. Revised patch is attached. Sorry for the trouble.

Comment 15

[Morgan Phillips [:mrrrgn]]

Landing after this try run looks green enough: https://treeherder.mozilla.org/#/jobs?repo=try&revision=67615de240c4

Comment 16

[Marcia Knous [:marcia]]

Relnote 49+ with the suggested wording "Console errors provide links to an "MDN error reference"

Comment 17

[Marcia Knous [:marcia]]

(In reply to Marcia Knous [:marcia - use ni] from comment #16)
> Relnote 49+ with the suggested wording "Console errors provide links to an
> "MDN error reference"

I assume this will eventually be in https://developer.mozilla.org/en-US/Firefox/Releases/49#Changes_for_Web_developers, so when it lands there I can just point to it in the release notes if necessary.

Comment 18

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/b9e7c2e445f4
Add more doc links to console errors; r=mrrrgn

Comment 19

[Carsten Book [:Tomcat]]

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

Comment 20

[Sebastian Zartner [:sebo]]

Florian, is https://developer.mozilla.org/en-US/Firefox/Releases/49#Developer_Tools enough, or should it also be mentioned somewhere else?

Sebastian

Comment 21

[Sebastian Zartner [:sebo]]

Well, I've also added a note here now:
https://developer.mozilla.org/en-US/docs/Tools/Web_Console/Console_messages#JS

Sebastian

Comment 22

[Florian Scholz (Open Web Docs)]

Thanks Sebastian! I've updated the docs with a link to the Hacks blog post and added the gif showing the feature to the console page.

(In reply to Marcia Knous [:marcia - use ni] from comment #17)
> (In reply to Marcia Knous [:marcia - use ni] from comment #16)
> > Relnote 49+ with the suggested wording "Console errors provide links to an
> > "MDN error reference"
> 
> I assume this will eventually be in
> https://developer.mozilla.org/en-US/Firefox/Releases/
> 49#Changes_for_Web_developers, so when it lands there I can just point to it
> in the release notes if necessary.

https://hacks.mozilla.org/2016/06/helping-web-developers-with-javascript-errors/ has the best summary of this feature. I would link to this blog post from the release notes.

Comment 23

[Sylvestre Ledru [:Sylvestre]]

49 release notes updated with a link to the blog post, thanks!

Comment 24

[Mohammad Maruf Rahman]

This bug as about to implement "links to an 'MDN error reference' from console errors" as mentioned as #comment0 . I have seen the features being implemented with Beta 49.0 on Windows 7, 64 Bit !

This bug's fix is verified with latest Beta 49.0

Build   ID  20160912134115
User Agent  Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:49.0) Gecko/20100101 Firefox/49.0

[bugday-20160914]