Mobile Browser Testing on the Desktop
By Leo Gaggl
If you need to check websites for mobile compliance on a regular basis you know that having a device to constantly check is painful and slows down your work during debugging and phases of constant change.
by adactio
There are a few tools that will make this work a lot easier:
Google Chrome
Chrome does have some nice dedicated plug-ins to help with this task
- Ripple Mobile Environment Emulator (https://chrome.google.com/webstore/detail/geelfhphabnejjhdalkjhgipohgpdnoc)
- appMobi HTML5 XDK (https://chrome.google.com/webstore/detail/onmkoldigcfmebcinpmineoadckalllb)
Firefox
I am not aware of any plug-ins like Chrome, but as a hack I have found it useful to employ a user-agent switching plugin to trick the browser
User Agent Switcher (http://chrispederick.com/work/user-agent-switcher/) works well for this.
- Download the User Agent Switcher Add-on for Firefox
- Restart Firefox for the add-on change to take place.
- To start a new browsing session using an emulated browser, go to Tools > User Agent Switcher and select the appropriate mobile web browser you want to emulate
- To switch back to normal browsing, just select the default option from the above menu.
If you need more specific UA Strings check here: http://www.zytrax.com/tech/web/mobile_ids.html
For more serious work there are obviously dedicated emulators from the major Mobile OS vendors (but they need to be installed and configured for each platform):
- Android (http://developer.android.com/guide/developing/tools/emulator.html)
- iOS (http://developer.apple.com/devcenter/ios/)
- WinPhone (http://www.microsoft.com/download/en/details.aspx?id=13890)
- Nokia (http://www.developer.nokia.com/Develop/Web/)
- Opera (http://www.opera.com/developer/tools/mini/)
- WebOS (http://developer.palm.com/)
PS: Nothing substitutes final QA testing on actual devices …