I am using gwt with google maps api and i have a set of tabbed infowindows. in one of them i want to have a recent tweets script running. it works fine in firefox, but it comes up as blank in ie and chrome. heres the HTML that im putting in the tab:
HTML recentTweets = new HTML(
"<body>"+
"<div style='color: #ffffff; background-color: #010101'>"+
"<script type='text/javascript' src='http://twitter.com/javascripts/blogger.js'></script>"+
"<script type='text/javascript' src='http://twitter.com/statuses/user_timeline/stephenathome.json?callback=twitterCallback2&count=3'></script>"+
"</div>"+
"</body>");
does anyone understand why this may be happening? thanks!
To add to what Javier Badia wrote, your best chance of making web pages that work in all popular browsers is to (1) use validators to make sure that your HTML and CSS adhere to standards, and (2) Understand which bits of the standard make certain browsers cranky.
There are many validators. I favor Marc Gueury's HTML Validator plugin for Firefox because it validates every page brought up without you having to ask it to. In the lower right corner of the browser window it puts a green checkbox or a red X right where it'll catch your eye. Having it "always on" makes it pretty much painless. Also, it validates offline, so there's no need to submit your page to an external server. Depending upon your needs, there may be other HTML validators that will suit you as well or better.
I won't recommend a CSS validator because I haven't found the good one yet.
That HTML is, forgive me, horrible. You have quotes in the wrong places (for example in the style attribute of the div), have body inside a table inside a tr inside a td (it should be the other way around). It's highly probable that Firefox manages to do something with it, but other rendering engines give up and display nothing. The HTML should look like this:
<body>
<div style="color: #ffffff; background-color: #010101">
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascrip\" src="http://twitter.com/statuses/user_timeline/Stephenathome.json?callback=twitterCallback2&count=5"></script>
</div>
</body>
Which translated to Java is:
HTML recentTweets = new HTML(
"<body>"+
"<div style='color: #ffffff; background-color: #010101'>"+
"<script type='text/javascript' src='http://twitter.com/javascripts/blogger.js'></script>"+
"<script type='text/javascript' src='http://twitter.com/statuses/user_timeline/Stephenathome.json?callback=twitterCallback2&count=5'></script>"+
"</div>"+
"</body>");
If this is part of a GWT project is it happening locally? If so the problem is most likely just due to restrictions on local files place the project on a remote web server and it should work fine.
Related
The company I work for is (most likely) going to be adding spot.im (now Open Web) message boards to some of our pages to boost traffic. My boss is asking QA to look at automating some tests and to check out the admin and the controls available to us.
I have been unable to interact with any of the message board elements using the normal Java/Selenium way :i.e.
driver.findElement(By.className("spcv_sort-by-value")).click();
or by using the (JavascriptExecutor)driver; method.
I don't detect any iframes or Window Handles and am out of ideas as I think it is all being written out by JS from somewhere I can't find identify.
I am using this block of code that I found online as a local HTML file to experiment with. Supposedly it boils down all the spot.im/OpenWeb code that I would need for testing.
Can the elements be interacted with at all? Am I out of luck? Thanks in advance for any help/ideas on how to move forward!
Here is the entire code block from my test.HTML file I have in Notepad:
<div style="border:solid 0px red; width:99%; margin:2% auto 0 auto; padding:1% 1% 0 1%; background-color:#fff;">
<script async src="https://launcher.spot.im/spot/sp_HQI9uHrd"
data-spotim-module="spotim-launcher"
data-post-id="CD6BBC"
data-messages-count="10">
</script>
</div>
I am kind of desperate here.
For a couple of days I have been trying to create a web scraper that can go through our website and check for Javascript errors.
The big problem is that I only know Java and it seems that GhostDriver isn't maintained anymore. The guy from Ghostdriver refers to JbrowserDriver.
JBrowserDriver however has no option to collect the Javascript errors from the console.
Then I tried HTMLUnit which is way to eager on throwing errors, not javascript related. So after fiddling with it half a day, I threw in the towel on HtmlUnit.
I could revert to plain old WebDriver but that would involve too much boilerplate.
Does anyone of you guys have any suggestions?
You could inject some javascript into the head section of each window to log all errors into a hidden div. Selenium could then get the text from this div and parse it into a report of all errors that occurred on the page.
For example, given the following page layout:
<html>
<head>
<script>
window.onerror = function(e) {
document.getElementById("hidden-selenium-log").innerText += e.toString() + ";";
}
</script>
</head>
<body>
<div id="hidden-selenium-log" style="display: none;">
</div>
<div id="broken-button" onclick="unknownFunction()">broken</div>
</body>
</html>
The script in the head tag would write all javascript errors into the div hidden-selenium-log. Clicking on the div broken-button would trigger the error event handler and log it into the hidden selenium log.
After interacting with the page, you could then do something simple like:
Driver.FindElement(By.Id("hidden-selenium-log")).text.split(";");
This would get the text in the hidden selenium log and then split it by the semi-colon, a character I appended after each error logged.
Logging of javascript is disabled by default. You can enable it via the settings builder.
Settings settings = Settings.builder()
.logJavascript(true)
.build();
JBrowserDriver jBrowserDriver = new JBrowserDriver(settings);
jBrowserDriver.get("http://example.com");
Logs logs = jBrowserDriver.manage().logs();
LogEntries logEntries = logs.get("javascript");
logEntries.forEach(System.out::println);
I have gwt app with payment feature. I would like to insert into UIBinder following code (provided by authorize.net for verified merchants. I added my site to Verified Merchant Seal Domains List on authorize.net server):
<div class="AuthorizeNetSeal">
<script type="text/javascript" language="javascript">var ANS_customer_id="MY_ID";</script>
<script type="text/javascript" language="javascript" src="//verify.authorize.net/anetseal/seal.js"></script>
MerchantServices
</div>
I tried following:
UIBinder:
<g:HTMLPanel>
<div class="AuthorizeNetSeal">
Merchant Services
</div>
</g:HTMLPanel>
and in constructor of the control after initWidget(...)
ScriptInjector.fromString("var ANS_customer_id = 'MY_ID';").inject();
ScriptInjector.fromUrl("//verify.authorize.net/anetseal/seal.js").inject();
Tried scheduleDeferred. Tried setCallback() for ScriptInjector.fromUrl. Success method is called.
But seal doesn't appear.
please help
Thanks
Add script elements to the head section of your host page. If scripts are small and/or you do not use code splitting, there is little to no advantage in using a ScriptInjector.
Verify with your browser console that the script loads correctly from a URL you provided.
You need to inject them in the correct window:
ScriptInjector.fromString("var ANS_customer_id = 'MY_ID';").setWindow(ScriptInjector.TOP_WINDOW).inject();
But the seal.js uses document.write so it cannot be injected that way anyway, it must be present in the HTML document when loaded by the browser.
You could put this snippet in your HTML host page in a hidden <div> that you later relocate (Document.get().getElementById(…) and other appendChild DOM methods) where you want it within your app.
…and you should ask Authorize.net to provide an async version of their script so that if their servers are slow they don't slow down the loading of your app.
Thanks for your answers. I created separate HTML page with html code above and inserted it to iframe.
I am generating an HTML email using a java program and need a Hide/Show button for some queries,
What would be an ideal approach for this?, shd i call a javascript from java program to do the same?.
I have a javascript module to do the show/hide feature but not sure how to integrate this to a java program.
Thanks..
Javascript is completely independent from any server-side framework or language, such as Java.
If you want to show or hide an HTML element on a page, try the following JS code:
document.getElementById("id").style.display = 'none';
And then, when you generate the HTML email using Java, include the queries you want to hide in a <div> with a specified ID.
Add a class to your generated html tags and use css to control the visibility and other styling.
<style type='text/css'>
.hid {display: none;}
</stle>
<div class='query1 hid'>...</div>
<div class='query2'>...</div>
<div class='query1 hid'>...</div>
Then update your javascript to manipulate the class attribute.
//in jQuery...
$("btn1").click(function() {
$(".query2").addClass("hid");
$(".query1").removeClass("hid");
});
When clicking a button, my GWT application returns a PDF file embedded in an HTML page which looks something like:
<html><head></head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<embed width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" type="application/pdf">
</body>
</html>
Problem is it can take a while for the server to create this PDF file, so what I want is a waiting screen with a loading animation which can have the PDF file download in the background, and then when the file is done, display the page as described above.
One obvious way would be to display a loading page, send an asynchronous command to the server and then once the onSucceed method is called, call the page as normal. Downside is I'd have to add some server-side logic for making the PDF creation work in the background...
Is there any way to do this client-side with the GWT API?
Did you see this stackoverflow question Detect when browser receives file download? Basically the answer given is that you set a cookie in the return response and wait on the client side for this cookie to be set. This can be done easily with GWT as it has a Scheduler (for the repeated timer check) and easy access to Cookies. You still need to make some server changes, but you don't have to create a background process.
I don't have the full answer, but the following code works for me in Safari, and maybe you can modify it, to make it work with other browsers, too (?):
<html><head>
<script type="text/javascript">
function showPdf() {
document.getElementById("loading").style.visibility = "hidden";
document.getElementById("pdf").style.visibility = "visible";
}
</script>
</head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<div id="loading"
style="position: absolute; background-color: white;">Loading...</div>
<iframe id="pdf" width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" onload="javascript:showPdf();"
style="visibility: hidden;"></iframe>
</body>
</html>
This is pure JavaScript - but could certainly be done with GWT, too. Note, that I'm using an iframe instead of embed, because embed doesn't really support the onload method (and embed is not a standard HTML element, as far as I remember).
The reason, why this may not be the full answer, is that Chrome fires the onload event as soon as the PDF starts downloading (but after the PDF generation on the server side has finished). I'm not sure, if this is what you want?