Is there any way to inspect a page in IOS Safari using Chrome Developer Tools??
I'm looking for a solution like Safari Desktop > iOS Safari.
I'm working in a windows machine and I don't have Safari.
Thanks in advance
The only tool I know of that would get close to that is WeInRe, but that's not the full Chrome Developer Tools.
Related
Android can use desktop Chrome's web inspector to debug HTML/CSS issues embedded in an App's WebView, as long as you connect them through USB.
I've been searching all over google and this site and cannot find any information regarding this. Is there a similar way to inspect HTML/CSS elements/rules in iOS?
Because there are some issues that only affects webview, so viewing it from iOS Safari cannot reproduce some issues.
You can do this using Safari on Mac.
First, go to settings on iPhone → Safari → Advanced. Then enable the "Web Inspector" option and follow the instructions to enable on Mac.
Edit: this will only work with apps installed using Xcode.
I know to debug mobile safari you'll need a mac, but is it possible to debug ios version of chrome on a windows machine (via a usb cable)? seems like a simple question, but for some reason I can't find anything on it using google. everything I find always seems to point to debugging mobile safari via mac or debugging mobile chrome for mac users.
FYI: I plan on getting the device, but I need to know if the aforementioned is possible before getting the iphone.
I'm trying to debug my website, but Apple are douches. What do I do to enable the debug console if I don't have a Mac?
I installed Safari and the latest iTunes, but my iPhone doesn't show up in Safari developer thing.
You can try option of using Telerik AppBuilder (Windows client) as a replacement on Windows for Safari debugger on Mac when remote debugging. There's a nice blog post about the steps to do it in link below. I'd rather not repost the info as there are also screenshots and it's a lot of text. But essentially, you install app, open it, connect device via USB, then you can find it in the app and open up the developer tools/debugger for it. For non-public websites, you'll have to open up port 80 with some firewall configs documented in the post.
http://blog.falafel.com/Blogs/josh-eastburn/2014/03/04/ios-web-inspector-on-windows-with-telerik-appbuilder
The tool requires a license or you can use the trial, which becomes a basic edition afterwards. I think the basic edition will still allow you to do the debugging. I'm going to try it out myself.
You can also try these iOS apps too, you can find them in the iTunes App store. They give you a built in developer tools feature (right on iOS no remote debug) that mobile Safari doesn't offer.
MIH Tool - basic edition
https://itunes.apple.com/us/app/mihtool/id584739126?ls=1&mt=8
HTTPWatch Basic
https://itunes.apple.com/us/app/httpwatch-basic-http-sniffer/id658886056?mt=8
I gave them a try and they're at least better than the mobile Safari you get on iOS, unless one needs to target full mobile Safari compatibility. I'm guessing the pro/paid editions of those apps give you more/better features.
iOS Debugging with Safari is a featuere of the new Safari. As Safari for Windows is a outdated Version of Safari, debugging is not Implemented.
So debugging with Safari is only possible on a mac!
min requirements are: OS X 10.8 iOS 6
More Infos:
Safari Remote Debugging on Windows
Since that Question was asked i found another neat way to debug stuff on a not accessible Platform:
http://people.apache.org/~pmuellr/weinre-docs/latest/
It works like this:
You add the weinre.js to your project
You set up weinre on your main platform (pc)
Starting your project results in sending the Debug Information from your project to your Platform
It's not that easy to run and understand, but once it works its pretty nice.
Did you set up your phone to allow remote webview inspection?
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
As an alternative to Weinre, you can try Vanamco's Ghostlab as well, it supports JS console and parallel testing on multiple device.
In chrome packged apps, i was able to to open the Developer Tools for a webview by right-clicking until a few weeks ago . However, after the chrome has been updated , it is impossible. (Chrome version is 29.0.1547.66)
Is it possible to enable the right click of webview as before ? Or is there any api to open the developer tools for a webview?
In M29, you can find webviews in the Other page in chrome://inspect. The interface for debugging webviews in chrome://inspect has improved significantly in Chrome canary recently. It'll now display webviews within an app underneath the app.
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-.