Fwd: UI suggestions for black boxing?

76 views
Skip to first unread message

Girish Sharma

unread,
Jun 7, 2013, 6:13:11 PM6/7/13
to dev-devel...@lists.mozilla.org
+list

---------- Forwarded message ----------
From: Girish Sharma <scrapm...@gmail.com>
Date: Sat, Jun 8, 2013 at 3:41 AM
Subject: Re: UI suggestions for black boxing?
To: fit...@mozilla.com





On Sat, Jun 8, 2013 at 3:36 AM, Fitzgerald, Nick <nfitz...@mozilla.com>wrote:

> Hey Toolers,
>
> I'm hoping for some ideas and feedback on possible UIs for black boxing
> sources.
>
> What I initially imagined was having a context menu on each source in the
> left pane of the debugger where you could toggle black boxing on and off.
>
> But I was talking with Benvie this morning and he brought up some great
> points: what if you want to black box a bunch of different sources?
> Selecting them each one at a time sucks. What if you always want to black
> box minified sources? Again, selecting them one at a time sucks.
>

How many of these libraries people use on an average ? 3 ? 5 ? Selecting 4
libraries one time would not seem a much to me, but ..

I think if we also did a context menu on the directory dividers to black
> box all sources for that directory, we would handle a large chunk of the
> first problem. Generally my experience has been that devs keep all third
> party libraries inside a single directory, and they could just black box
> that directory this way.
>
> this will be a much better approach (along side the above one).

Another option is maybe allowing devs to specify a regexp on sources they
> want to black box. Then they could specify something like /.+\.min\.js/ to
> match and black box minified files. I don't know how we would actually
> present this option to the user, though.
>
> May be for the first landing, this can be avoided and then lets see how
much is this needed. If quite a few number of people requested regex based
blackboxing, then it can be provided in a followup.


> Does anyone have any feedback or ideas?
>
> Nick
>
> PS, the bug for this is here: https://bugzilla.mozilla.org/**
> show_bug.cgi?id=877686<https://bugzilla.mozilla.org/show_bug.cgi?id=877686>
> ______________________________**_________________
> dev-developer-tools mailing list
> dev-developer-tools@lists.**mozilla.org<dev-devel...@lists.mozilla.org>
> https://lists.mozilla.org/**listinfo/dev-developer-tools<https://lists.mozilla.org/listinfo/dev-developer-tools>
>



--
Girish Sharma
B.Tech(H), Civil Engineering,
Indian Institute of Technology, Kharagpur



--
Girish Sharma
B.Tech(H), Civil Engineering,
Indian Institute of Technology, Kharagpur

Fitzgerald, Nick

unread,
Jun 7, 2013, 6:15:03 PM6/7/13
to dev-devel...@lists.mozilla.org
On 6/7/13 3:13 PM, Girish Sharma wrote:
>> May be for the first landing, this can be avoided and then lets see how
> much is this needed. If quite a few number of people requested regex based
> blackboxing, then it can be provided in a followup.
>
>
Agreed, that this is more of a follow up.

Rob Campbell

unread,
Jun 7, 2013, 6:17:33 PM6/7/13
to fit...@mozilla.com, dev-devel...@lists.mozilla.org
regexes are not what I would really want but a "file inclusion" or substring matching input might be good.

E.g., jquery, ember, etc.
> _______________________________________________
> dev-developer-tools mailing list
> dev-devel...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-developer-tools

Rob Campbell

unread,
Jun 7, 2013, 6:25:45 PM6/7/13
to dev-devel...@lists.mozilla.org
On 2013-06-07, at 6:06 PM, "Fitzgerald, Nick" <nfitz...@mozilla.com> wrote:

> Hey Toolers,
>
> I'm hoping for some ideas and feedback on possible UIs for black boxing sources.
>
> What I initially imagined was having a context menu on each source in the left pane of the debugger where you could toggle black boxing on and off.
>
> But I was talking with Benvie this morning and he brought up some great points: what if you want to black box a bunch of different sources? Selecting them each one at a time sucks. What if you always want to black box minified sources? Again, selecting them one at a time sucks.

Agreed. Context menus are a clumsy way to apply an action to multiple things.

two options for consideration:

1. possibility could be to have a context menu "Blackbox Sources" that then puts the source list into a toggle mode. Adds checkboxes to each file and an OK/Cancel pair to finish the edit.

2. adding multiple selection to the file list to make that context menu operation less repetitive.

I think we should avoid adding extra dialogs or file lists to make this feature work, but could be convinced otherwise in the face of an amazing interface.

> I think if we also did a context menu on the directory dividers to black box all sources for that directory, we would handle a large chunk of the first problem. Generally my experience has been that devs keep all third party libraries inside a single directory, and they could just black box that directory this way.
>
> Another option is maybe allowing devs to specify a regexp on sources they want to black box. Then they could specify something like /.+\.min\.js/ to match and black box minified files. I don't know how we would actually present this option to the user, though.
>
> Does anyone have any feedback or ideas?

I'd say advanced features like that should prossibly be added via a GCLI command or equivalent. I don't see where we could put that sort of thing in our existing UI without adding an extra dialog or entry field and that would feel messy.

Just some thoughts and suggestions to add to the discussion. Feel free to suggest others!

Have a great weekend,
Rob

> Nick
>
> PS, the bug for this is here: https://bugzilla.mozilla.org/show_bug.cgi?id=877686

Dave Camp

unread,
Jun 9, 2013, 9:48:07 PM6/9/13
to fit...@mozilla.com, dev-developer-tools
I can think of a few general options that might be nice to start out:

