Developers › Opera Dragonfly blog
Early look at upcoming features: "pretty print", function return values, UPnP
The blog may have been a bit quiet in recent weeks, but the Opera Dragonfly team has certainly not been idly sitting around twiddling their thumbs. There are some nice little features being worked on behind the scenes, but unfortunately they're not quite ready to be pushed to the experimental channel just yet, as they require actual changes to the underlying browser architecture itself...but here's a short video teaser, where I run through some of the new features in what we call a GOGI build. You'll notice that the interface of these builds is very spartan, to say the least, but we use these builds internally at Opera to test core functionality, before any of the regular browser UI is applied.
The three features showcased in this video are:
- "pretty print" functionality to reformat JavaScript – particularly useful when analysing and debugging minified scripts
- an enhancement to the JavaScript inspection panel, which now shows any functions that executed – and their return values – when stepping through code in the debugger
- improved remote debugging workflow using UPnP (Universal Plug and Play) to automatically find instances of Opera Dragonfly listening on the local network, without the need to enter manual IP addresses in
opera:debug
We can't make any promises as to when you're going to start to see these features appearing in an experimental build, because of the underlying core browser changes that are required. Nonetheless we're very excited to be showing you these features at this early stage, and we'd really welcome your feedback and suggestions. Thank you.
Readers' comments 44
Left under the original article, as archived.
About this article
| Published in | Opera Dragonfly blog |
|---|---|
| Date | April 13, 2012 |
| Author | Patrick H. Lauke |
| Tags | pretty print, remote debugging, gogi, experimental, upnp |
| Original | Internet Archive |
Martin KadlecFriday, April 13, 2012 1:42:35 PM
BUT! Please, please give as at least option (if not default) to make the pretty print put the opening brace to the end of the line and not on the new line. JavaScript is not C++.
Also, it would be nice to have tooltip on the line numbers (when pretty print is active) to see the original line number.
Spadar ShutFriday, April 13, 2012 2:00:24 PM
Originally posted by BS-Harou:
Probably this could be useful, but it seems to me that original line number most of the time will be equal to 1
D1sasterp1eceFriday, April 13, 2012 2:12:54 PM
It's just that we may not see this in a regular build soon, because it certainly got my interest.
QuHnoFriday, April 13, 2012 2:47:24 PM
Originally posted by BS-Harou:
+1
may be we can get the same settings for braces like in the classic Javascript beautifier?
Christian KrebsFriday, April 13, 2012 3:48:59 PM
RafalFriday, April 13, 2012 4:00:45 PM
Originally posted by BS-Harou:
I don't understand that remark about Javascript not being C++. It's a matter of style; either one of them seems to be good for any of these languages, depending on taste.
Originally posted by BS-Harou:
What Spadar Shut wrote will probably be the case most often.
There is also a feature in place (wasn't mentioned in the video) that makes it possible to define a user function which will be used to determine whether script appears to be minified. Depending on the outcome of this function, the script can not be pretty-printed even if that option is enabled. That should make sure that your own scripts or just scripts that are not minified stay in their original form.
[was too late
DmitriyFriday, April 13, 2012 4:26:01 PM
Originally posted by BS-Harou:
+1
Or give the option to choose the desired option
Martin KadlecFriday, April 13, 2012 4:47:37 PM
Originally posted by aleto:
But we can still click the button to get pretty print of any script, right?
Originally posted by SpShut:
Originally posted by d.i.z.:
You are right, but sometimes I might want to use pretty print on badly written javascript just to make it more readable. Then it would be really useful
Originally posted by d.i.z.:
Yes and no
1) C++ use lot's of keywords and options in fn argument definition:
int MyFn( struct Person ** myPersons[][300] = (struct Person **) defaultPersons, ..............)
So the function argument definitions are often on more lines anyway and the new line for opening brace doesn't harm anyone. In javascript I almost never use more lines for the fn arguments definition.
2) C++ doesn't use braces for objects definitions. At least not in a way javascript does. So in C++ you don't have to think about whether the braces are there for block or for object definition - unlike in js.
3) Also in this video: http://www.youtube.com/watch?v=hQVTIJBZook&feature=player_detailpage#t=1843s Crockford explains another reason why the opening braces should be in js at the end of the line.
Christian KrebsFriday, April 13, 2012 5:02:05 PM
Originally posted by BS-Harou:
Smart pretty-print will be an additional setting. Pretty-print on will be smart or not depending on that setting.
IllusionMHFriday, April 13, 2012 5:44:44 PM
Can't wait to use new inspection panel enhancement
Originally posted by BS-Harou:
It would be very useful
Martin RauscherFriday, April 13, 2012 7:20:50 PM
Michael A. Puls IISaturday, April 14, 2012 5:10:11 AM
Originally posted by BS-Harou:
Hell Yeh! + 1Constantine VesnaSaturday, April 14, 2012 4:52:05 PM
All the new features are nice.
Looking forward to see them in experimental builds.
p.s.: any update on Profiler build ? Chrome-like edit and ability to save changes to files ? any possibility of Animation debugger ? should we hope for a gradient editor (something like existing css color editor) ? simple wysiwyg transform editor (Adobe style) ? any debuggers for other new APIs like FileAPI, WebGL, video/audio or getUserMedia ?
MaximSaturday, April 14, 2012 5:53:48 PM
Originally posted by BS-Harou:
I am not C programmer, but I like when closing-brace is under open brace (with same count of tabs from start of line). Please, as option, not default!
But, based on statistic here, I am in the minority...
MaximSaturday, April 14, 2012 6:06:14 PM
Originally posted by BS-Harou:
Interesting, but, for me, it is just specific case... In my 10 year history I never had any problem with "bad" style in JavaScript.
Martin KadlecSaturday, April 14, 2012 9:58:27 PM
Originally posted by c69:
I'm also wondering. Are you waiting for some Core changes, or are you actively working on it? Some update would be nice
Originally posted by SailorMax:
As far as you are programming alone it is ok, but you might have some trouble when you'll be programming with some else, because today most of javascript programmers are using the 1TBS style. Just look at any JS guru:
Dmitry Soshnikov, kangax, WebReflections, John Resig, Remy Sharp, Brucel Lawson, Anne van Kesteren, Nicholas Zakas, ....
Spadar ShutSunday, April 15, 2012 6:32:34 AM
FransSunday, April 15, 2012 9:58:08 AM
Originally posted by Spadar Shut:
Perhaps I misunderstand you, but isn't that what double clicking does?
Spadar ShutSunday, April 15, 2012 6:46:07 PM
Originally posted by Frenzie:
I mean update and highlight the code in Dragonfly when it changes dynamically, like changing classes or style attributes.
FransSunday, April 15, 2012 6:56:44 PM
MaximMonday, April 16, 2012 8:10:59 AM
Originally posted by BS-Harou:
Already. No problem in command
I think if you know the language, highlighted case is not the problem. Your choice can make your editor. But if you not fully understand the language and write your code -- yes, better use strict syntax
About gurus: We don't know _when_ our gurus start using this syntax...
SteveKongMonday, April 16, 2012 8:12:21 PM
Question: Being familiar with Smalltalk Debuggers I wonder whether some of their features could make it in some form to Dragonfly:
1. Step execution that performs only one function invocation / operator execution at a time instead of a complete line of code.
2. Current execution stack that shows all stack values, i.e. function arguments, and thus (together with 1.) all intermediate results of nested calls.
However, keep up the great work!
Witold BarylukWednesday, April 25, 2012 3:42:14 AM
Personally would rather like to have opening curly brace {, on same line as whetever is before it (for,while,do,function,try,if,else,catch,finaly). I hate { on separate line (with some very rare exceptions, like long function argument list). I think having { on same line is standard in Java and JavaScript, so keep it so.
Really like UPnP. If you have time please make sure IPv6 works!
David HåsätherWednesday, April 25, 2012 12:03:38 PM
Originally posted by c69:
It's being worked on again.And braces are now on the same line!
JanGenFriday, May 4, 2012 3:15:18 PM
I still want get some attention to some requests I once made:
http://my.opera.com/community/forums/topic.dml?id=903831
and
http://my.opera.com/community/forums/topic.dml?id=903851
Would be nice to be able to select/deselect any resource for reloading or set a wait (load after ? second) on it, to test performance and see what's happening when a resource is not available, or change/force the order of loading of resources.
That will cover things like:
https://twitter.com/#!/drewm/status/194141273572114433
or what happens when a resource is not available.
The possibility to block remote and add local resources (hope the file-api will make this possible) will help enormously in debugging, with problems like here:
http://my.opera.com/hallvors/blog/2012/03/20/debugging-maps-google-maps
Because you could stop loading from the web but instead load the file (reformatted/corrected) locally. And you can inject jquery or whatever.
In general most technology is there, userJS, userCSS, content-blocking, but to manage it on the fly from Dragonfly would be really powerful IMHO.
What do you think?
Martin KadlecFriday, May 4, 2012 4:08:19 PM
Constantine VesnaFriday, May 4, 2012 5:01:50 PM
SaidFriday, May 4, 2012 6:11:12 PM
Two features that I like in Firefox firebug and Chrome is you can add a new css property easily by just double clicking under the last property, and the ability to create a new style for an element.
Also Firebug style colors are more visible:
- ID/Class in black,
- css properties in green,
- css values in blue
in Dragonfly you use blue for both id/class and properties which is bit confusing. The tabs grey color looks fancier but in terms of visibility it is not a good choice.
I would like also if I could disable many features I do not use or rarely use like "Utilities" or "Console" or the "filter" option under "Styles" tab.
thanks
QuHnoFriday, May 4, 2012 9:54:25 PM
Originally posted by kumo99:
just double click the property of the element where you want to add something and hit return: voilà, a new line and you can type what you want.
clicking somewhere else leaves the edit mode, afterwards you can hover over the property and set or unset the checkbox to activate or deactivate the new rule(s).
FransSaturday, May 5, 2012 7:21:28 AM
Originally posted by Said:
Do you mean that some kind of selector should be automatically filled out? Or simply that "new style" at the bottom is too far off?
Originally posted by QuHno:
In my version of DF you can also hover slightly underneath and click +?
QuHnoSaturday, May 5, 2012 11:18:24 AM
Originally posted by Frenzie:
Yes, that too - it seems I always moved the trackball too fast, so I didn't see it (but hitting an element and double-clicking is faster for me than fine positioning the pointer anyway) ...
Like for almost all things in Opera there is more than one way to do it
FransSaturday, May 5, 2012 11:36:02 AM
Originally posted by QuHno:
Same here.
SaidSaturday, May 5, 2012 1:15:45 PM
Originally posted by Frenzie:
yes that exactly what I mean a selector should be automatically filled out. It would be better also if we could have an option to "add new style" when you right-click on a tag element in the html tree. thanksJanGenThursday, May 17, 2012 11:34:36 AM
Originally posted by JanGen:
Well something is in the pipeline
http://dev.opera.com/articles/view/new-extension-apis-screenshot-resource-loader-url-filter/
Martin KadlecThursday, June 14, 2012 2:15:43 PM
Christian KrebsSunday, June 17, 2012 2:23:23 PM
Originally posted by BS-Harou:
- return values: ci 287
- UPnP: ci 316
- pretty print: ci 318
Martin KadlecSunday, June 17, 2012 3:07:14 PM
Originally posted by aleto:
Thank you for the info!
Waiting for return values then
Unregistered userSunday, July 8, 2012 6:41:02 AM
Unregistered userSunday, July 8, 2012 6:45:23 AM
Ask and i may tellWednesday, July 11, 2012 1:07:59 PM
Unregistered userFriday, August 10, 2012 12:51:24 PM
QuHnoSunday, August 19, 2012 11:26:28 AM
Originally posted by BS-Harou:
Always showing "Line 1"
But with a char/column count it would be really helpful, e.g. the error occurred in
"line 1, column 1733"
of the original script ...
Unregistered userTuesday, August 21, 2012 4:05:08 PM
Constantine VesnaSaturday, August 25, 2012 6:46:47 PM
Originally posted by anonymous:
its being formatted in experimental dragonfly, O12.50.
And maybe its even working in 12.01 - check it yourself.