I'm developing a Firefox Add-On for a client.
When an user is uninstalling the Add-On, I need to show the user a prompt, which contains three checkboxes. These checkboxes will serve as an option to the user for restoring his/her previous browser settings.
I've successfully created a prompt on uninstall/disable, using the confirmCheck method of the nsIPromptService interface :
let value = {value: true};
let confirm = promptService.confirmCheck(
null,
"Uninstall My Extension",
"You are uninstalling My Extension. You can chose these options to restore your settings to previous state.",
"Remove My Extension as the default search engine, homepage, new tab landing page, and restore to my previous settings",
value
);
The only problem is, it only contains a single checkbox, and I need 3 different ones, for "Seach Engine", "Homepage", and "New Tab Url" each.
I'm using chrome code through the Add-On SDK, and am not familiar with XUL.
How should I go about this? Do I really need to learn XUL for creating a simple prompt?
Alright, answering my own question, as I figured it out. The easiest way I found (comparatively) was to use XUL :
This is my prompt.xul :
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<dialog id="myDialog"
title="My Extension"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
onload="init();"
buttons="accept"
buttonlabelaccept="OK"
ondialogaccept="return doContinue();">
<script type="application/x-javascript">
function init() {
}
function doContinue() {
window.arguments[0].CHECK_1 = document.querySelector('#check_1').checked;
window.arguments[0].CHECK_2 = document.querySelector('#check_2').checked;
window.arguments[0].CHECK_3 = document.querySelector('#check_3').checked;
return true;
}
</script>
<html:div style="width: 410px;">
<html:div>
<html:p>You have selected to uninstall My Extension</html:p>
</html:div>
<html:blockquote id="checkboxes_container">
<html:div id="remove_search_container">
<html:input type="checkbox" id="check_1" value="true" checked="true"/>
<html:label for="check_1">Label 1</html:label>
</html:div>
<html:div id="remove_homepage_container">
<html:input type="checkbox" id="check_2" value="true" checked="true"/>
<html:label for="check_2">Label 2</html:label>
</html:div>
<html:div id="remove_newtab_container">
<html:input type="checkbox" id="check_3" value="true" checked="true"/>
<html:label for="check_3">Label 3</html:label>
</html:div>
</html:blockquote>
</html:div>
</dialog>
After adding the chrome package to chrome.manifest, this file should be accessible by :
chrome://YOUR_PACKAGE_NAME/content/PATH_TO_dialog.xul
I'm using chrome code to load the prompt, in main.js :
let Window = Cc["#mozilla.org/embedcomp/window-watcher;1"]
.getService(Ci.nsIWindowWatcher);
let arg = {
CHECK_1: false,
CHECK_2: false,
CHECK_3: false
};
let window = Window.activeWindow.openDialog("chrome://YOUR_PACKAGE_NAME/content/PATH_TO_dialog.xul", "myWindow", "chrome,modal,centerscreen", arg);
After the user has closed the prompt, the arg object will contain the checkbox values of the prompt. For example, if an user ticks all the checkboxes, the arg object will be :
{
CHECK_1 : true,
CHECK_2 : true,
CHECK_3 : true
}
And that did it for me. Have a nice day!
Related
Need to open or redirect to more than one page after a <p:commandLink/> (of the primefaces library) is clicked.
There is a List that contains the urls. I've already tried:
List<String> newUrlsList = returnNewUrlsList(oldUrl);
for (int i = 0; i < newUrlsList.size(); i++) {
//Executes the redirect for each of the elements in the list
//In every url, in the case of the method returnNewUrlsList() has encountered more than one URL
FacesContext.getCurrentInstance().getExternalContext().redirect(newUrlsList.get(i));
}
But only the first URL is opened (i=0).
Besides that I also tried javascript as below:
Link
Running:
<script type="text/javascript">
$('a.openPages').click(function (e) {
e.preventDefault();
window.open('http://www.google.com.br');
window.open('http://www.google.com.br');
window.open('http://www.google.com.br');
window.open('http://www.google.com.br');
window.open('http://www.google.com.br');
});
</script>
It works, but it is not the best method, because whenever it is necessary to open multiple tabs it displays the popup-blocked warning by the browser.
I would appreciate any good suggestion.
Thanks in advance!
You can't open several windows from Primefaces (nor any other serverside engine). You must do it from a client side, as you already did with Javascript.
You can use an EL expression to build a dynamic URL list if needed, but you'll have to use Javascript's window.open() to have more than one page opened at the same time.
As Oscar Pérez suggested it is not possible to open more than one tab from the managed bean (serverside). So we decided to display the pages that were found for the user so he can decide which one he wants to open.
So we put an dialog in the page that shows a list with the name of the pages:
<p:dialog appendTo="#(body)" header="Pages" id="urls" widgetVar="dlgUrls" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
<h:form id="formUrls">
<br/>
<p:outputLabel value="The system has encountered more than one page." style="font-size: 14px"/>
<br/>
<p:outputLabel value="Select which you wants to open:" style="font-size: 14px"/>
<br/>
<p:dataList id="dataListUrls" value="#{bean.urlsList}" var="url" type="ordered" style="font-size: 14px">
<p:commandLink value="#{url.pageName}" actionListener="#{bean.redirect(url.address)}" target="_blank" ajax="false"/>
</p:dataList>
<br/>
<br/>
<p:separator/>
<div align="center" style="background-color: #DEDEDE">
<p:commandButton value="Close" oncomplete="PF('dlgUrls').hide()" style="font-size: 14px; width: 100px"/>
</div>
</h:form>
</p:dialog>
Thanks for the help!
i am creating a firefox addon using sdk and i would like to know if there is any way to block the "Would you like to remember this password ?" popup shown by firefox password manager when logging into a website. I have tried "autocomplete" attribute but it looks like firefox has stopped supporting it from version 30. It should not show up while logging in to a website. Please advice.
After analyse FF source code I manage to fix it by adding tree additional password fields in a form.
In that case FF can not figure out what password field to use:)
<input type="password" style="display: none;"/>
<input type="password" style="display: none;"/>
<input type="password" style="display: none;"/>
<input type="password" name="pass"/>
Add popupshowing event listener and if it's the id of the password baloon, do event.preventDefault(); event.stopPropagation() to stop it's showing.
Or you can specifically target the baloon, by getting the id of it then attaching it like this:
For example:
var win = Services.wm.getMostRecentWindow('navigator:browser');
var PUI = win.document.getElementById('i dont know the id');
var previt = function(e) {
e.preventDefault();
}
PUI.addEventListener('popupshowing', previt, false);
This code attaches just to the most recent navigator browser window, you will want to iterate through all navigator browser windows, and also listen and attach to newly opened navigator:browser windows.
I'm looking to write a test to upload a file using Fluentlenium and DropZone.js (http://www.dropzonejs.com/). Dropzone.js works in a modal and then you can drag and drop or upload the normal way.
As soon as you click to upload the test crashes because your no longer in the browser.
I've found many posts getting this to work in Selenium using things like:
WebElement fileInput = driver.findElement(By.xpath("//input[#type='file']"));
fileInput.sendKeys("C:/path/to/file.jpg");
I however cannot sendKeys to anything because their isn't even an input type="file" when using DropZone.js.
The only input types I'm seeing are all type hidden.
<input type="hidden" name="key" value="temp/${filename}">
<input type="hidden" name="AWSAccessKeyId" value="secret">
<input type="hidden" name="acl" value="private">
<input type="hidden" name="success_action_redirect" value="">
<input type="hidden" name="policy" value="secret=">
<input type="hidden" name="signature" value="secret">
<input type="hidden" name="Content-Type" value="application">
We're also using Amazon Web Server to upload the documents too, it seems like everything is working off the below script:
<script id="hiddenKeyPairs" type="text/javascript">
var hiddenKeyPairs = {
key: 'temp/${filename}',
AWSAccessKeyId: 'secret',
acl: 'private',
"success_action_redirect": '',
policy: 'secret',
signature: 'secret/secret',
"Content-Type": 'application'
};
var formAction = 'https://secret.com/';
</script>
Which is located on my page.
I'm not seeing anything helpful on https://github.com/FluentLenium/FluentLenium#driver for this.
Do I need to somehow send the file to the key hash in the above script?
Any thoughts?
I'm not sure about the AWS part but I've a similar question about file upload (Programmatically upload / add file via Dropzone e.g. by Selenium), and some potential solutions. I feel they are not very robust, but basically:
Approach 1: Use Java Robot to simulate the GUI actions -
// this opens the file browser window
driver.findElement(By.id("uploadDropzone")).click();
// put the file path in clipboard, paste (C-V) to the window, enter.
StringSelection ss = new StringSelection("some file path");
Toolkit.getDefaultToolkit().getSystemClipboard().setContents(ss, null);
Robot robot = new Robot();
Thread.sleep(2000);
robot.keyPress(KeyEvent.VK_CONTROL);
robot.keyPress(KeyEvent.VK_V);
robot.keyRelease(KeyEvent.VK_V);
robot.keyRelease(KeyEvent.VK_CONTROL);
Thread.sleep(5000); // need some wait for GUI action to work...
robot.keyPress(KeyEvent.VK_ENTER);
robot.keyRelease(KeyEvent.VK_ENTER)
Approach 2: Do all in code (hacky...) - yes there is a file input element, but only defined in Dropzone.js itself, which can be selected with $(".dz-hidden-input"). But you also have to make it visible (as Selenium can only act on visible elements), then can call sendKeys on it. And after that, again in Javascript, retrieve the File object from that element, then pass to addFile(file) on the Dropzone object.
https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIPromptService#prompt_example
https://developer.mozilla.org/en/Code_snippets/Alerts_and_Notifications
Mozilla XUL offers various types of alert and notification box messages. But, still why can't we have an image in the alert message?
var prompts = Components.classes["#mozilla.org/embedcomp/prompt-service;1"]
.getService(Components.interfaces.nsIPromptService);
prompts.alert(null, contact, "No Email Address")
The above code to display an alert with custom title message. When we check the nsIPromptService, it give various options but still there is no possibility of adding an image according to my knowledge.
When we check the popup in XUL, we can add an image but the alert will display in the corner of the system because it's using the nsIAlertsService and the display of this pop-up is platform independent.
Would it be possible to have an image in the alert box or in the prompts.alert box using JavaScript in XUL?
Why don't you use a custom alert dialog as discussed HERE ?
XUL for the alert with image may be like:
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<dialog id="alertprompt" title="Alert"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:html="http://www.w3.org/1999/xhtml"
buttons="accept"
buttonlabelaccept="Ok"
height="160"
width="260"
ondialogaccept="return alert_prompt.doOK();">
<script type="application/javascript" src="chrome://hello/content/alert_prompt.js"/>
<label id="title" value="Title may go here!" align="center" class="header"/>
<html:table>
<html:tr>
<html:td>
<html:img src="Firefoxlogo.png" width="30" height="30"/>
</html:td>
<html:td>
<label id="result" value="This place will display your message." align="center"/>
</html:td>
</html:tr>
</html:table>
</dialog>
It will look something like:
Does it meet your requirement?
I have a problem with a home-made jquery widget on Firefox 4 (I have not tested other versions of Firefox).
The aim of my widget is simply to add 2 input elements after an input of type 'file'.
So here are the call to the widget and my HTML code :
<script>
$(function() {
$('#first_file, #second_file').customFileInput();
});
</script>
<div>
<input type="file" id="first_file" />
</div>
<br /><br />
<div>
<input type="file" id="second_file" />
</div>
If you disable the widget and select 2 files and then refresh the page with F5, the browser remembers both of them.
Now, here is my widget code :
(function( $, undefined ) {
$.widget('ui.customFileInput', {
_create: function() {
var self = this;
self.fileInput = self.element;
var parent = self.fileInput.parent();
self.textInput = $('<input type="text" />');
self.browseInput = $('<input type="button" value="Do it" />');
parent.append(self.textInput);
parent.append(self.browseInput);
}
});
$.extend($.ui.customFileInput, {
version: "1.0",
});
})( jQuery );
If, with the widget activated, you try to select 2 files and then press F5, only the first file has been remembered.
The source of the problem seems to be the 'append' method. But I have also tried insertAfter, insertBefore, add, wrap and other methods, but there is always the same problem.
Do someone know how to solve this ?
NB : I have tried on IE 9 but this awful browser does bot remember the field values after pressing F5, so the problem is not applicable on this browser.
EDIT : mistake corrected