Where are the Web Console objects in Firefox Devtools?

Question

I found a way to inject information into the Firefox Web Console, catching and modifying the return value of createMessageNode, modifying the web-console output:

Oddly enough, the elements returned don't seem to have any possible way to link them back to the object they represent - yet when you click [object Array], it always pops up to the right. How is this connected?

As a side note, when I click upward on the breadcrumbs to see where it came from on the stack trace, some items aren't shown in the debugger. Is this a bug, or are some JS modules compiled so as to never show their contents here? Is this the correct place to add in an array to the console line instead of always saying [object Array] etc.?

Update You can see and run this code above in this branch: https://github.com/programmin1/DevTools-Tweaks/tree/webconsoleOutputBetter

Answer 1

by inject info do you mean Services.console.logStringMessage and stuff?

https://developer.mozilla.org/en-US/docs/Console_service

If you want to access the chrome of the web console do this:

var devtools = Cu.import("resource://gre/modules/devtools/Loader.jsm", {}).devtools;
var HUDService = devtools.require("devtools/webconsole/hudservice");

var hud = HUDService.getBrowserConsole();

var btnClear = hud.chromeWindow.document.querySelector('.webconsole-clear-console-button');
btnClear.addEventListener('mouseover', function() {
  hud.jsterm.clearOutput(true);
}, false);
var fieldFilter = hud.chromeWindow.document.querySelector('.hud-filter-box');
fieldFilter.value = 'rawr'

this code access the crhome window, you can access all the text dumped there. this example above modies the filter value, and also makes the clear button clear the web console on mouseoever, just an example of how to access web console if thats what you're doing