While developing mobile web sites, the behavior of real mobile browsers are a litter different with desktop's. While debugging, Developers are using console.log. But developers cannot see logs in mobile phones. It makes it hard to figure out ,when unexpected errors occurred in phones .
Like desktop, there are solutions in iOS and android.
1. android
ref: https://developer.chrome.com/docs/devtools/remote-debugging/
2. ios debugging. Window and osX
- iOS mobile debugging is more complicated then android
- Install iTunes
- Install Node.js
- open command window or powershell as Admin Mode
- install debugging adaptor
- npm install remotedebug-ios-webkit-adapter -g
- run below command , if you see 'firewall warnning', allow 'access'
- remotedebug_ios_webkit_adapter --port=9000
- In chrome, type: chrome://inspect/#devices
- discover network target : configure
- add "localhost:9000"
- Enable web inspector on your iOS device.
- Settings > Safari > Advanced : enable web inspector( 웹속성)
- Browse sites.
- you can see lists in PC chromes.
- click inspect.
* Another ( no additional Install) : mobile debug in mobile
- ref: https://blog.chromium.org/2019/03/debugging-websites-in-chrome-for-ios.html)
- No install programs , in Chrome (mobile)
- Type "chrome://inspect" in url then you can see below screen
- Click 'logging start'
- In new tab , browsing your web application, You can see logs in inspect Tab.
