Closed Bug 67647 Opened 20 years ago Closed 20 years ago

[RFE] Make JavaScript Console more useful

Categories

(Core Graveyard :: Error Console, enhancement)

enhancement
Not set
normal

Tracking

(Not tracked)

VERIFIED FIXED
mozilla0.8.1

People

(Reporter: hewitt, Assigned: hewitt)

References

Details

Attachments

(9 files)

I got the sudden urge on friday night to make the js console more useful, and so
it became my weekend project.  I set out to add a couple features but wound up
practically rewriting it from scratch. In addition to the new features, I
cleaned up the UI of quite a bit.  The new features are:

* You can copy selected rows to the clipboard 

* The erroneous line of code, if available, is underlined with an arrow pointing
to the column where the error occured (like in 4.x console)

* Clicking on the source file will open it up in the view source window

* A new type of item, a "Message" is supported.  This is just a straight block
of text that has been dumped to the console using nsIConsoleService.  Useful for
debugging in optimized builds when you can't use dump()

* The good ol' javascript entry field from the 4.x console is back

* You can sort the console so that incoming messages appear at either the top or
the bottom
Blocks: 53480
Status: NEW → ASSIGNED
Sorry for the spam, but many thanks for all these great features!!! 
*** Bug 67602 has been marked as a duplicate of this bug. ***
please change [in w3 recommended, but violation of ietf namespace]
language="javascript" => type="text/javascript"

