On Friday, 8 April 2016 20:06:19 UTC+2, Jeff Muizelaar wrote: > Check out > https://developer.mozilla.org/en-US/docs/Mozilla/Debugging/Layout_Debugger. > I expect it gets the information that you're looking for. > > -Jeff > > On Fri, Apr 8, 2016 at 1:38 PM, Jip de Beer <[email protected]> wrote: > > Hi all, > > > > I would like to inspect the Frame Tree (or Render Tree: > > http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/#Render_tree_construction) > > in real time while browsing with Firefox. > > > > I first tried to access this tree with JavaScript or a browser addon. It > > seems that this information is not accessible at this level. With > > document.elementFromPoint() or document.elementsFromPoint() in Chrome it > > may be possible to re-construct the Frame Tree but this is not optimal. > > Another way I tried to approach this is the re-implement the CSS stacking > > mechanism in JavaScript (https://github.com/Jip-Hop/visuallyOnTop). But > > this is slow, redundant and needs to be maintained as behavior changes. > > > > I looked around in about:config. The closest thing I found was enabling > > layout.display-list.dump. With Firefox launched from the Terminal, the > > display-list is dumped in real time. It's almost what I need except that > > this is only output for elements visible in the viewport. I need to inspect > > the entire Frame Tree. > > > > The next thing I tried was installing FirefoxDeveloperEdition, hoping this > > version would somehow have extra tools to access this data. But it seems > > this version of Firefox is oriented towards debugging websites. Dumping the > > Frame Tree is probably possible when debugging the browser itself > > (Debugging Gecko Core). > > > > I read here: > > https://developer.mozilla.org/en-US/docs/Mozilla/Performance/Debugging_a_Performance_Problem#Layout_Debugging > > that I could enable this functionality by defining DEBUG_FRAME_DUMP in > > layout/generic/nsFrameList.h. So I downloaded the Firefox source (nightly), > > built Firefox Nightly and tried to dump the Frame Tree. > > > > I didn't manage to dump the Frame Tree using lldb... I followed these > > guides: > > http://mcc.id.au/blog/2014/01/lldb-gecko > > https://developer.mozilla.org/en-US/docs/Mozilla/Debugging/Debugging_on_Mac_OS_X > > https://developer.mozilla.org/en-US/docs/Mozilla/Debugging/Debugging_Mozilla_with_lldb > > I tried with Firefox, FirefoxDeveloperEdition and the nightly build (ran > > lldb from Terminal as well as Xcode). > > I was able to attach lldb to the browser, but not output a Frame Tree dump. > > The code for the nightly build was unmodified. When I tried to define > > DEBUG_FRAME_DUMP in layout/generic/nsFrameList.h (by uncommenting a block > > of code) the build failed. > > I noticed when debugging with lldb, the browser hangs until I quit lldb. I > > want to dump and inspect the Frame Tree in real time. So locking the > > browser with a debugger like lldb may not be the way to go after all. > > > > So what are the possibilities for dumping the Frame Tree in real time? It > > would be awesome if it could be done from JavaScript in the browser > > (without being super slow), but logging to a file or outputting to the > > Terminal in real time are also acceptable solutions. Also it would be great > > if it's available from the default Firefox or FirefoxDeveloperEdition apps, > > as it feels like a lot of trouble to make custom builds and edits to enable > > this functionality. > > > > I'm using the latest versions of Firefox on Mac OS X 10.10. > > > > Looking forward to your replies. > > > > Thanks in advance. > > Jip > > _______________________________________________ > > dev-platform mailing list > > [email protected] > > https://lists.mozilla.org/listinfo/dev-platform
Hi Jeff, thanks for the reply. I did look at that page before but I could use some help with understanding it. How can I use it to dump the Frame Tree? _______________________________________________ dev-platform mailing list [email protected] https://lists.mozilla.org/listinfo/dev-platform
