It’s Friday night, you’re about to quit work and enjoy your well-deserved weekend when the phone rings. “I can’t scroll vertically the menu on my new Iphone”, of course it’s your customer. If you don’t have an iphone handy you probably won’t even be able to see the problem.
You need to debug on iOs. What to do? the easiest and most comfortable solution is to have Browserstack account. this allows you not only to test sites and apps on multiple real devices in minutes, but also to automate your tests to include them in the deployment flow.
Like all things of value Browserstack has a not so low cost. If you are a casual freelancer, if you are experimenting on a friend’s site you may be looking for a cheaper solution.
Xcode simulator
Download Xcode (It takes quite a while) and open the emulator
The emulator allows you a near perfect device test. To change the device, just click on “new device” and choose the device to test.
Debug Xcode simulator (use the console)
To debug the xcode simulator we need to use the safari console. Open Safari and make sure you have:
-
A web page opened with Safari in the Simulator
-
“Show Develop in menu bar” checked in Safari -> Preferences -> Advanced (image below)
Now in your Safari you should see the “Develop” menu between “Bookmarks” and “Window”
Find the device you are testing in the device list and click.
it may happen that you see “No Inspectable Applications” instead of your simulator. No panic, I don’t know why it happens but just restart the simulator to fix the problem.
At this point we can finally test our site on an iphone simulator and fix the bug.