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!
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').
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)
Try iDebug. You can direct download it from AppStore onto your iPad. Here's the AppStore Link.
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 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'
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.
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
Is it possible to check for the iPad version (1 or 2) in a web application? As the user agent looks identical (see http://www.webtrends.com/Support/KnowledgeBase/SolutionDetail.aspx?Id=50140000000acbiAAA) a standard check by browser does not work here.
Please try this fiddle. It detects version of iPad by gyroscope availability.
As you can see in Safari Developer Library,
event.acceleration is not null on devices that has a gyroscope. Since iPad 1 doesn't has it, we can assume that this device is iPad 1.
To distinguish iPad 2 from iPad 3, we can check a
window.devicePixelRatio property, since iPad 3 has Retina display with pixel ratio 2.
Sorry but currently there is no difference between iPad and iPad 2. See, there is no difference between the two of them:
And notice there, that the versions there are constantly changing in iOS updates.
Looks like there is a difference between them:
Bit late to this one but by using WEBGL_debug_renderer_info extension, which is part of the WebGL API, you are able to retrieve the vendor of the GPU and the renderer name.
Combining this with screen dimensions of the device you can accurately define which version it is.
It can also be done for iPhone models, this blog goes into more detail.
Detect between iPad 1 and 2 Steps:
Detect between iPad 2 and 3 Steps:
Detect between iPad 3 and 4 Steps:
Maximum Anisotropy of 16 usually indicates a modern device with decent graphics performance.
As others have already pointed out, these are the 2 useragent currently in use:
But if you look close enough, they are not the same, there's a difference:
So, there you go.
The user agent detection gets you the version of the Safari app, not the version of the iPad itself because your web app will only run in the browser environment.
The gyroscope and all other API's are SDK API's so they are only available for native app development, not for web apps.
looks like the iPad 2 can have the same Mobile/9B176 code than the New iPad. Maybe it's because of an update of iOS?
Here is my full iPad2 user-agent string:
Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3
I can't check on an updated iPad 3. Could someone please tell me if there is any difference?
(by the way, if you just want to know if the user has a low-res or a high-res iPad, you can use this trick: https://stackoverflow.com/a/10142357/974563 )
PLS DON'T RELY ON User-Agent STRING INTERPRETATION.
This is not reliable at all: I can see Mobile/8J2 on iPad2 and Mobile/9A405 on iPad1. So different iOS versions(and thus Safari) alert different UA on the same iPad version.
We should go with acceleration feature detection only; either client-side or server-side (WURFL acceleration etc...).
Also, check out this: