Firebug/WeeklyUpdates/2014-07-01

From MozillaWiki
Jump to: navigation, search

Jan Odvarko, Jakob Kaltenbrunner, Joe Walker, Simon Lindholm, Sebastian Zartner, Steven Roussey

Vacations

  • Florent: 23 June => 05 July

Firebug 2

  • Issue 7521: Firebug 2.0 nested eval bug
  • Issue 7527: Firebug no longer showing dynamically loaded scripts
    • Honza patch ready

Firebug 3

Summarizing status and progress on Firebug.next, see also post on FWG https://groups.google.com/forum/#!topic/firebug-working-group/WYMoYOnMrWg

1. Directory structure cleaned up. Many new modules created (more coming). Some internal concepts already transferred over (objects like, Firebug, Chrome, Panel,... exist), DevTools SDK already used (Panel).

2. The HelloWorld panel shows how to create new panels, side panels, toolbar buttons and panel options menu. This panel will be moved into an example extension eventually.

3. Basic tree (UI widget) and provider are available and adopted for RDP. Consuming only data transferred over RDP

4. Reps templates are now available for basic DOM types (see the reps dir). They are adopted to display grips (a handle to remote debuggee object). The DOM panel is also implemented. It might be also moved to an example extension at some point to show how to use concept for consuming and rendering remote backend data.

The current data flow is as follows:

  • a provider fetches a grip for an actor (for e.g. a top level document) from the backend
  • when JSON packets is received - the grip - is passed to a UI widget (e.g. the tree) as an input
  • The tree ensured basic layout and expandable/collapsible logic and uses registered reps to render values from the JSON packet.
  • Reps consume the JSON packets directly to produce HTML, it works just perfectly! (the code is actually easier then before)

Comments:

  • The same set of reps will be used to customize Console logs rendering (plus

any place where a debuggee object should be rendered).

  • Every level in the data flow chain is customizable. A new provider or UI widget or data type template can be implemented by an extension.
  • It should be e.g. possible to use Web Components instead of Domplate

London meetup demo

The current available features can be demonstrated using the following steps:

  1. Load any page e.g. google.com
  2. Open the toolbox
  3. Select the Console panel
  4. Type e.g. document in the Command line and execute
  5. Click on the logged document object
  6. See nice DOM view in a side panel
  7. Click an object in the side panel, you'll be navigated to the DOM panel
  • We should work on specifying list of features we want to show as part of the demo in London.
  • Issues related to the demo features should be filed.

Demo for London work week, steps towards:

  1. Firebug theme for native developer tools (design + layout)
  2. Implementation of basic concepts (side panels, option menus, context menus, search, navigation, panel toolbar, etc.)
  3. Additional features: support for 3rd party libs (customizing debuggee templates and adding new displayed info coming from 3rd party libs)
  4. Additional suggestions should go into: https://etherpad.mozilla.org/firebug-next

Next Steps

1. Theming. We need Firebug theme for global UI (toolbar, search box, panel tabs, etc.) as well as for individual panels content. We should focus on the Console and Inspector.

  • Sebastian: CSS clean up?
  • Thomas: testing on Mac?
  • Djalil: currently working on theme switcher (new Firebug theme option in Toolbox options panel)
  • Jakob: working on options button issue

2. We need to overlay existing panels and customize also the layout (e.g. display set of side panels). Starting with the Console panel.

Console should:

  • Turn VariablesView into a proper DOM side panel and use grip templates registry.
  • Show Command Editor side panel (Scratchpad)
    • We need Joe's feedback for this
  • Honza: Basic layout for side panels, toolbar, etc. done
  • Honza: Repository of templates for debuggees done.
  • Simon: Customizing the command line, implementing use in command line feature?

3. Tracing improvements As usual tracing is invaluable for debugging, see also tips and tricks for debugging Firebug.next.

(and perhaps also on: https://github.com/firebug/firebug.next/issues/17 ?)

4. Implement proper localization API E.g. plurals don't work and also Add-ons SDK supports only one properties file

5. Moving ahead and customizing other panels (the Inspector panel should go next) Gathering an experience and knowledge about what API are missing and making a list of requirements


Discussions

  • Labels for github.com issue list
    • We want to port some existing labels from code.google.com
    • We might want to innovate out labels at this point (introduce new and/or cut off some existing)
    • Sebastian
  • Code styling syntax
    • We are now based on Add-ons SDK and DevTools SDK and it makes sense to use the same coding style
    • Add-ons SDK coding style doc
  • The old issue list (code.google.com) should be kept and use for Firebug 2 only. ** We might want to copy some issues over (e.g. lib refactoring)
    • The old issue list will be fully closed (frozen not removed) as soon as Firebug 3 fully replaces Firebug 2
Retrieved from "https://wiki.mozilla.org/index.php?title=Firebug/WeeklyUpdates/2014-07-01&oldid=994361"