Strange UIWebView Bug/Behavior - ios

We have a UIWebView in our app, displaying HTML data loaded from memory (not a file). We are experiencing some very strange bug/behavior. Some pages take very long time to render (1-2 minutes). We looked at the source of the pages, and it is indeed very busy with badly written CSS and HTML (not in our control). However, we noticed that if we set a webview to load a page, and then press the power button to shut the iPhone's screen, then immediately press the power button again, and go back to our app, the webview renders the page instantly.
Has anyone experienced this? Any ideas what's going on?

So, uhm, forgot to answer this. It ended up that some of our HTML data had images that were linking to internal organization URLs, which were not accessible outside. And since the web view did not ask the delegate whether it should load, we didn't know about those resources. Pressing the power button caused the connections to drop, which made it render the page.

Related

Different behaviour in WKWebview and Safari regarding CSS

There seem te be some subtle differences in the Implementation or configuration between WBWebView and Safari (and SFSafariViewController) that renders a part of the Website I want to display unusable.
Here is what I am trying to do:
Basically all that is needed is an "App" that just opens a specific website in fullscreen mode, so no chrome, URLs or additional navigaton buttons are present. The Website works fine on Safari on iOS (and every other (modern) browser on desktop or mobile) but the menu does not when embedded in the App.
All I did was creating a new single view Application in Xcode, drop in a WKWebView and have it load the URL. The part of the page not working is this menu component that is used throughout the site: http://tympanus.net/codrops/2013/04/19/responsive-multi-level-menu/ So basically the user has no way to navigate. While debugging the website it seems like when I push the menu button the menu does not expand like it should because the changed css classes dont get picked up correctly. If I manually toggle the css classes on the menu-element it gets displayed correctly. It makes me wonder if there are some additonal constraints related to WKWebView?
Can anyone tell me if there are any settings or configurations I can alter that allow the website in WKWebView to behave exactly the same as it would under Safari?
As far as I understand SFSafariViewController I always get the browser toolbar and navigational elements which I dont want to have in the app, so that is not an option- or is there a way to get rid of that?
Any help or pointers would be greatly appreciated :)

iOS Safari/Chrome focusing HTML Selects Freezes the browser

I saw that a similar question has been asked awhile ago, but it never had a real solution.
I have a page with about 30-40 inputs/selects. Some of them are within hidden divs at some points. The inputs don't give me any problems. But, sometimes when clicking one of the 10 selects, the browser locks up (in Safari and Chrome). It doesn't always do it, but when it does the browser usually crashes or is frozen for about 20-30 seconds.
Is there any known Solution to fix this problem? Is there any way to get around this without making some custom designed select options with html/javascript?
I don't have any hidden inputs by the way.

How to avoid a blink when UIWebView loads HTML

I have a native iOS app that contains a tab bar. The view controller for each tab contains a UIWebView. When the user switches between tabs, I load the HTML in the corresponding web view. The HTML is fully cached on a device. Here is how I feed the HTML to UIWebView:
[self.webView loadHTMLString:htmlString baseURL:baseUrl];
baseUrl is a file URL pointing to a directory where all assets are located.
This works great in online and offline modes, however it takes time for the UIWebView to parse and render the HTML. As a result, the user sees a brief blink of a white background when switching between tabs. I'd like to remove it, because the user is able to tell that the UI is not native (native UI renders instantly).
I was thinking about taking a screenshot of the UIWebView once it's done rendering the HTML and caching it in memory. The next time the user navigates to that web view, the app displays the screenshot while the UIWebView is rendering the HTML in the background. Finally, the app swaps the screen shot with the actual UIWebView and takes a new screenshot. This is similar to how Google Chrome app works.
Does anyone know a better solution to this problem?
Depends on how you present that web view. I'm not really sure from your description how you do it, but since you're talking about a blink of white background, I'm going to assume there is a situation where you have a web view with a loaded html and then you switch it to another html. The solution for that case would be:
create a second web view,
load the new html to this new web view,
when that web view finishes loading html (you can find out if you use UIWebViewDelegate) you can then quickly switch it with your old web view (meaning you finally add the new web view to the view hierarchy at THIS point, not when you created it).
This way you'll have an instant switch between old and new html, however user will be left waiting and it is your decision what to do with it. You could use UIActivityIndicatorView for example.
When webViewDidFinishLoad: gets called you can do any number of things, make the webview visible, remove something that you had on top of the webview etc...

