轉自IMWeb社群,作者:HuQingyang,原文連結
前段時間,老闆說:iPhone 又出了那麼多新機型,你搞下相容吧。我:測試機呢?老闆說:沒有。我:???
這讓我十分為難,畢竟巧婦難為無米之炊,於是我只好使出絕招:模擬器大法!
一. 安裝 & 啟動
首先需要安裝 Xcode,安裝完畢後,在終端中執行 xcode-select --install
安裝 Command-line-tools。
安裝完畢後搜尋Simulator
,或者按 Command+Shift+G
, 輸入/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app
,便可執行模擬器。
你也可以使用命令列來管理和啟動模擬器:
- 執行
xcrun instruments -s
列出可用的 iOS 模擬器: - 執行
xcrun instruments -w XXX
啟動模擬器
Simulator 預設只有最新的 iOS 版本的模擬器,如果你需要在老版本的 iOS 上除錯,可以這樣安裝更多版本。
- 首先進入裝置管理:
- 點選左下角的加號,選擇
Download more simulator runtime
:
二. 配置代理
我們在除錯的時候,需要把模擬器的網路請求代理到我們的 dev-server。這裡大力推薦使用強大的Whistle
配合Proxifier
來實現。
首先安裝 Whitle,執行w2 start
,訪問 http://127.0.0.1:8899
,配置好 dev-server 的代理。
然後執行 Proxifier,把模擬器請求轉發的 Whistle。
首先新增一條 Action 規則代理到本地8899
埠:
Simulator; "Xcode Server Builder”; "MobileSafari”; “com.apple.WebKit.Networking”;
新增到 Applications:這時,在模擬器中訪問我們要除錯的頁面,檢查一下 Whistle,請求都走到本地,代理配置成功!
PS:第一次使用 Whistle 代理時需要安裝並信任證書,具體參考 Whistle 文件。
三. 開始除錯
- 首先在模擬器中啟動 Safari,開啟除錯的頁面
- 然後在 Mac 上啟動 Safari,在首選項中啟用開發選單
- 模擬器訪問需要除錯的頁面,在開發選單中找到我們的頁面:
- 就可以愉快的玩耍了!
四. WebView 除錯
除了直接除錯 Safari 中的頁面,我們還可以藉助模擬器除錯 APP 中的 Web 頁面。可以在 APP 中直接打斷點、走單步除錯等等,從此跟 eruda 等手動打 log 的偵錯程式說拜拜~
首先我們需要客戶端同學給模擬器打一個.app
包,把包拖到模擬器安裝。然後啟動 APP,訪問要除錯的 Web 頁面,如法炮製,如圖,就可以愉快的玩耍了~
PS: 打給 iPhone 的 .app
包不能直接給模擬器使用(會閃退),因為模擬器是執行在 X86 指令集上的,需要專門打包。