I am developing a web app for iPad and testing it on Safari on Mac and Safari on iPad Simulator. Now there are some issues with CSS in iPad Simulator which work quite well in Safari on Mac.
Now my question is,
Is there a powerful debugging tool for Safari in iPad Simulator?
When running safari in an XCode device simulator, the desktop Safari (v6) Develop menu shows those devices. From there, you can fire up the developer tools (DOM browser etc.) for the mobile browser. This helped me debug an mobile safari css issue without hardware.
Note: As of iOS6 this is not the correct way of doing remote debugging, leaving this answer for historical reasons but you should look into remote inspection with Safari, here is a good article: http://jeffreysambells.com/2012/09/22/ios-safari-web-inspector
Have a look at this, (a bash script I wrote) https://gist.github.com/2241976. It will allow you to open the iPad simulator and run Webkit's remote inspector, which will look just like this.
iWebInspector is quite a powerful tool for the iOs simulator's Safari.
It uses the same inspector as Chrome and it works nicely (I've used it myself and found it really helpful).
From their website
iWebInspector is a free tool to debug, profile and inspect web
applications running on iOS Simulator (iPhone or iPad). You can check
resources, see and change HTML & CSS, use breakpoints on JavaScript
code, create charts and more just as if you were on Safari for
Desktop, Chrome or Firebug.
It works for any web in Safari -the web browser-, for a chrome-less
webapp (full-screen) and also for apps using UIWebView -including
PhoneGap applications-.
Related
is there a way how to debug an iOS mobile app on Windows or Linux (Ubuntu)?
I have an application which runs fine on Android, but it has some flaws on iOS. For Android debugging, I always used the Chrome device inspector and I am wondering if it’s possible for iOS too?
The Webkit Adapter I found (https://github.com/RemoteDebug/remotedebug-ios-webkit-adapter) works for debugging websites opened on iPhone via SAFARI browser, but not for the mobile app. Any ideas?
Thanks a lot for any suggestions.
Yes, you can develop your own lldb to support debugging non-jailbroken iOS device on Window, like this
Sometimes i check browser support features on Can I Use website. Now i looked at touch events compatibility and realised that iOS Safari support this feature, but Safari doesn't. What is the difference between Safari and iOS Safari on caniuse.com? As far as i know Safari browser is tied to the iOS and is not supported on Windows/Linux, so it should point to same browser. Maybe it's divided to mobile and desktop versions? I couldn't find any answer on their website and on other sites as well.
I enclose an image as well (support may change in the future):
Safari refers to desktop Safari on a Mac, whereas iOS Safari is Safari on an iOS device.
We have a ASP.net web application integrated with DotNetNuke.
The mobile version uses jQuery mobile 1.6.X.
While trying to test the application it works well in Chrome simulator(our staging environment is publicly exposed). But it does not work in any of the actual device.
Can anyone suggest how to debug this ?
For Android you can attach the device to the pc and go to chrome-> developer tools -> inspect devices
Make sure your phone is set to developers mode with usb debugging on.
For iOS you can attach your phone to a mac and open safari, develop menu and then the device you want to inspect.
There you will find the javascript console, source, style and everything you normally need for website debugging.
I'm developing a site one of the targets of which is iPad.
What options do I have to debug client side (DOM inspector, style viewer/editor, javascript console, network analyzer - all thing every major desktop browser has) when viewing the site from iPad?
I'm not looking for some kind firebug lite, or anything that makes me to debug site from iPad itself. (This would be too tedious.) Instead, what I'm after is some sort of remote debugger for mobile Safary, allowing me to work with sites opened on iPad from a desktop machine, or an iPad emulator with same capabilities. I know there is the emulator that comes in bundle with official SDK, but does it have such means?
It's the first time I'm facing the problem, so not to blame!
This is what I'm aware of:
weinre (But does it really work?)
Check out BugSense and their HTML5 (javascript) installation
I need to check rendering of a large sum of HTML5 "widgets" that will be shown in an iPad WebKit. Which desktop browser gives me the most similar renering experience? My widgets mostly consist of SVGs positioned with CSS3 and some CSS masking.
Is it Safari on a Mac?
EDIT: The desktop OS is not a concern, I can pick whatever I want for this...
EDIT: What particularly interrests me is if desktop Safari is closer to iOS Safari than Chrome is. They are both based on WebKit, but I see a lot of tiny rendering differences between Chrome and iOS Safari.
How about mobile Safari on the iPad Simulator?
Unfortunately, the iPad Simulator is Mac-only. If you can't test on that, Apple recommends using Safari and changing your user agent string to the iPad's user agent string. You can find instructions from Apple here.
Try real Safari. It uses Webkit and since you're on windows, you can't download the iPad simulator.
On the desktop, anything that uses WebKit is going to give you a similar rendering experience especially with regards to more technical things like SVGs. Unfortunately, there are still browser-specific quirks that you won't be able to notice without actually testing it on either the simulator or a real device.