はじめに
JXAをスクリプトエディタで開発する場合、コンソールに情報を書き出せるのでまだいいのですが、Automatorに直接JXAを書いているときはデバッグしにくいですよね。スクリプトエディタのコンソールも型の判別とかは結構難しい（というか面倒くさい）。
実はJXA（開発元はApple）が公式にデバッグ方法を用意しているので、それを利用したほうが少し幸せになれます。設定は非常に簡単なのでセットアップの仕方を説明します。
公式ドキュメント
JavaScript for Automation Release Notesにデバッグに関する記述があります。macOS 10.11から更新されてませんが、10.14.6 Mojaveでも同じように動かすことができていますのでとりあえずは大丈夫。なはず。
記事執筆時点のマシン環境
macOS 10.14.6 Mojave
Safari 13.1.1
そう、Safariが必要です。
JXAデバッグでWEBインスペクタを利用する手順
- Safariを起動する
- Safariからその設定をオンにする
- JXAに
debuggerを記述する - スクリプトを実行する
という流れになります。
SafariのWEBインスペクタをオンにする
Safariを起動し、開発タブからJSContextsのWebインスペクタを自動的に表示をオンにします。
もし開発タブがメニューバーに表示されていなければ、環境設定の詳細タブから図のチェックボックスをオンにします。
Safari側の設定はこれでおしまいです。Safariは起動しておいてください（ウィンドウは開いてなくても大丈夫です）。
JXAにdebuggerを記述する
スクリプトエディタでもAutomationのサービスでもやり方は同じです。コードの中にdebuggerを記述してください。
スクリプトを実行する
スクリプトを実行すると、WEBインスペクタが立ち上がり、スクリプトがdebuggerの場所をブレークポイントとして止まります。
コンソールタブではブラウザやVSCodeのコンソールと同じように変数などを参照することができて便利です。
;を付けるといいみたいです。
Automatorでもデバッグできる
debuggerの記述が残っていると、サービスとして利用した際に毎回WEBインスペクタが立ち上がってしまうので注意してください。
おわりに
こんな感じでWEBインスペクタを使うとJXAのデバッグが非常に簡単になります。個人的には変数やプロパティに何があるかとか、その型が何であるかとか、そういうのが俯瞰できるだけで大助かりです。
