I've written an application that works great in the desktop browser but breaks in Safari.
Does Angularjs support the iPad's native browser?
I've been googling and can't find anything that isn't related to PhoneGap. It's just javascript in a browser isn't it?
How do you even debug this?
Solution
I was using reserved words like delete in my services which broke safari and not chrome. On both desktop and tablet safari is broken but chrome works. I have to switch the reserved words to something like remove.
http://paste.laravel.com/NNB
On the iPad go Settings > Safari > Developer > Enable Debugging
On top of safari you'll get a "1 Error" or "19 Errors" and when you click the bar it will list out the console for you.
AngularJS 1.0.7 works fine on my iPad (first edition) with IOS 5.whatever.the.last.supported.version.was! It's surprisingly quick, too, although Mobile Safari crashes with depressing regularity when it runs out of memory! This happens on many other web sites, though.
Instead of renaming the method you may change the way of calling it. For instance service['delete']() instead of
service.delete()
Same problem exists with method finally of promise object (older IEs even crash on call promise.finally()).
Related
I have following questions...
I am simply using javascript profiling provided by google chrome, to optimize performance of my application. I actually needs to optimize performance on IOS device but not aware about how to do it from chrome. How can I do it?
I have tried to do it from safari itself but I am unable to find Javascript profiling option in safari. What kind of option there in safari for this?
Also can you please let me know how to save profile in safari as we do in chrome.
I don't want to confuse with timeline performance option. I am asking
about javascript profiling option in safari like chrome. I am using safari version 9.0.2
Thank you,
any help would be appreciated.
After you connect your iOS device to the computer and enable the remote debugging through safari (A simple guide), click on "Timeline" tab. You may find the "recording" option there, together with the panels for performance debugging of "Network Requests", "Layout & Rendering" and "Javascript & Events". Is that what you want?
Check this out to save the profile: https://github.com/google/ios-webkit-debug-proxy
I was wondering if there are any useful tools people have found to debug javascript on an iPad which is not jail broken. It is an iPad supplied for work so jail breaking is not an option. Through some tedious steps I have gotten firebug-lite working on the iPad but my debugger statements in the javascript are not being hit. There is also no capability that I am seeing to set breakpoints as you can traditionally with Firebug.
I also have Safari's debug console open but that is fairly useless for what I am trying to accomplish.
Thanks for any ideas.
Did you look at webkit remote debugging protocol? It seems they know people want a debugger for their iPad but still no real world native iPad remote debugger is available out there.
But don't get disappointed, there is a tool called weinre that doing what webkit folks willing to do in the future right now!
Update:
By release of Google Chrome for Android phones remote debugging and tablets debugging mobile web apps is no pain anymore. You will need an expensive Google Galaxy Nexus phone with ICS on it to do it. But future is bright! Check out the video demo here:
weinre is Web Inspector Remote. Pronounced like the word "winery". Or
maybe like the word "weiner". Who knows, really.
For those coming to this question from Google, there is now a Web Inspector available in iOS Safari (scroll down to "Safari on iOS"). Note that it requires a Mac computer to use.
Have you tried Firebug Lite?
I haven't used it on the iPad, but I don't see why it wouldn't work.
I'd probably set a conditional include based on if a query param is set - for instance (php)
<?php if(isset($_GET['debug'])): ?>
<script type="text/javascript" src="firebuglite.js"></script>
<?php endif; ?>
Try iDebug. You can direct download it from AppStore onto your iPad. Here's the AppStore Link.
I have recently written a tool for showing console logs in a movable/resizable "window" (actually a div). It provides similar functionality to Firebug's console but you can see it over your page on a tablet. Tablet/Smartphone/Phablet Debug Console
You can also use Firefox's built in WebIDE with Valence
Plugin your device > in Firefox click on the spanner icon > find WebIDE > under "OTHER" click on "Safari, Firefox, and other WebViews on iOS"
[1] https://hacks.mozilla.org/2014/11/mozilla-introduces-the-first-browser-built-for-developers-firefox-developer-edition/
[2] https://hacks.mozilla.org/2014/06/webide-lands-in-nightly/
[3] https://developer.mozilla.org/en-US/docs/Tools/Valence
There is actually a way to debug a website in Safari on iOS using Firefox WebIDE on a Windows machine. I wrote an answer at https://stackoverflow.com/a/35714835/306179 further describing this solution, as it was not necessarily straightforward to set up and use. It does not provide all the Developer Tools you would expect from, for instance, Chrome's DevTools suite, but it at least gives the Console, Inspector, and Debugger.
If you have an Apple Mac computer, you can connect it to your iPad.
First you must ensure that you have the Web Inspector enabled ("Settings > Safari > Advanced" and turn on "Web Inspector").
Then connect your iPad to your Mac via an USB cable.
After that I can choose in the "Develop" Menu of Safari to debug the website displayed on my iPad/iPhone.
Source of images and original information:
https://webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787
Not sure if I'm allowed to re-post my answer from another question, as it's often frowned upon, but in Debug iPad Safari with a PC I posted 3 options of JS console and logging tools that can assist with troubleshooting issues on iOS devices, with screenshots and sample code snippets. One of these is an open source tool I built myself, but the other two are probably even more advanced.
They all make up for the lack of a proper Javascript console and error log in iOS. There's also some additional tools mentioned in the link above. The answers there are likely relevant to this question also.
You can try using Firebug Lite as a bookmarklet. You should be able to use all features without changing the code of your app as Jesse suggested. See this link.
I have an iPad running some Javascript in a webview, but sometimes it just refuses to work. Does anyone have a way to debug this kind of issue?
You can use bookmarklets to run things like firebug lite: Check the following article for links to how to make bookmarklets installable on mobile safari as well as links to firebug lite.
http://community.godaddy.com/library/setting-up-a-debugging-environment-on-the-ipad/
Recently with the new iOS 6 you can turn on remote debugging and analyze your project with Webkit Inspector on Safari (but only with a Mac, because you must have safari 6.x).
This method would not work on the first generation of iPad too, because they're not upgradeable to iOS 6.
The question is one year old and obviously it wasn't available at the moment. I'm posting it so that someone who come up here could know it.
Info: http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers
Another tool you could try is adobe shadow.
Simply enable js console
I asked a question yesterday that has gone unanswered. So I will just ask this:
What advice can you give me about Android 2.1 Web Browser and Javascript? How do you debug errors? What things do you avoid doing? What things do you make sure to do?
In a lot of ways, the Browser behaves like Mobile Safari on iOS devices. I need help with what makes it different from iOS devices.
The Android SDK is freely available, and includes an emulator that will allow you to run the browser that comes with the OS. So, you can test your site directly in an emulated device, if you don't have a device available.
There are some features for debugging via the SDK as well, see here:
http://developer.android.com/guide/webapps/debugging.html
Surely if it works in firefox etc and you have no errors via firebug then it should be fine. But you could try using firebug lite to debug any errors.
I know it this works even in IE6 so it should work in the Android browser.
Hey this question is pretty general, but I'm wondering what the Javascript differences are in Mobile Safari and Safari for Mac.
I was under the impression that from a Javascript perspective they are the same, with only some differences in CSS/rendering. But I am experiencing a number of Javascript errors in Mobile Safari that don't exist in regular Safari on Mac.
Basically a number of calls to certain jQuery plugins are returning undefined values (according to the developer debugger in Mobile Safari).
The website that I'm experiencing these issues on has a very lousy front end that is riddled with validation errors, lousy JS and has an enormous amount of CSS attached. I have no doubt that this issue lies somewhere in this code, and I've never experienced issues like this before.
I'm just having trouble honing in on the problem, so any insight/links as to the general differences in Javascript engines would be much appreciated.
Javascript itself, the core language, is no different. There are a few significant differences in the DOM that appear undocumented, but mostly it is all the same. Here you can see some differences in events that you can handle.
The DOM differences I noticed had to do with measuring elements. For example getClientRects, at least for a Selection or Range, was not available. There are probably other things.
Before I add my two cents about differences in Safari depending on environment or build: the list of possible environments for Safari is bigger than just iPod, iPhone, iMac.
I am also dealing with: Safari for Windows (desktop) and Mobile Safari in iOS Simulator on iMac.
My jQueryMobile + PhoneGap app works nicely in Safari for Windows (desktop) and Safari on iMac, but it has the following problems in Safari on iOS Simulator on iMac Snow Leopard with XCode 3.x:
Google Analytics gets a "whitelist rejection" in iOS simulator.
My app hangs early on in the user's setup process through another problem
That other problem could be any of:
tags placed after element may not be loading
properly
calls to localDb may not be coming through
jQuery's events (pageinit,click,etc) may not come though in the same way