iOS Simulator/iPhoneのmobile Safariでwebインスペクタを開く

iOS Simulator/iPhoneのmobile Safariでwebインスペクタを開く方法を最近知ったのでメモしておく


iPhone/iOS simulator側は、設定→Safari→詳細でWebインスペクタをオンにする


Mac Safariは、設定→詳細で「メニューバーに"開発"メニューを表示」にチェックを入れる


iPhoneの場合はUSBケーブルでMacにつなぐ

この状態で、Mac Safariの開発メニューを見ると、iOSシュミレータとiPhoneが表示される

mobile Safariで表示しているページのホスト名を選択すると、ページに対するweb インスペクタが開く



バージョンによってはできないかもしれない
以下のバージョンでは問題なかった

Mac

Mobile側