I would like to get the event when the user click on anywhere on the webview.
I tried to add a listener like :
function EnablelistenerClick() {
webview.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
// DO SOMETHING
});
}
But I catch none of the event. Is it possible to catch event like onClick when the user click on a tag div with onClick="javascript:...." ?
Finally I found a way by using webview.addEventListener('loadstart', function(e) {
console.log("loadstart");
});
Related
So I have a html page which has a paragraph and button. When the button is clicked, the paragraph hides. I'm trying to automate this in Casperjs. So far, I load the page, take a screenshot, then click the button and take another screenshot. However, the screenshots are the same
var casper = require('casper').create();
casper.start('http://localhost:3000/example.html', function() {
this.echo("Loaded successfully.");
casper.capture("screenshot1.png");
});
casper.then(function() {
this.evaluate(function() {
this.click('//*[#id="hide"]')
});
});
casper.then(function(){
casper.capture("screenshot2.png");
});
casper.run();
Any ideas?
You can't use this.click() in evaluate() because the code in evaluate() will execute the code as if you were using the browser console.You can use javascript to get the element and use its click() event or you can just use this.click() directly.Anyway,don't use this.click() in evaluate().
This Could be the code if your button id='hide' as you describe your question:
var casper = require('casper').create();
casper.start('http://localhost:3000/example.html', function() {
this.echo("Loaded successfully.");
casper.capture("screenshot1.png");
casper.click('#hide'); // Clicking button with Id='hide'
casper.capture("screenshot2.png"); // capture after clicking button
});
// Execute the whole process
casper.run();
May this will helpful to you! Tx
I have an extension that has content_script, background_page and page_action with popup.
So, popup has several controls, when user presses on control the popup should send a command to start work. Content script starts work, and should send an updates to popup.
The problem is that I'm not sure I implemented updates part properly.
Content script:
function notifyProgress(thing) {
console.log('Notify progress');
chrome.runtime.sendMessage({req: 'Progress', thing: thing});
}
Background page:
var channel;
chrome.runtime.onConnect.addListener(function (port) {
if (port.name == 'service-channel') {
channel = port;
port.onMessage.addListener(function (msg) {
console.log('Background received event', msg);
...
});
}
});
...
chrome.runtime.onMessage.addListener(function (msg, sender, callback) {
console.log('On message in background', msg);
if (msg.req == '...') {
...
} else if (msg.req == 'Progress') {
console.log('Got Progress for ' + sender.tab.id);
channel.postMessage(msg);
}
});
Popup:
var channel = chrome.extension.connect({name: 'service-channel'});
channel.onMessage.addListener(function (message) {
if (message.req == '...') {
...
} else if (message.req == 'Progress') {
updateListener(message.req, {thing: message.thing}); // updates UI
} else
console.log('Ignoring', message);
});
Also I have worries about multiple working content scripts sending Progress events.
Is there a simpler or better way of doing this?
Edit.
What is best practices of implementing Popup updates from Content Script?
Is it possible to detect a shift-click or command-click on a browser action button in the chrome bar?
For example, the following code does not work:
chrome.browserAction.onClicked.addListener(function(e) {
console.log(e.shiftKey) // is undefined
});
I've found a way to accomplish this. In my case, I needed to detect a ctrl-click and a ctrl-alt-click event on the toolbar icon.
Apparently the background script cannot capture keyboard events, but the content script can. So I set an event listener in the content script to listen for ctrl and alt keypresses and send a message to the background script. As it happens, the keydown event has boolean properties for ctrlKey and altKey built in so I did't have to implicitly check the value of the keypress. In your case, can use the shiftKey property.
content.js
window.addEventListener('keydown',function(event){
if(event.ctrlKey){
chrome.runtime.sendMessage({type: 'ctrlPressed'}, function(){});
}
if(event.altKey){
chrome.runtime.sendMessage({type: 'altPressed'}, function(){});
}
});
window.addEventListener('keyup',function(event){
chrome.runtime.sendMessage({type: 'keyup'}, function(){});
});
background.js
var ctrlPressed = false;
var altPressed = false;
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
switch(request.type){
case 'ctrlPressed':
ctrlPressed = true;
break;
case 'altPressed':
altPressed = true;
break;
case 'keyup':
ctrlPressed = false;
altPressed = false;
break;
}
});
Now my chrome.browserAction.onClicked.addListener can detect a click, double-click, ctrl-click, and ctrl-alt-click. (With just a little more code I could also detect ctrl-double-click and ctrl-alt-double-click.) The only caveat is that the active tab must have focus to capture keypresses. The window.focus() line at the end of the routine should handle that.
background.js
// Listen for toolbar icon clicks
var clickCnt = 0;
chrome.browserAction.onClicked.addListener(function(tab){
clickCnt++;
if(clickCnt > 1){
console.log('Double click detected');
clickCnt = 0;
clearTimeout(timer);
}else{
if(ctrlPressed){
if(altPressed){
console.log('ctrl-alt-click detected');
}else{
console.log('ctrl-click detected');
}
}
timer = setTimeout(function(){
console.log('Single click detected');
clickCnt = 0;
}, 250);
}
window.focus()
});
No, it's not provided by the API. You can't detect modifiers, or different mouse buttons.
Chrome API events are not DOM events, looking for e parameter won't help. Each event has its own list of parameters passed to the callback; look it up in the documentation.
In case of the browserAction.onClicked:
The callback parameter should be a function that looks like this:
function(tabs.Tab tab) {...};
tabs.Tab tab
So the only information you get is the current tab at the time the button was clicked.
Hello I have a problem with Select2 component because this code that capture onChange event:
$(document).ready(
function() {
x$("#{id:comboBox1}").select2().on("change", function(e) {
XSP.partialRefreshPost("#{id:divView}",{
onStart: function () {
// do something when the partial update is finished
alert("start...")
},
onComplete: function () {
// do something when the partial update is finished
alert("stop...")
}
});
} )
}
);
Generate in Google Chrome this error that doesn't resolve x$() function (If you reload the page work)
In Internet Explorer work well..I don't know how solve.
Uncaught TypeError: undefined is not a function home.xsp:129x$ home.xsp:129j jquery-1.11.0.min.js:2k.fireWith jquery-1.11.0.min.js:2n.extend.ready jquery-1.11.0.min.js:2K jquery-1.11.0.min.js:2
Have someone any suggest?
Tnx you
Try using XSP.addOnLoad() instead of $(document).ready() in order for your function to run when the document has been fully loaded by XPages.
I'm not good at JS and I'm having some -I hope- stupid problem I'm not seeing on my code... if you guys could help me out, I'd really appreciate it.
My extension does some stuff with the current tab's URL. It worked ok using the onUpdate event on my background page, setting the tab's URL on a variable and then I used it on a pop-up.
The thing is that if the user starts, selecting different tabs, without updating the URLs my event won't be triggered again... so I'm now also listening to the onSelectionChanged event.
The thing is that there's no "tab" object within the onSelectionChanged event's parameters, so I cannot ask for the tab.url property.
I tried to use the chrome.tabs.getCurrent() method, but obviously I'm doing something wrong... and I reached the limit of my -very little- knowledge.
Here's the code, if you guys could take a look and point me in the right direction, I'll really appreciate it.
<script>
var tabURL = '';
var defaultURLRecognition = [ "test" ];
// Called when the url of a tab changes.
function checkForValidUrl(tabId, changeInfo, tab) {
//THIS IS WHAT'S NOT WORKING, I SUPPOSE
if (tab==undefined) {
chrome.tabs.getCurrent(function(tabAux) {
test = tabAux;
});
}
//
// If there's no URLRecognition value, I set the default one
if (localStorage["URLRecognition"]==undefined) {
localStorage["URLRecognition"] = defaultURLRecognition;
};
// Look for URLRecognition value within the tab's URL
if (tab.url.indexOf(localStorage["URLRecognition"]) > -1) {
// ... show the page action.
chrome.pageAction.show(tabId);
tabURL = tab.url;
}
};
// Listen for any changes to the URL of any tab.
chrome.tabs.onUpdated.addListener(checkForValidUrl);
// Listen for tab selection changes
chrome.tabs.onSelectionChanged.addListener(checkForValidUrl);
</script>
I would do something like this:
function checkForValidUrl(tab) {
//...
}
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
if(changeInfo.status == "loading") {
checkForValidUrl(tab);
}
});
chrome.tabs.onSelectionChanged.addListener(function(tabId, selectInfo){
chrome.tabs.getSelected(null, function(tab){
checkForValidUrl(tab);
});
});