I develop firefox extension and using the "load" and "DOMContentLoaded" events to raise when document was fully loaded.
My problem, however, is that my 'content' variable is always pointing to the focused tab and not to the new loaded tab (for example, when firefox restarts and load several tabs or if you right-click a link and open it in new tab <-- then it load in the background and does not change the currently visible tab)
How can I get the 'content' variable of the newly created page?
Thanks!!
Related
Is there a way to keep Firebug on a single page, so that when I switch pages it remains on the page I want it set to?
For example, I'm working on a project and I get an error that I want to search for on Stack Overflow, but when I navigate here, the console changes to reflect this site. I'd like to stop that from happening.
There is no option to "pin" a page's data in Firebug (as of version 2.x). As far as I know this also doesn't work in any of the browser built-in dev tools.
Though the simple solution for your problem is to open the other page in a separate tab or window. Doing so keeps all the data of the page saved when you switch back to the tab containing your project's page.
Note that Firebug's activation model is based on URLs following the same origin policy. I.e. if you open it for your project's page, it will always get opened for your projects page, even on other tabs, but not for any other site.
I've found it useful to split the tab of interest off into a new window and to activate Firebug on that window. That way I can continue using my original tab collection/window without it changing as I link-hop.
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.
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.
You can click to inspect a node in the console and debugger starting in Firefox 29, currently on the Aurora channel.
is it possible to open a xul page (chrome://myext/content/page.xul) with a blank address page?
I want to have a xul page in a new tab to collect some information to my extension, but i wanted to hide the chrome address.
in chrome, some extension pages are shown without an address, like follows:
Evernote Clearly:
Contextinator:
Is it possible on firefox to open the chrome://myext/content/page.xul without showing this address on the address bar?
In firefox, this is usually done by hiding browser chrome.
If you're using addon-sdk, this can be accomplished by including the addon-page like so:
require("sdk/addon-page");
When not using addon-sdk (ie, XUL based extension), then you might need to look into hideChromeForLocation() and inContentWhitelist members of XULBrowser. Hiding browser chrome is explained here and the source code for the members can be found in browser.js: hideChromeForLocation, inContentWhitelist.
Note: XULBrowserWindow itself is a property of window.
var {XULBrowserWindow}=window;
An example of a location with hidden chrome is the Addon Manager (about:addons), which hides the navigation bar when viewing that particular location.
I am learning chrome extension by example. Here is the example I currently learning: http://www.chrome-extensions.net/extensions/mappy/
There are three JavaScript files in this sample project: background.js mappy_content_script.js popup.js.
"mappy_content_script.js" is shown in the Combo box of Scripts tab of Developer Tools.
"popup.js" can be found if I right click the extension icon and choose "Inspect popup".
The problem is I can't debug "background.js" or find it in the Developer Tools. I tried insert "debugger;" in this JavaScript file. I also tried use profiling tool to record the script execution. However, when I click the link of "background.js", a blank page shows up.
Is this a bug of chrome or did I miss something? Thanks
background.js is loaded in the background. To inspect it visit chrome://extensions, find the loaded extension, and "inspect active views" for the background script.
Edit
Below is a screenshot of the chrome extensions page. A click on the link background page opens the background page for this extension.
Additional information
EDIT 2020
Here is how you can see the content scripts and debug,
Nowadays you have to install a Chrome extension to allow you to inspect the view of a page, specifically the Develop and Debug Chrome Apps & Extensions
There is an easy way to access your extension code in DevTool and debug it.
Open the DevTool (e.g. F12) , click on "Sources" tab
then look for "Content Scripts" menu next to Page , Filesystem, Overrides etc.
and click on it .
you should see all active extensions listed there and you can easily add break point to each js code and reload the page to debug through
I have a web application I am automating with watir. The application has a browsing page which shows thumbnails for a set of templates. Each thumbnail is a link to the template. I need to open each template in a new tab or window and take a screen shot or print a pdf of the template to verify that it opens correctly and looks correct. Then close that tab or window and return to the template browser to open the next template. I need to do this on firefox/safari chrome and IE mac and windows.
Why not open it in the same tab, take the sreenshot, then go back?
I haven't used Watir, only Selenium, but it looks like Watir has a back method as well. If not, you can probably store the URL of the page with the thumbnails and then open it directly by URL.
You can read the url of the link, store it in an variable, open a new browser window and then with ie.goto(url) you can open the link in a new browser.