Introduction
Recently, I did interesting POC. Now a days, I am working on mobile enabled site of Sharepoint. Mobile enabled sites work on media queries/JQuery Framework to make it responsive. This responsive nature is very useful for mobile users but a bit tricky for debug related issues. Normally, we fix issues on desktop, but bugs are produced on mobile devices. Please go through the tip/trick to allow you to debug the site, which you are browsing on mobile device and debug it on desktop browser.
Why Do We Need This?
Many issues which are reported by mobile users cannot be reproduced on mobile mode of desktop browsers. Hence such issue should be checked on mobile devices.
No Code, Only Configuration
For this, we do not need any code, We need some configuration on mobile device and desktop as well.
Scenario 1
User has Samsung Note2 device[Chrome browser], Android OS, Windows 7+ OS [chrome browser]
- Check browser versions. Browser version on Desktop must be higher than mobile device Chrome browser.
- Install mobile drivers on desktop OS. [Samsung Kies/Kies 3.5] Check if OS can recognizes device.
- Go settings of Mobile device, Developer options -> click USB Debugging [Enable it]
- Connect device to desktop using data cable
- Browse your site on mobile in chrome browser
- On desktop open chrome browser and type "Chrome://inspect/#devices"
- You can see device name and few options. Click on "inspect" link and you are ready to debug.
Scenario 2
User has Samsung Note2 device [Chrome browser], Android OS, Mac OS [chrome browser]
Mac OS does not need any drivers, because they are in build. Just skip Step 2 and you can debug it.
How It Will Look Like?
Points of Interest
Using this kind of debugging, we have identified and fixed bugs mostly related to UI. We are also able to track behaviour of site on WiFi/3G/2G networks.
Limitation
- Using this debugging, we cannot debug JavaScript code like we do in desktop. [Correct me if I am wrong.]
Troubleshooting
- If your device is not found, then go to Device manager and locate it. If driver has been installed properly, then you enable it.
- An access permission may appear on mobile device, click ok.
References
I referred to this link. Hope it helps and I am always happy to help.