I am creating a Firefox extension that is somewhat similar to Firebug. There is a panel (or vbox) at the bottom of the browser that allows users to specify colors to certain Html elements. When they click the OK button, I would like these colors to get updated on the current web page.
I have my JavaScript working when I click the button (i am just throwing an alert), however when I change that JavaScript to change the css or styles of an element (by either using document.getElementById or jquery), nothing changes.
Is there something with Firefox extensions that I am missing? Any help is appreciated.
Let me know if you have any questions. Thanks
https://developer.mozilla.org/en/Extension_Frequently_Asked_Questions#Accessing_the_document_of_a_webpage_doesn%27t_work
You want content.document.getElementById() and similarly for every other construct you use.
Related
I developed a firefox bootstrapped extension (without add-on sdk). I need to display a popup with html content, something like panel in add-on sdk. Also, it is necessary that the extension could interact with content in the popup. Also, I need a way to display html content in separate tab and interact with this content. So what can I use to implement what I need?
You can append an iframe to that panel, and then load a page into that iframe. That's what I did in this simple addon here - https://github.com/Noitidart/AwesomeBar-Power-Tip/
Here's another gist that does something similar - https://gist.github.com/Noitidart/9445992
I think this is how the SDK does it as well.
but I can not understand how it is possible to implement the interaction between expansion and content inside the panel.
The panel or its frameLoader property should have a messageManager, which can be used to load frame scripts and pass messages to them.
I'm automating tests using Selenium on Firefox, and everything was working ok until I needed to check checkboxes that are not visible due to a footer that is fixed to the bottom of the page.
It's a long list of disclaimers that are necessary to be checked in order to continue.
The first two are below this footer, the rest forces a scroll down, and are checked correctly.
My question is:
1) Is there a way to check the first two even thought they are below the footer?
2) Is there a way to make Selenium scroll down using a command?
3) Is there a way to make Selenium to open a new Firefox window maximized? (I believe that if this is possible, all checkboxes will be visible on load)
Thank you!
PS: This is my second post, if I'm missing some information please let me know and I'll edit it.
EDIT:
Firefox version: 23.0.1
Webdriver version: 2.35
Unfortunately, i have only configured my webdriver for Firefox (not on chrome at the moment)
You don't have to scroll the page as long as you are finding the Element with correct selectors (e.g. xpath, css etc.), so something like driver.findElement(By.xpath("xpath")); should remove the need to scroll the page. As for opening the page in full screen use the following
driver.manage().window().maximize();
If your web page needs to be scrolled down to interact with element, first you'll have to bring that element into view. Using Ruby, this can be achieved by following:
element.location_once_scrolled_into_view
and then interact with element.
You can use javascript executor to scroll the page. I've found that Selenium will click objects that are "visible" but hidden behind something else on the page.
JavascriptExecutor jsx = (JavascriptExecutor)driver;
jsx.executeScript("window.scrollBy(0,450)", "");
I use the capability:
capabilities.setCapability("elementScrollBehavior", 1); // 0- from Top,
// 1 - from bottom
When I start the driver, I set the capability.
This is a real 2%er but here goes, I have created a winform in VS2010 with Gecko 2.0.1-0.10 (latest release) webbrowser control, I am using a touch screen to navigate. Sometimes when clicking a hyperlink it will select text rather than navigate, on the DomMouseUp event I want to check to see if there is selected text, if so I want to see if it is a hyperlink and if it is, where that hyperlink goes to. I had a mess around with GeckoSelection but nothing looked obvious. I am looking for a way to see if what is selected within the web browser is a hyperlink, any thoughts?
I've worked it out : for anyone interested in such things, use DomFocus on the gecko control:
m_strInnerHtml = geckSel.ActiveElement.Parent.InnerHtml.ToString();
That will give you the innerhtml of the selected item, from here you can extract the href tag and get the url, navigate to it, hey presto :)
Update: An even better solution is to use (in DomFocus again)
m_strInnerHtml = geckoWebBrowser.Document.ActiveElement.GetAttribute("href");
This will return the actual hyperlink address, one thing to watch out for however is if you're on google for example and select the "Advertising" hyperlink at the bottom of the page, it may return "/advertisingpage/" which must be appended to the original url. Clicking a hyperlink away from google will return the full address however.
Very good behavior gives this call:
m_strInnerHtml = geckoWebBrowser1.Url.AbsoluteUri()
When browsing the Add-ons Manager, about:addons, in Firefox 4, the toolbars and urlbar are hidden when "Tabs on Top" has been set.
As I am writing an extension in bootstrapped method, how can I simulate that feature in my own created page?
It has already linked to a page on resource scheme (resource://app/page.html)
I am wonder if there are some "hidden" attributes that can easily do such kind of things.
Or, whether it must hide and show the urlbar and toolbars in listener of window-mediator.
Solutions in XUL method are also welcome :) , but it'd be better if it can easily handle in bootstrap.js. ;-)
Thank you for your help.
It looks like Firefox maintains a whitelist of URL locations that should hide the locationbar chrome. The whitelist is checked here:
http://mxr.mozilla.org/mozilla-central/source/browser/base/content/browser.js#4412
So, setting the "disablechrome" attribute on the window element should make the locationbar chrome go away. Removing the attribute will make the locationbar chrome come back.
Adding your location the the whitelist would probably be the easiest way to make this work:
http://mxr.mozilla.org/mozilla-central/source/browser/base/content/browser.js#4086
From your bootstrap.js code, once you get a window, try this:
if (window.XULBrowserWindow)
window.XULBrowserWindow.inContentWhitelist.push("my-url");
I wrote a firefox extension which simply re-formats a page using some JQuery. But, it's interfering with another extension that places a button on the header panel of the browser. Now that button doesn't display. Can some one point me in the right direction as to when this happens. This is my first fire-fox extension.
Update:
The problem is actually being caused by the JQuery source file.
This is a known issue when using JQuery in the overlay.
Your update doesn't include valid chrome.manifest lines. Also, your original style line was totally wrong, and likely the cause of your problem. You should review this page which specifies the syntax to see how this should have been done.