UIWebView loading but not displaying content

UIWebView successfully loaded content, but is not displaying it. UIWebView is just white screen. BUT, if you click on this UIWebView it will process your click. For example, if you click at place where the link should be (but in fact the white space), the click processed and next page loaded and displayed OK.
The bug is unstable. I got it only with local HTML file (our homepage, it generated locally), web content loads OK. It happens in 20% cases. But in the same time, it is very sticky. Once got white screen, you can reload this page many times and see white screen (but if you click on invisible link, another page displayed successfully). Sometimes it occasionally appears without any reason. Your can "scroll" this blank screen up and down and it occasionally loaded. This local HTML has a lot of stuff, embedded images, javascripts, etc, and it could be javascript problem, but I can't explain how it can be, that content invisible, but still clickable.
It happens in iPod real device and iPhone simulator 4.3, but can't reproduce it on iPad or iPad simulator.
I spent a whole day trying resolve this. Any ideas?
I solved this!
This really weird behaviour of UIWebView was caused by javascript code. The javascript was like (simplified):
<script>
function onLoad() {
location.href='xxx://pageLoaded';
}
</script>
<body onload='onLoad();'>
The idea of this code was to inform app about the fact that page was loaded. In the app I catch request to xxx://pageLoaded and cancel it (in shouldStartLoadWithRequest). Because request cancellation, I didn't expect any problems here. Espesially, I didn't expect that content will become invisible, but still clicable. I added timer (setTimeout) between onload fires and location.href change. It solves the problem.
NOTE: I know about webViewDidFinishLoad event in UIWebView. This is very simplified example just to explain the problem and the solution. Real javascript is more sophisticated and what it is doing can't be reached by simple use webViewDidFinishLoad.

iPad Home Screen App refreshes on every open

I'm writing a web app for the iPad using HTML5 and SenchaTouch. The app uses cache manifest to function offline. Once it has been added in the home screen and opened without Safari, it will refresh itself every time it is opened, even if just navigating to the home screen and back. The desired behavior is to leave the app, do something else, and then come back to the app with everything untouched.
An example of a similar app that displays the same (undesired) behavior can be found here: http://ignitedmediadesign.com/WebApp/index.html
I've read that using a cache manifest should have solved this problem on iPhone ( http://www.stevesouders.com/blog/2011/06/28/lack-of-caching-for-iphone-home-screen-apps/ ), but doesn't seem to have done the trick for either iPhone or iPad.
Is there another way to fix this? Is there some secret to cache manifest files that stops this that I may have missed?
I'm under the impression this is simply the nature of the "home screen" web apps that operate outside of normal Safari. I have an app that operates just fine in Safari with some minimal state saving, but the blasted non-Safari version refreshes every time. EDIT: Even the showcased O’Reilly example that uses a cache manifest reloads every time when added to the home screen.
You may want to look into creating "routes" (URL fragments) that point to a controller/action pair. Look into the MVC PhoneGap example (If not using PhoneGap, you can scroll past all of that stuff and implement your own data model and store). Also see this Sencha Touch MVC tutorial.
Also, most of the rendered sencha touch components seem to maintain state between changes of the active item. For example. I have a main TabPanel that contains all sub panels. When switching between tabs on the main TabPanel's TabBar, each sub panel maintains its rendering, unless I've set a listener or controller action to do otherwise.
Hope this helps.

Resources