Menu
I know Chrome's inspector has a selector to choose which frame to use with the console. Firebug has a similar command, cd(window.frames[number]). Is there anything similar in Firefox Devtools? I suppose frame.window.eval could work, but only if it isn't cross-domain.
I was also wondering if there is a highlighter to inspect results of Web-console commands, for example document.getElementsByClassName(...). but you can at least change style of an element programmatically to 'see' it.
789
You can just right-click on the element and select Inspect and DevTools highlights it in the DOM Tree on the Elements panel. In the Console, use the Execution Context Menu to change the context of the Console to the iframe.
To set an iframe as the target for the developer tools: Select the iframe context picker button to launch a popup listing all the iframes in the document (and the main document itself). Note that the button is only displayed if the page includes iframes! Select an entry to make it the target iframe.
Developer tools toolboxin the left-hand menu, click This Firefox (or This Nightly). click Inspect next to your extension.
DOMNode objects do highlight in the page on hover in the web console and what is called the "variables view". The "variables view" is used in the web console too when you click on an object to see its properties (it's the sidebar that appears), and is also used in the debugger when paused at a breakpoint (right sidebar that contains the various scopes variables).
So, anytime a DOMNode appears in there, if you hover over it, it will be highlighted in the page.
When it comes to iframes, the webconsole does support the cd() command, see working with iframes.
We are also actively working on a bug that will add a drop-down to the toolbox whenever there are frames/iframes in the current page and allow you to easily switch from one to the other.
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
