はじめに
Windows野郎なのでMacのことがさっぱりわからない私が、わからないなりにMacにseleniumとappiumを導入してMacのSafariとモバイルの実機Webブラウザテストに至るまでの手順を記載します。
（※Selenium(Appium)クライアントはWindowsのC#で作成しており、Mac上にSeleniumおよびAppiumサーバーを立ててリモートで操作するための手順です。）
数々の先人の知恵があるにも関わらずハマりまくって何度か挫折しそうになりつつ何とか乗り越えたので、Mac素人がハマったポイントは赤字で記載します。（※Mac関係ないところもあります。）
なお、私の前提知識は
Mac：ほぼ経験なし。1回だけ他人様に作ってもらったiOSアプリをビルドして審査に出した程度の経験値。
ターミナルを起動して何となくUnix系OSなのかなーぐらいのレベル。
Node.js：どんなものかは知ってるが使ったことない。
Linux（Unix）：多少かじってる。
といった感じです。
参考にさせて頂いた先人の知恵
https://stackoverflow.com/questions/18868743/how-to-install-selenium-webdriver-on-mac-os
https://qiita.com/sakaimo/items/88bbbf095d7fc4f41264
https://qiita.com/zprodev/items/3067a1e077d448827475
https://qiita.com/furusin_oriver/items/2d104ccdb7f68929ebfd
https://qiita.com/emurin/items/5cb9632514a74b056217
https://stackoverflow.com/questions/52602425/libusbmuxd-version-error-during-flutter-install
※本記事には上記記事からの転記、引用を多分に含みます。
というかほぼ寄せ集めて合体させただけです。
参考にした公式サイト
https://www.seleniumhq.org/
http://appium.io/docs/en/about-appium/getting-started/
http://appium.io/docs/en/drivers/ios-xcuitest-real-devices/
https://github.com/justadudewhohacks/opencv4nodejs#how-to-install
本記事では説明しない内容
seleniumおよびappiumの構造と仕組み
seleniumおよびappiumのクライアント側の話
AppleDeveloperまわり
手順
前提：MacにはXcode10がインストール済み。
AppleDeveloperアカウントを取得済み。
実機テストで使用するiPhoneがAppleDeveloperに登録済み。
実機テストで使用するiPhoneを含むプロビジョニングプロファイルを作成済み。
１．管理者権限のあるアカウントでMacにログインします。
sudoではうまくいかないので管理者権限アカウントが必要です。
２．Homebrewをインストール
$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
３．Node.jsをインストール
３－１．Nodebrewをインストール
$ brew install nodebrew
３－２．作業フォルダを作成
$ mkdir -p ~/.nodebrew/src
３－３．Node.jsをインストール
※この作業をしたときはlatestはV11.6でした。
※このときnpmも同時にインストールされます。
$ nodebrew install-binary latest
３－４．パスを通します。
$ echo 'export PATH=$PATH:/Users/no136/.nodebrew/current/bin' >> ~/.bashrc
.bash_profileがない場合は下記コマンドでファイルを生成します。
$ touch .bash_profile
~/.bash_profileに下記を追記します。
if [ -f ~/.bashrc ]; then
. ~/.bashrc
fi
反映させます。
$ source ~/.bash_profile
４．Seleniumスタンドアロンサーバーをインストール
$ brew install selenium-server-standalone
５．MacのSafariの設定
Safariを起動して環境設定＞詳細 の「メニューバーに開発メニューを表示」にチェックを入れます。
開発メニューが表示されるので、リモートオートメーションを許可 にチェックを入れます。
６．Javaをインストール
公式サイトからダウンロードしてきてインストールします。
https://www.java.com/ja/download/help/mac_install.xml
７．JDKをインストール
公式サイトからダウンロードしてきてインストールします。
https://www.java.com/ja/download/faq/develop.xml
SeleniumでMac上のSafariをテストするだけならここで終了です。
８．Appiumをインストール
$ npm install -g appium
９．Appium-doctorをインストール
$ npm install -g appium-doctor
１０．appium-doctor --ios を実行します。
$ appium-doctor --ios
エラー、ワーニングになった項目の対応を行います。
私が今回修正したのは下記の通りです。
１０－１．Carthageのインストール
$ brew install carthage
１０－２．opencv4nodejsのインストール
※ここで前提のCMakeが入っていなくてエラーになりました。opencv4nodejsの公式サイトを見て解決。
$ brew install cmake
$ npm install -g opencv4nodejs
無視したワーニング
・fbsimctl、applesimutilsについてはappium公式サイトによるとシミュレータで使うものらしいです。
今回は実機テストが目的なのでこの2つは何もせずに放置しました。
１１．AndroidStudioをインストール
AndroidStudio公式サイトの手順に従ってインストールします。
１２．Android用の環境変数を設定
１２－１．Javaのパスを確認します。 ※AndroidStudio同梱のJAVAを使うならAndroidStudio上で確認できるパスにする
/usr/libexec/java_home
１２－２．Android SDKのパスを確認します。
AndroidStudioを起動し、適当なプロジェクトを開きます。（なければ新規作成）
File→Other Settings→Default Project Structure…を開く
Android SDK Locationにパスがあります。
１２－３．.bashrcに確認したパスを記載します。
export JAVA_HOME='確認したパス'
export ANDROID_HOME='確認したパス'
さらにpathに$JAVA_HOME/binを追加します。
既存のPATHの記述に:で区切って追加します。。※JAVA_HOMEの定義はpathより先に書く
さらにpathにadbの実行フォルダのパスを追加します。。
PATHの最後に$ANDROID_HOME/platform-toolsを追加します。※ANDROID_HOMEの定義はpathより先に書く
１２－４．設定を読み込む
$ srouce ~/.bash_profile
１３．appium-doctor --android を実行します。
$ appium-doctor --android
※エラー、ワーニングが出たら修正します。
私がやったときは出ませんでした。
１４．iOS実機用環境設定を行います。
$ brew install libimobiledevice
$ brew install ios-deploy
$ brew install ios-webkit-debug-proxy
しかしながら、これだと手元のiPhoneX(iOS 12.1.1)では動きませんでした。
ググったところlibimobiledeviceはHEADをインストールする必要があるらしいのですが、何かの登録がおかしいらしく、依存関係を手動でいじって解決が必要なようでした。（そのうち修正されるとは思いますが。）
これにたどり着くまで3時間ぐらいかかりました（泣）
以下対応するコマンド。
$ brew uninstall --ignore-dependencies libimobiledevice
$ brew uninstall --ignore-dependencies usbmuxd
$ brew install --HEAD usbmuxd
$ brew unlink usbmuxd
$ brew link usbmuxd
$ brew install --HEAD libimobiledevice
１５．WebDriverAgentの設定
１５－１．依存解消のscriptを実施します。
>cd ~/.nodebrew/current/lib/node_modules/appium/node_modules/appium-xcuitest-driver/WebDriverAgent/
>bash Scripts/bootstrap.sh -d
>bash Scripts/bootstrap.sh
ここでreactとreact-dom 15.6.2がないよと警告が出てエラーになりました。
とりあえずreactとreact-domを入れてみます。
$ npm install react@15.6.2 react-dom@15.6.2
しかしそれでもうまくいかないのでnpm uninstall reactでアンインストールしてもう1回react15.6.2を入れなおしたら行けました。謎。
reactをアンインストールした時に何故かビルドが走ってうまくいった気がします。これに関してはいまだによくわからないので正しい解決方法をご存知の方がいらっしゃったら教えて下さい。
ちなみにこのハマりでも3時間程度を浪費しました。
１５－２．同じフォルダに入っているWebDriverAgent.xcodeprojをXcodeで起動してビルドする。
$ open .
でFinderが起動できます。
WebDriverAgentLib
WebDriverAgentRunner
にプロビジョニングプロファイルが必要なので、自動設定を有効にし、自分のチームを設定してビルドします。
※このあたりはちょっと怪しいです。
以上でMacの設定終了です。
実機テストを行うときの手順
MacのSafariをテストする場合
node.jsを起動します。 ※インストールしたバージョンを起動する。
$ nodebrew use v11.6.0
seleniumを起動します。※ポートはデフォルトポートなので指定いらないかも
$ selenium-server --port 4444
iOS実機テストする場合
node.jsを起動します。 ※インストールしたバージョンを起動する。
$ nodebrew use v11.6.0
appiumを起動します。 ※ポートはデフォルトポートなので指定いらないかも
$ appium --port 4723 &
iPhoneとUSBで接続します。
ios webkit debug proxyを起動します。
UDIDは接続しているiPhoneのUDIDを指定してください。
$ ios_webkit_debug_proxy -c $UDID:27753 -d &
iOS実機のSafari設定でWebインスペクタをONにします。
Android実機をテストする場合
node.jsを起動します。 ※インストールしたバージョンを起動する。
nodebrew use v11.6.0
appiumを起動します。
appium --port 4723 &
adbを起動します。
adb device
対象の実機のSDKがインストールされていない場合はAndroidStudioでインストールします。
Androidの実機とUSB接続します。
Android実機の開発者オプションをONにし、USBデバッグモードをONにします。
（「設定」=>「端末情報」=>「ビルド番号」を７回タップすると「設定」に開発者向けオプションが表示されるので「USBデバッグ」をonにする）
参考：ハマった時の調査方法
ハマった時の調査手順をメモしておきます。
１．エラーメッセージで検索する。
２．インストールしようとしているパッケージの公式サイトのGetting StartかHow to Installかそれっぽいところを参照する。（最初に読んどけって話もありますが）
３．オープンソースの場合はGithubのReadmeあたりを見てみる。
４．インストールしようとしているパッケージ名 install とかパッケージ名とエラーログに含まれるキーワードとか、関連しそうなワードでひたすらググる。ここまで来たら基本的に英語で検索する。
経験的にはStackOverflowに解決策が落ちていることが多い気がする。
５．検索した情報とあわせて各ミドルウェア、パッケージなどの役割・基本構造を確認して原因を推測する。