XcodeでiOS Safariのデバックを行う

WEB制作
XcodeでiOS Safariのデバックを行う

iPhoneを持っていなくてもMacを持っているだけでiOS Safariのデバックを行う事ができるを方法を紹介します。

OSのバージョンも選択できるので、古いバージョンでのバグの検証などもこの方法なら行えます。

目次

デバック手順

1. Xcodeのインストール

AppStoreよりXcodeをインストールします。

2. シミュレータの起動

Xcodeのインストール後、ターミナルより以下のコマンドでXcode内に含まれるシミュレータを直接開きます。

$ open /Applications/Xcode.app/Contents/Developer/Applications/Simulator.app

または、以下のコマンドを実行することでLanchpadにアイコンを追加して起動できるようになります。

$ sudo ln -s /Applications/Xcode.app/Contents/Developer/Applications/Simulator.app /Applications

3. iOSのダウンロード

メニューのHardware > Device > Managed Deviceを選択します。

Simulatorsを選択し、左下の+マークからダウンロードしたい端末とOSを選択してダウンロードを行います。

4. iOSの起動

メニューのHardware > Deviceから起動したいOSと端末を選択します。

起動するとiPhoneの枠の中でiOSが起動します。

起動後、Safariのアイコンをクリックしてデバックしたいページを表示します。

5. ディベロッパーツールの起動

ディベロッパーツールを使用するためにPCのSafariを起動します。

メニューの開発>先程立ち上げたSimulator>デバックするページの手順で選択します。

するとディベロッパーツールが起動し、PCのSafari同様にiOS Safariをデバックすることができます。

※開発がメニューにない場合は、設定からメニューバーに'開発'メニューを表示にチェックを入れてください。

※Simulatorを起動する前にSafariを起動していると開発のメニューの中にSimulatorが表示されません。Safariを再起動すると表示されるようになります。

シミュレータの動作が重たい場合

シミュレータの動作が重たい場合、メニューのdebugからShow Animethionsをオフにすると多少改善されます。