今回は、Mac環境でSafariからIEやEdgeの表示を確認する方法について説明します。※現在の開発現場でEdgeのIEモード(Internet Explorer)から「脱IE」 Microsoft Edgeにマイグレーションしたいって話があがっています。2029年にサービス提供が終了してしまうIEモード。Mac環境でも確認ができるので一緒に確認してみましょう!
SafariでIEやEdgeの表示を確認する方法

Safariを開いて メニューバーにある Safari > 設定 を押すか、ショートカット「⌘ + ,」を押すと環境設定が表示されます。

詳細タブの1番したにある「Webデベロッパ用の機能を表示」に☑︎を入れます。


これで開発者ツール(デベロッパーツール)が表示できるようになりました。

IEの表示やEdgeの表示を確認するためには、メニューバーにある開発 > ユーザーエージェントから表示を確認したいブラウザを選択するだけです。

IEの表示を確認する場合は、その他…を選択しユーザーエージェント文字列を次のように書き換えます。
Internet Explorer 11の場合
Mozilla/5.0 (Windows NT 10.0; Trident/7.0; rv:11.0) like Gecko
Internet Explorer 10の場合
Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)
Internet Explorer 9の場合
Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0)

これで表示が切り替わりました。

実際にIEで表示されているか確認したいですよね?前回、JavaScriptでブラウザ判定をする記事を書いたので、ぜひ下記の記事から確認してみてください。

IEモードで表示されていることが確認できました!
まとめ
手順をまとめると、Safariの開発者ツール(デベロッパーツール)を使えるようにして、開発 > ユーザーエージェントから確認したいブラウザを選択するだけです!
コメント