Using puppeteer sharp I load a page and try to read the value of an attribute.
Html page:
<body>
<img src="data:image/png;base64,R0lGOD" alt="Red dot" />
<a href="#" id="bottle">
I use this:
string awaitXPath = "//img[contains(#src, 'data:image/png;base64')][1]";
var element = await _page.WaitForXPathAsync(awaitXPath, new PuppeteerSharp.WaitForSelectorOptions() { Timeout = 5000 });
string strBase64 = await element.GetPropertyAsync("src").Result.JsonValueAsync<string>();
which is working OK for some cases, but sometimes it happens that my execution freeze when I try to GetPropertyAsync. There is a way to add a timeout to GetPropertyAsync? or maybe somebody has another idea to get #src attribute's value.
Thank you.
Use var strBase64 = await (await element.GetPropertyAsync("src")).JsonValueAsync();
Related
Given the following HTML:
<html>
<body>
<div id="first">
<div id="sub">
test
</div>
</div>
<div id="second">
</div>
</body>
</html>
According to the Chrome Developer tools, the XPath to the "test" link is
/html/body/div[1]/div/a
However, when I do
const selector ="/html/body/div[1]/div/a";
await page.waitForXPath(selector);
console.log("after waiting for selector -> selector was found");
it never passes the await page.waitForXPath(selector); line.
Can anyone explain why and how I have to modify the XPath?
I did some experimenting and waiting for an xpath works with /html/body/div[1] but not anymore with /html/body/div[1]/div, also not with /html/body/div[1]/div[1]
I am using puppeteer-core#5.3.1 and Chrome 85.0.4183.121 on Ubuntu.
Update:
Just to make sure my XPath is correct, I tested it in the Chrome Devtools console, where it works fine:
$x("/html/body/div[1]/div/a")
[a] <-- returns expected result
Still can't understand why it's not working with Puppeteer.
Try these xpath expressions and see if they work:
//div/a/text()
should return (using the html in your question) test. And
//div/a/#href
should return
test.html
Try this. It waits until test shows up and return the value.
const selector = await "/html/body/div[1]/div/a";
await page.waitForXPath(selector);
const href = await page.$x(selector);
const href_value = await page.evaluate((...href) => {
return href.map(e => e.href);
}, ...href);
await console.log(href_value);
I am failing for 2 days on trying to reload an Image using Java script.
I hope you can help!
the Image is displayed but doesnt Change after the defined 7 secunds...
it's not a server-side Problem while i can see in wireshark that the data isn't even requested by the browser...
is anyone having an idea where my Problem might be?
please see my code below for reference
<html>
<!DOCTYPE html>
<html lang="de-DE">
<head>
<bodyonload="DispayImage()">
<img src="/img/dynamic_live_1.jpg" width="600" height="450" name=Cam>
<script language="JavaScript>
var imageUrl = document.Cam.src;
var random = new Date().getTime();
var delay = 7000;
var counter = 0;
var buffer = new Image;
function DisplayImage()
{
document.Cam.src = buffer.src;
LoadNextImage();
}
function LoadBuffer ()
{
var trickname = imageUrl;
++counter;
trickname += "?counter=" + (random + counter);
buffer.src = trickname;
buffer.onload = DisplayImage;
}
function LoadNextImage()
{
setTimeout("LoadBuffer()", delay);
}
LoadNextImage();
</script>
</body>
</html>
On first sight, your "setTimeout"-call seems to be wrong:
Try
function LoadNextImage()
{
setTimeout(function() {LoadBuffer()}, delay);
}
Also, your body.onload has a wrong call, it says "DispayImage" and not "DisplayImage", but that might be a copy-paste error on your end.
Edit: Just tested the corrected code myself, and here it works (used some local images). One last error I found was that you don't close the "language"-tag:
<script language="JavaScript>
should be
<script language="Javascript">
Or, even better, the "language"-tag is not needed, all browsers use javascript as default when you use "script":
<script>/*Some code here*/</script>
I am getting next page on my wordpress blog using jquery, finding the desired div and appending it to the existing one. This part works without a problem. But, what I need to do is, to add slideDown animation to it.
This is how my working code so far looks like:
$.get(next_page, function(data) {
var response = $(data);
var more_div = $(response).find('.FeaturedRow1').html();
$('.FeaturedRow1').append(more_div).slideDown('slow');
$('.navigation').not(':last').hide();
I tried adding hide() to response, more_div as well as append lines. In the first case, I get error stating that it cannot set property display of undefined.
In the second case, in the console it display HTML and says "has no method hide". I also tried adding a line $(more_div).hide() but again, I get the error "Uncaught TypeError: Cannot set property 'display' of undefined".
If I use hide in the 3rd line
$('.FeaturedRow1').hide().append(more_div).slideDown('slow');
it hides the whole FeaturedRow1 div and animates it, that takes me to the top of the div, which is what I don't want.
EDIT: Here's the important HTML structure and jQuery code for the desired section
<div class="FeaturedRow1">
<div class="postspage">
//list of posts here
</div>
<div class="navigation">
<span class="loadless">
//hyperlink to previous page
</span>
<span class="loadmore">
//hyperlink to next page
</span>
</div>
</div>
When you click on the hyperlink inside the loadmore, the following jQuery code gets called
$('.loadmore a').live('click', function(e) {
e.preventDefault();
var next_page = $(this).attr('href');
$.get(next_page, function(data) {
var $response = $(data);
var $more_div = $response.find('.FeaturedRow1').hide();
$more_div.appendTo('.FeaturedRow1').delay(100).slideDown('slow')
$('.navigation').not(':last').hide();
});
});
$('.loadless').live('click', function(e) {
e.preventDefault();
if ($('.postpage').length != 1) {
$('.postpage').last().remove();
}
$('.navigation').last().remove();
$('.navigation').last().show();
});
You get error as you are using html method which returns a string not a jQuery object, try the following.
var $response = $(data);
var $more_div = $response.find('.FeaturedRow1').hide();
$more_div.appendTo('.FeaturedRow1').delay(100).slideDown('slow');
//$('.navigation').not(':last').hide();
Update:
$.get(next_page, function(data) {
var $response = $(data);
var more_div = $response.find('.FeaturedRow1').html();
$('<div/>').hide()
.append(more_div)
.appendTo('.FeaturedRow1')
.delay(100)
.slideDown('slow')
$('.navigation').not(':last').hide();
});
There's something arcane going on with my custom CKEditor uploader. The image or whatever file I try to upload to the server is correctly uploaded but no matter what I do it's link won't show up in the editor. It looks like the callback to CKEditor in my upload_file.html view doesn't work as it should. The documentation of CKEditor is really sparse about these things, so I could really use some guidance here.
In my controller I have the following upload function:
def upload_file():
upload = request.vars.upload
if upload != None:
if hasattr(upload, 'file'):
old_filename = upload.filename
new_filename = db.files.uploaded_data.store(upload.file, upload.filename)
result = db.files.insert(filename = old_filename,
uploaded_data = new_filename,
created_on = datetime.today())
if not result:
message = T('An error has occured during upload.')
url = ''
else:
message = T('File uploaded succesfully.')
url = URL(r = request, f = 'download', args = new_filename)
return dict(form = None, cknum = request.vars.CKEditorFuncNum, url = url, message = message)
else:
raise HTTP(401, T('Upload is not proper type.'))
else:
form = SQLFORM(db.files, fields = ['uploaded_data'])
upload = request.vars.uploaded_data
if upload != None:
form.vars.filename = upload.filename
form.vars.created_on = datetime.today()
if form.process().accepted:
response.flash = T('File uploaded successfully!')
elif form.errors:
response.flash = T('form has errors')
else:
response.flash = T('please fill out the form')
return dict(form = clean_form(form))
The view for this function looks like this:
{{if form != None:}}
{{extend 'layout.html'}}
{{=form}}
{{else:}}
<html>
<body>
<script type="text/javascript">
window.opener.CKEDITOR.tools.callFunction({{=cknum}}, '{{=url}}', '{{=message}}');
</script>
</body>
</html>
{{pass}}
I have a test view with a form containing several textareas all of which are properly converted to editors:
{{extend 'layout.html'}}
<script type="text/javascript">
CKEDITOR.config.filebrowserBrowseUrl = "{{=URL(request.application, c='default', f='upload_file')}}";
CKEDITOR.config.filebrowserUploadUrl = "{{=URL(request.application, c='default', f='upload_file')}}";
CKEDITOR.config.filebrowserWindowHeight = '60%';
CKEDITOR.config.filebrowserWindowWidth = '70%';
</script>
{{=form}}
I finally found the solution. There's a mistake in the view of the upload_file function.
window.opener.CKEDITOR.tools.callFunction({{=cknum}}, '{{=url}}', '{{=message}}');
should be rewritten to this:
window.parent.CKEDITOR.tools.callFunction({{=cknum}}, '{{=url}}', '{{=message}}');
I copied the first version, which caused me quite a lot of headache, from web2pyslices, so I write this answer here in the hope that it will help others trying to integrate CKEditor with Web2py.
I'm writing a sidebar extension for Firefox and need a way to get the URL of the current page so I can check it against a database and display the results. How can I do this?
I stumbled over this post while looking for an answer to the same question.
Actually I think it's as easy as
alert(window.content.location.href)
See also https://developer.mozilla.org/en/DOM/window.content
window.top.getBrowser().selectedBrowser.contentWindow.location.href;
might work, otherwise I think you need to use:
var mainWindow = window.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
.getInterface(Components.interfaces.nsIWebNavigation)
.QueryInterface(Components.interfaces.nsIDocShellTreeItem)
.rootTreeItem
.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
.getInterface(Components.interfaces.nsIDOMWindow);
mainWindow.getBrowser().selectedBrowser.contentWindow.location.href;
This seems to work fine for me
function getCurrentURL(){
var currentWindow = Components.classes["#mozilla.org/appshell/window-mediator;1"].getService(Components.interfaces.nsIWindowMediator).getMostRecentWindow("navigator:browser");
var currBrowser = currentWindow.getBrowser();
var currURL = currBrowser.currentURI.spec;
return currURL;
}
https://developer.mozilla.org/En/Working_with_windows_in_chrome_code
If you need to access the main browser from the code running in a sidebar, you'll something like what Wimmel posted, except the last line could be simplified to
mainWindow.content.location.href
(alternatively you could use 's API returning an nsIURI).
Depending on your task, it might make sense to run the code in the browser window instead (e.g. in a page load handler), then it can access the current page via the content shortcut and the sidebar via document.getElementById("sidebar").contentDocument or .contentWindow.
If you need only domain and subdomain;
Usage;
PageDomain.getDomain(); // stackoverflow.com
PageDomain.getSubDomain(); // abc.stackoverflow.com
Code;
PageDomain = {
getDomain : function() {
var docum = Components.classes["#mozilla.org/appshell/window-mediator;1"].getService(Components.interfaces.nsIWindowMediator).getMostRecentWindow("navigator:browser");
var domain = PageDomain.extractDomain(new String(docum.location));
return domain;
},
getSubDomain : function() {
var docum = Components.classes["#mozilla.org/appshell/window-mediator;1"].getService(Components.interfaces.nsIWindowMediator).getMostRecentWindow("navigator:browser");
var subDomain = PageDomain.extractSubDomain(new String(docum.location));
return subDomain;
},
extractDomain: function(host) {
var s;
// Credits to Chris Zarate
host=host.replace('http:\/\/','');
host=host.replace('https:\/\/','');
re=new RegExp("([^/]+)");
host=host.match(re)[1];
host=host.split('.');
if(host[2]!=null) {
s=host[host.length-2]+'.'+host[host.length-1];
domains='ab.ca|ac.ac|ac.at|ac.be|ac.cn|ac.il|ac.in|ac.jp|ac.kr|ac.nz|ac.th|ac.uk|ac.za|adm.br|adv.br|agro.pl|ah.cn|aid.pl|alt.za|am.br|arq.br|art.br|arts.ro|asn.au|asso.fr|asso.mc|atm.pl|auto.pl|bbs.tr|bc.ca|bio.br|biz.pl|bj.cn|br.com|cn.com|cng.br|cnt.br|co.ac|co.at|co.il|co.in|co.jp|co.kr|co.nz|co.th|co.uk|co.za|com.au|com.br|com.cn|com.ec|com.fr|com.hk|com.mm|com.mx|com.pl|com.ro|com.ru|com.sg|com.tr|com.tw|cq.cn|cri.nz|de.com|ecn.br|edu.au|edu.cn|edu.hk|edu.mm|edu.mx|edu.pl|edu.tr|edu.za|eng.br|ernet.in|esp.br|etc.br|eti.br|eu.com|eu.lv|fin.ec|firm.ro|fm.br|fot.br|fst.br|g12.br|gb.com|gb.net|gd.cn|gen.nz|gmina.pl|go.jp|go.kr|go.th|gob.mx|gov.br|gov.cn|gov.ec|gov.il|gov.in|gov.mm|gov.mx|gov.sg|gov.tr|gov.za|govt.nz|gs.cn|gsm.pl|gv.ac|gv.at|gx.cn|gz.cn|hb.cn|he.cn|hi.cn|hk.cn|hl.cn|hn.cn|hu.com|idv.tw|ind.br|inf.br|info.pl|info.ro|iwi.nz|jl.cn|jor.br|jpn.com|js.cn|k12.il|k12.tr|lel.br|ln.cn|ltd.uk|mail.pl|maori.nz|mb.ca|me.uk|med.br|med.ec|media.pl|mi.th|miasta.pl|mil.br|mil.ec|mil.nz|mil.pl|mil.tr|mil.za|mo.cn|muni.il|nb.ca|ne.jp|ne.kr|net.au|net.br|net.cn|net.ec|net.hk|net.il|net.in|net.mm|net.mx|net.nz|net.pl|net.ru|net.sg|net.th|net.tr|net.tw|net.za|nf.ca|ngo.za|nm.cn|nm.kr|no.com|nom.br|nom.pl|nom.ro|nom.za|ns.ca|nt.ca|nt.ro|ntr.br|nx.cn|odo.br|on.ca|or.ac|or.at|or.jp|or.kr|or.th|org.au|org.br|org.cn|org.ec|org.hk|org.il|org.mm|org.mx|org.nz|org.pl|org.ro|org.ru|org.sg|org.tr|org.tw|org.uk|org.za|pc.pl|pe.ca|plc.uk|ppg.br|presse.fr|priv.pl|pro.br|psc.br|psi.br|qc.ca|qc.com|qh.cn|re.kr|realestate.pl|rec.br|rec.ro|rel.pl|res.in|ru.com|sa.com|sc.cn|school.nz|school.za|se.com|se.net|sh.cn|shop.pl|sk.ca|sklep.pl|slg.br|sn.cn|sos.pl|store.ro|targi.pl|tj.cn|tm.fr|tm.mc|tm.pl|tm.ro|tm.za|tmp.br|tourism.pl|travel.pl|tur.br|turystyka.pl|tv.br|tw.cn|uk.co|uk.com|uk.net|us.com|uy.com|vet.br|web.za|web.com|www.ro|xj.cn|xz.cn|yk.ca|yn.cn|za.com';
domains=domains.split('|');
for(var i=0;i<domains.length;i++) {
if(s==domains[i]) {
s=host[host.length-3]+'.'+s;
break;
}
}
} else {
s=host.join('.');
}
// Thanks Chris
return s;
},
extractSubDomain:function(host){
host=host.replace('http:\/\/','');
host=host.replace('https:\/\/','');
re=new RegExp("([^/]+)");
host=host.match(re)[1];
return host;
}
}
From a Firefox extension popup ;
You'll need
"permissions": [
"activeTab"
]
in your manifest or possibly tabs instead of activeTab
async function getCurrentTabUrl(){
let tabs = await browser.tabs.query({active: true, currentWindow: true}) ;
return tabs[0].url ;
}
let hostUrl = await getCurrentTab();
alert(hostUrl);
This works from a firefox "popup" extension.
browser.tabs.query({active: true, windowId: browser.windows.WINDOW_ID_CURRENT})
.then(tabs => browser.tabs.get(tabs[0].id))
.then(tab => {
console.log(tab);
});
Hallo,
I have tried to implement this in JavaScript, because I need that in my project too, but all three possible solutions didn't work. I have also implemented a small site to test it, but this also didn't work.
Here is the source code of the small site:
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function Fall1 () {
alert(window.top.getBrowser().selectedBrowser.contentWindow.location.href);
}
function Fall2() {
var mainWindow = window.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
.getInterface(Components.interfaces.nsIWebNavigation)
.QueryInterface(Components.interfaces.nsIDocShellTreeItem)
.rootTreeItem
.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
.getInterface(Components.interfaces.nsIDOMWindow);
alert(mainWindow.getBrowser().selectedBrowser.contentWindow.location.href);
}
function Fall3() {
alert(document.getElementById("sidebar").contentWindow.location.href);
}
</script>
</head>
<body>
<form name="Probe" action="">
<input type="button" value="Fall1"
onclick="Fall1()">
<input type="button" value="Fall2"
onclick="Fall2()">
<input type="button" value="Fall3"
onclick="Fall13()">
</form>
</body>
</html>