+        <menu value="&toolbarsCmd.label;" accesskey="&toolbarsCmd.accesskey;">
+                         <menupopup> 
eek, tabs :-(

\ No newline at end of file
eek.

And now i'm going to apply and use this wonderful patch!!
Two minor things that worry me from the screenshot:

- white/grey alternation in lists is often used to make rows (or groups of two 
rows) more visible and easier to follow.  The screenshot shows a white "row" 
and a grey "row" as part of the same message.  That might be a little 
misleading.

- I see blocks at the end of the "erroneous lines".  Are those newline 
characters?
hewitt: did you remove the Index: lines from this patch? It makes applying the
patch very hard. After I added them back, I still couldn't apply cleanly, for
some reason it barfs on consoleBindings.xml. Would you mind attaching an updated
patch? Thanks :-)
Thanks, everyone, for the excellent feedback.  The forthcoming patch
incorporates all of your suggestions, and tweaks a few more things to perfection.
Attached patch patch, rev2Splinter Review
Surely Console:Clear should not be a type="radio" menuitem?
(not that it is ever checked, so no-one will notice :-)
I'll add these here becuase you might have noticed and/or fixed these already:
1. Clicking Warnings or Errors hides but does not collapse other messsages.
2. No keyboard accelerators (Ctrl+W etc).
The only thing that I don't consider finished about my patch is the way that
type-in javascript in the toolbar is executed.  I'm just using eval, which is
problematic because if there's an error in the code it will show up in the
console as being from chrome://global/content/console.js, which is obviously
wrong.  There should be no source document.  I'll have to figure out a good way
to execute js code "anonymously" without crediting a document, the same way it's
done if you type a url into navigator like "javascript: blah()"
Chatzilla wraps its eval() call  (for the /eval command) in a try/catch.  You
could try changing the fileName property of the exception and rethrow it (I'm
not positive that'd work), or just print the error to the console.

You probably want to check that the fileName and lineNo properties of the
exception line up with the eval() call, so you don't hide exceptions thrown from
functions called by the eval().
Is it possible to change the fileName property of exceptions in Javascript? I
thought our exception objects were just strings?
A thought I have, which I'm not sure will work, but which I am sure is a hack,
is to put a hidden iframe or browser in the xul and pass it a javascript url. 
Or perhaps there's an easier way to pass a javascript url to some other sort of
url loader.
Exceptions can be any jsval.  The engine throws Error objects, which look
something like this...

+ message (string) 'missing ; before statement'
+ fileName (string) 'chrome://chatzilla/content/handlers.js'
+ lineNumber (number) 1027
+ name (string) 'SyntaxError'
*
I changed the script evaluation so that it uses an iframe to evaluate the
script, rather than using eval().  This gives a nice clean evaluation with an
independent js context, so that the evaluated script doesn't have access to the
dom of the console window.  

Can I please get some reviewage for the updated patch? I need to check this in
by Thursday because of the localization freeze (because I added several labels).
Attached patch patch, rev3Splinter Review
Thanks to jag for a thorough review of this bug.  I've made a batch of changes
at his request, and received a gracious r=jag.  Here comes the latest patch. 
sr= anyone?
Attached patch patch, rev4Splinter Review
One final comment:

+            msg += "\n" + strBundle.getString("errFile") + " " +
this.getAttribute("url") +
+                   "\n" + strBundle.getString("errLine") + " " +
this.getAttribute("line");

Instead of that you you should use something like:

errFile=Source file: %S
errLine=Source line: %S

and then in your JS:

+            msg += "\n" + strBundle.getFormattedString("errFile",
[this.getAttribute("url")]) +
+                   "\n" + strBundle.getFormattedString("errLine",
[this.getAttribute("line")]);

etc.

You could (should?) probably use it for errSeparator too (errSeparator=, %S),
though you may want to consult i18n on this.
combining two intl formatted strings is probably a big NoNo.

errLocation=Source file: %S; line: %S
this way, if some language needs RTL vs LTR they can do it.
+    if (frame.filename)
+      str += frame.filename + ", Line " + frame.lineNumber;

Is getStackTrace debugging code?

+          if (this.hasAttribute("line") && this.hasAttribute("url")) {
+            msg += "\n" + strBundle.getString("errFile") + " " +
this.getAttribute("url") +  
+                   "\n" + strBundle.getString("errLine") + " " +
this.getAttribute("line");
+            if (this.hasAttribute("col")) {
+              msg += strBundle.getString("errSeparator") + " " +
+                     strBundle.getString("errColumn") + " " +
this.getAttribute("col");
+            }

So thinking about this, you have something like:
File: <filename>
Line: <linenr>[, Column: <colnr>]

So have:

errLine=Line: %S
errLineCol=Line: %S, Column: %S

and then make the js select the right one to format with:

  [this.getAttribute("line")]

and

  [this.getAttribute("line"), this.getAttribute("col")]

respectively. And then you can get rid of errSeparator.
I've seen revs 6,834; 170,145; and 800,001; but I have no idea what happened to
the rest.

r=jag on rev 1,000,000.
Blocks: 48210
This is great, but one small issue, why didn't you changed year to 2001?

> Copyright (C) 1998-1999 Netscape Communications Corporation. All
> Rights Reserved.


bad:
+  <script language="javascript" 
src="chrome://global/content/strres.js"></script>
much less bad:
+<script type="text/javascript" 
src="chrome://global/content/globalOverlay.js"/>
fixed. woohoo!
Status: ASSIGNED → RESOLVED
Closed: 20 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla0.8.1
If you right click on a link in the console, a new window opens. I link to be
able to copy that link into the urlbar, can that be done?
I can't use the links at all, because mozilla won't recognise the js mime type.
Is that because
a) I need to associate .js files with the right type
b) I need to upgrade from build 2001031008
c) Some other bug needs fixing?
I think it's 'c'
Currently recommended:
<script type="application/x-javascript" 
src="chrome://global/content/globalOverlay.js"/>
Sorry for not commenting about the change.
Neil, I think that's bug 77080, "Show application/x-javascript in browser 
window instead of trying to download."
Verify fixed for quite a while now.  :)
Status: RESOLVED → VERIFIED
Component: JavaScript Debugger → JavaScript Console
QA Contact: rginda → caillon
[RFE] is deprecated in favor of severity: enhancement.  They have the same meaning.
Severity: normal → enhancement
Product: Core → SeaMonkey
Product: SeaMonkey → Core Graveyard
You need to log in before you can comment on or make changes to this bug.