* Blackbox minified files (which can use whatever heuristic we think works)
* Blackbox different-origin files (CDN'ed files)

Then maybe a toggle something like the style editor's Eye in the source
list for each directory/filename?


On Fri, Jun 7, 2013 at 3:06 PM, Fitzgerald, Nick <nfitz...@mozilla.com>wrote:

> Hey Toolers,
>
> I'm hoping for some ideas and feedback on possible UIs for black boxing
> sources.
>
> What I initially imagined was having a context menu on each source in the
> left pane of the debugger where you could toggle black boxing on and off.
>
> But I was talking with Benvie this morning and he brought up some great
> points: what if you want to black box a bunch of different sources?
> Selecting them each one at a time sucks. What if you always want to black
> box minified sources? Again, selecting them one at a time sucks.
>
> I think if we also did a context menu on the directory dividers to black
> box all sources for that directory, we would handle a large chunk of the
> first problem. Generally my experience has been that devs keep all third
> party libraries inside a single directory, and they could just black box
> that directory this way.
>
> Another option is maybe allowing devs to specify a regexp on sources they
> want to black box. Then they could specify something like /.+\.min\.js/ to
> match and black box minified files. I don't know how we would actually
> present this option to the user, though.
>
> Does anyone have any feedback or ideas?
>
> Nick
>

Panos Astithas

unread,
Jun 10, 2013, 3:37:50 AM6/10/13
to Dave Camp, dev-developer-tools, fit...@mozilla.com
One thing to keep in mind is that if the user finds himself in a place
where our heuristics didn't work properly (black boxing everything), that
realization will likely come at the moment where he is observing the stack
list, not the source list. Therefore I think we need to provide an
affordance to let the user remove frames from the stack list that would
translate to black boxing the entire source URL from appearance in future
stack lists.

A UI to toggle black boxing in the source lists can be useful when one
knows what to look for and expects to find it there. It can also be made
far more scalable with multiple checkboxes and whatnot, but I wouldn't
expect someone not already familiar with this functionality to look there
first.

Panos

Rob Campbell

unread,
Jun 10, 2013, 12:29:02 PM6/10/13
to Panos Astithas, Dave Camp, dev-developer-tools, fit...@mozilla.com
Should we remove the frames from the stack list or just provide some indication that they've been boxed? Maybe grey them out, put an Eye of Horus next to them or some other indication that we've done something helpful.

Jeff Griffiths

unread,
Jun 10, 2013, 5:12:09 PM6/10/13
to Panos Astithas, Dave Camp, dev-developer-tools, fit...@mozilla.com
One particular pattern where black-boxing might cause problems is the (
somewhat edge-case? ) situation where a developer is using require.js
and compiling and minifying all js files to a single file. If we have
sourcemaps, can we help here, for example if the sourcemap points to
multiple sources can we could allow the user to blackbox some of those
but not others?

The typical pattern for a developer is to code against a dev server
where the files haven't been built, so this wouldn't be a problem in the
typical localhost development use case but where it would be *critical*
is if you have a production problem you're trying to debug, being able
to separate out the relevant source files would be critical.

I chatted briefly with James Burke today about this issue, he suggested
this would work generally, *if* require.js includes the sourcemap info
and also *if* we can somehow identify and un-pack the built file based
on that. So let's say my site.js includes app.js, jquery, underscore,
etc, we could let the user see the files the sourcemap points to and
blockbox some of them.

$0.02, Jeff

Anton Kovalyov

unread,
Jun 7, 2013, 7:34:35 PM6/7/13
to dev-devel...@lists.mozilla.org
Zimbra decided to reply to Rob only, forwarding. Zimbra sucks.

----- Forwarded Message -----
From: "Anton Kovalyov" <akov...@mozilla.com>
To: "Rob Campbell" <rcam...@mozilla.com>
Sent: Friday, June 7, 2013 4:33:51 PM
Subject: Re: UI suggestions for black boxing?

For minified files, why don't we just have a setting to blackbox all minified files? It should be relatively easy to detect such files and I don't see why 99% wouldn't want to blackbox them.

For everything else I personally think that checkboxes (or something similar) are fine as long as we save the state between reloads/restarts. Plus, we can always iterate on that.

Anton

----- Original Message -----
From: "Rob Campbell" <rcam...@mozilla.com>
To: dev-devel...@lists.mozilla.org
Sent: Friday, June 7, 2013 3:25:45 PM
Subject: Re: UI suggestions for black boxing?

On 2013-06-07, at 6:06 PM, "Fitzgerald, Nick" <nfitz...@mozilla.com> wrote:

> Hey Toolers,
>
> I'm hoping for some ideas and feedback on possible UIs for black boxing sources.
>
> What I initially imagined was having a context menu on each source in the left pane of the debugger where you could toggle black boxing on and off.
>
> But I was talking with Benvie this morning and he brought up some great points: what if you want to black box a bunch of different sources? Selecting them each one at a time sucks. What if you always want to black box minified sources? Again, selecting them one at a time sucks.

Agreed. Context menus are a clumsy way to apply an action to multiple things.

two options for consideration:

1. possibility could be to have a context menu "Blackbox Sources" that then puts the source list into a toggle mode. Adds checkboxes to each file and an OK/Cancel pair to finish the edit.

2. adding multiple selection to the file list to make that context menu operation less repetitive.

I think we should avoid adding extra dialogs or file lists to make this feature work, but could be convinced otherwise in the face of an amazing interface.

> I think if we also did a context menu on the directory dividers to black box all sources for that directory, we would handle a large chunk of the first problem. Generally my experience has been that devs keep all third party libraries inside a single directory, and they could just black box that directory this way.
>
> Another option is maybe allowing devs to specify a regexp on sources they want to black box. Then they could specify something like /.+\.min\.js/ to match and black box minified files. I don't know how we would actually present this option to the user, though.
>
> Does anyone have any feedback or ideas?

I'd say advanced features like that should prossibly be added via a GCLI command or equivalent. I don't see where we could put that sort of thing in our existing UI without adding an extra dialog or entry field and that would feel messy.

Just some thoughts and suggestions to add to the discussion. Feel free to suggest others!

Have a great weekend,
Rob

> Nick
>
> PS, the bug for this is here: https://bugzilla.mozilla.org/show_bug.cgi?id=877686

Fitzgerald, Nick

unread,
Jun 10, 2013, 5:39:15 PM6/10/13
to Jeff Griffiths, Panos Astithas, Dave Camp, dev-developer-tools
Yeah, it should work fine if we have a source map. However, if we don't
have one, it all looks like one source and I don't see what we could do
in this case.
>>> On Fri, Jun 7, 2013 at 3:06 PM, Fitzgerald, Nick
>>> <nfitz...@mozilla.com
>>>> wrote:
>>>
>>>> Hey Toolers,
>>>>
>>>> I'm hoping for some ideas and feedback on possible UIs for black
>>>> boxing
>>>> sources.
>>>>
>>>> What I initially imagined was having a context menu on each source
>>>> in the
>>>> left pane of the debugger where you could toggle black boxing on
>>>> and off.
>>>>
>>>> But I was talking with Benvie this morning and he brought up some
>>>> great
>>>> points: what if you want to black box a bunch of different sources?
>>>> Selecting them each one at a time sucks. What if you always want to
>>>> black
>>>> box minified sources? Again, selecting them one at a time sucks.
>>>>
>>>> I think if we also did a context menu on the directory dividers to
>>>> black
>>>> box all sources for that directory, we would handle a large chunk
>>>> of the
>>>> first problem. Generally my experience has been that devs keep all
>>>> third
>>>> party libraries inside a single directory, and they could just
>>>> black box
>>>> that directory this way.
>>>>
>>>> Another option is maybe allowing devs to specify a regexp on
>>>> sources they
>>>> want to black box. Then they could specify something like
>>>> /.+\.min\.js/
>>> to
>>>> match and black box minified files. I don't know how we would actually
>>>> present this option to the user, though.
>>>>
>>>> Does anyone have any feedback or ideas?
>>>>
>>>> Nick
>>>>
>>>> PS, the bug for this is here: https://bugzilla.mozilla.org/**
>>>> show_bug.cgi?id=877686<
>>> https://bugzilla.mozilla.org/show_bug.cgi?id=877686>
>>>> ______________________________**_________________
>>>> dev-developer-tools mailing list
>>>> dev-developer-tools@lists.**mozilla.org<
>>> dev-devel...@lists.mozilla.org>
>>>> https://lists.mozilla.org/**listinfo/dev-developer-tools<

Jeff Griffiths

unread,
Jun 10, 2013, 6:01:25 PM6/10/13
to fit...@mozilla.com, Panos Astithas, Dave Camp, dev-developer-tools, Fitzgerald, Nick
For require.js including sourcemaps is a build option, I think the
answer is in part great docs and outreach to developers on yet another
reason why adding sourcemaps is awesome.

I wonder also about how we can indicate to the developer that there is a
solution for the pathological problem: "we noticed you only have one
JavaScript file, ever and it does not contain sourcemaps. If you enable
sourcemaps I might actually help you out..." ( para-phrasing, of course )

Jeff

Rob Campbell

unread,
Jun 10, 2013, 6:06:13 PM6/10/13
to Jeff Griffiths, Panos Astithas, Dave Camp, Fitzgerald, Nick, dev-developer-tools, fit...@mozilla.com
I wonder if we should build in sourcemap support for dryice? Not sure how widely-used it is for this type of script munging, but we've used it in the past for our code editor and command line.

https://github.com/mozilla/dryice

Fitzgerald, Nick

unread,
Jun 10, 2013, 6:08:07 PM6/10/13
to Rob Campbell, Jeff Griffiths, Dave Camp, dev-developer-tools, Panos Astithas
On 6/10/13 3:06 PM, Rob Campbell wrote:
> I wonder if we should build in sourcemap support for dryice? Not sure how widely-used it is for this type of script munging, but we've used it in the past for our code editor and command line.

Strong +1. The source maps lib itself uses dryice to build for inclusion
in firefox as a jsm.
Reply all
Reply to author
Forward
0 new messages