I'm in the very beginning with phonegap (2.2.0). In my index.html I have a iframe to load a external facebook page, it's just a dummy page, and most of the cases it loads pretty well. But when it fails do load (didn't get it why) the entire application crushes. The iframe is loading after all the other itens of the page are loaded and when it timeouts, app crushes. I firstr tried the src on the iframe tag as well with the same result (changed to better test)
The url loading:
jQuery("#facebookIframe").attr({"src" : "https://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fcocacola&colorscheme=light&show_faces=true&border_color=%23fff&stream=false&header=false&height=186"})
The iframe
<div id="facebookFrame" style="text-align: center; width: 99%;">
<iframe id="facebookIframe" style="border: none; width: 90%;" ></iframe>
</div>
For the record, I'm using android and the error messages I get are:
"The connection to the server was unsuccessful." and TIMEOUT ERROR!
Thanks
Related
I have one cordova app that loads content directly from client website.I have used it like <content src="https://example.com/ios/index.html"> in config.xml file.I have used the splashscreen delay of 6 seconds.and the issue is when the splash screen hides shows the black screen for 5-10 seconds and after that client website content is shown.and also sometimes i am getting the error CONNECTION TO SERVER WAS UNSUCCESSFULL.I have also specified <preference name="loadUrlTimeoutValue" value="700000" /> but still having same issue.Anyone having the same issue for cordova ios and android app?can anyone help me with this issue.
You shouldn't do it like that. Now I don't want to play this script where you ask A and I tell you to do B, don't worry, but it's really not the way you should do it.
You should make cordova load an index.html which loads a javascript file cordova.js. You don't need to actually have it, the js file will be included when you compile the app.
Then you should add the whitelist plugin in case you don't already it, in order for your website to load correctly. https://www.npmjs.com/package/cordova-plugin-whitelist
You should disable auto-hide for the splashscreen in config.xml like so:
<preference name="AutoHideSplashScreen" value="false" />
You should then make the javascript load a fullscreen iframe with your website like so, then detect when loading has finished: (This should go into your index.html, in the cordova app)
<html>
<head>
<title></title>
</head>
<body>
<iframe id='frameid' onload='iframeLoaded();' src='https://mywebsite.com/mypage.html' style='border: 0; width: 100%; height: 100%'>Your browser doesn't support iFrames.</iframe>
<script src='cordova.js'></script>
<script>
iframe = document.getElementById("frameid");
iframe = document.getElementById("frameid");
function ready(callback){
// in case the document is already rendered
if (iframe.readyState!='loading') callback();
// modern browsers
else if (iframe.addEventListener) iframe.addEventListener('DOMContentLoaded', callback);
// IE <= 8
else document.attachEvent('onreadystatechange', function(){
if (iframe.readyState=='complete') callback();
});
}
ready(function(){
setTimeout(function(){
navigator.splashscreen.hide();
},555)
});
</script>
</body>
</html>
I haven't used cordova for a few months but that's how I did it if I didn't forget anything - Hoping I didn't... I didn't have time to test this, but you get the gist:
App start
Show Splashscreen
Load Index.html with Iframe in fullscreen pointing to https website.
Wait for iframe to finish loading.
Close splashscreen
Tell me if you run into any issue and I can help you further.
I've got some issue with geo location in html.
I'm developing a android app, one of the pages is webview this one loads a url I've been created.
The problem is: it ask to allow location but how to set it so always is allowed ??
Because that is not possible in Android app to request.
This is the code:
<iframe id="map_iframe" style="border:none; margin:0px; padding:0px; width:100%; height:150%;" src="https://url.com" allow="geolocation; microphone; camera; midi *; marginheight="0" marginwidth="0" frameborder="0" border="0"></iframe>
I've got some issue with geo location in html.
I'm developing an Android app, one of the pages is webview this one loads a url I've created.
The problem is: it ask to allow location but how to set it so always is allowed?
Because that is not possible in Android app to request.
This is the code:
style="border:none; margin:0px; padding:0px; width:100%; height:150%;" src="https://url.com" allow="geolocation; microphone; camera; midi *; marginheight="0" marginwidth="0" frameborder="0" border="0">
This time I try to use espresso to test my app.
I use webview to open the url and check below html code
I face the question that I can`t access the element in iframe.
<html>
<head></head>
<body>
<iframe id="mainFrame" src="Address/Default.aspx" scrolling="no"
style="border: 0px; width: 100%; height: 432px; position: absolute;">
<html>
<head></head>
<body>
<button onclick = "one function">
</body>
</html>
</iframe>
</body>
</html>
I copy the XPTH that is /html/body/button and code
onWebView().withElement(findElement(Locator.XPATH, "/html/body/button")).perform(webClick());
However, I get Atom evaluation returned null! and I can not get element.
Can espresso get element inside iframe? I can get element not in iframe.
As the button is inside an iframe, thus we need to use .inWindow(selectFrameByIdOrName("mainFrame"))
onWebView()
.inWindow(selectFrameByIdOrName("mainFrame"))
.withElement(findElement(Locator.XPATH, "/html/body/button")).perform(webClick());
Hope that helps.
I was wondering if someone could point me to what I am doing wrong exactly. I am trying to access an iframe using Android WebDriver. The iframe opens up when I click on a Sign in link on the home page. Below is a snippet of the src code that has the iframe id that I am trying to access-
<div class="dialog" style="background-color: rgb(232, 235, 238); color: rgb(51, 51, 51);">
<iframe id="registration-dialog-frame" scrolling="no" frameborder="0" src="http://test.com" border="0" allowtransparency="true" style="width: 235px;">
<html>
</iframe>
<span id="signin-cancel" class="cancelButton">Cancel</span>
I wait till the iframe opens up, check if the frame id is present and then use switchTo() to switch to that iframe like this
driver.switchTo().frame("registration-dialog-frame");
I get a
org.openqa.selenium.WebDriverException: Error: {"message":"Cannot read property 'document' of undefined"}
When I try this
driver.switchTo().frame(driver.findElement(By.id("registration-dialog-frame")));
I get a
org.openqa.selenium.WebDriverException: java.util.ArrayList cannot be cast to org.openqa.selenium.android.library.DomWindow
Is this a Android WebDriver thing? Has anyone else come across this similar kind of errors when switching to iframe? Does anyone know how I can do this?
Check the number of frames present in that page by looking at code and use index to switch into that particular frame as shown below.
driver.switchTo().frame(frameindex);
Ex: To Switch to the first frame, use below line.
driver.switchTo().frame(0);
I want to be able to create an app that uses WebView to request a url
from an external web application which returns html and css that
references images that are assets within the actual application. The
idea is basically to speed up everything so that images never have to
be downloaded.
Here is a simplified example:
Server HTML:
<html>
<head>
<style>
#myImage { background-image: url("file:///android_asset/myImage.jpg"; width: 50px; height: 50px;}
</style>
</head>
<body>
<div id="myImage"></div>
</body>
</html>
So, is there any way to be able to do this? My main goal is to just have the application request all the HTML from a server, but be able to map the image urls to local resources within the application.
Thanks in advance,
Leon
Why not to load all HTML from application side? If you bother that this web page will have no access to network - use WebView.loadDataWithBaseUrl method.
For embed images into a web page you can use data:URI scheme: http://en.wikipedia.org/wiki/Data_URI_scheme
Also you can map your application images even if you are page is loaded remotely. You can use WebView.loadUrl("javascript:....") to "send" images data via JavaScript code (also using data:URI scheme).
EDIT.
Firstly, at HTML side your example with embedded images will look something like this:
<html>
<head>
<style>
#myImage { background-image: url('data:image/png;base64,iVBORw0KG.....'); width: 50px; height: 50px;}
</style>
</head>
<body>
<div id="myImage"></div>
</body>
</html>
When, if you want to store this page at the application side, you can store it somewhere (string resource, asset folder) and when get it.
String pageResource = // get it somehow
WebView myWebView;
myWebView.loadDataWithBaseUrl(
"http://my.site.com", // The base url
pageResource, // page content to load...
"text/html", // it's MIME type...
"UTF-8", // and encoding
"http://my.site.com/page.html");
Now the WebView has loaded your page. It is loaded from local resources but from WebView point of view it is like it is loaded from the network. It has access to network resources and JavaScript code working here as well (this is the main difference between loadData and loadDataWithBaseUrl).