Testing my webpages with an iPad, I ran into an design error that only occurs on iOS devices. So I tried using the remote debugging feature that is available since iOS6.
It doesnt matter what device I use and what site i try to inspect, the remote webinspector is blank all the time. See the attached screenshot (running OSX in german). I used google as an example in my screenshot.
What am I doing wrong?!
Here's how: Open the iPhone Settings menu. On an iPhone with an early version of iOS, access the Debug Console through Settings > Safari > Developer > Debug Console. When Safari on the iPhone detects CSS, HTML, and JavaScript errors, details of each display in the debugger.
Next, you need to enable ‘Web Inspector’ on your iOS device. You can do this by going to Settings > Safari > Advanced, and toggling Web Inspector so that it is enabled.
This can be done by going to Safari > Preferences > Advanced and checking the checkbox for Show Develop menu in menu bar. In case it is already enabled, you do not need to do anything. Further, you need to open the web page you want to debug on your computer. Make sure that your iOS device is plugged into it.
But luckily for folks designing on iOS, starting way back with iOS 6, Apple offers a remote web inspector feature in iOS. Web Inspector allows web and mobile app developers to use macOS and OS X Safari Developer Tools to remotely debug web content or hybrid apps in mobile Safari on iPad or iPhone.
It contains the WebInspector files. On Windows, run start.ps1. On Linux, run start.sh. You should be greeted with the WebInspector and can now debug to your heart’s content. Two windows will open. One manages the web server and the other one is ios-webkit-debug-proxy.
I had exactly the same issue with Safai 8.0 on MacOS 10.10.1 and iOS 8.1.2.
Solution:
Ensure that cookies
are allowed in your desktop Safari.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With