Library

デバッグ機能

Nova 9ではデバッグ機能が追加されました。

サポートされる環境

デバッグに必要なツールが予め正しくインストールされ、環境が整っていればNovaから直接作業を行うことができます:

  • 🐘 PHP
  • 🐍 Python
  • 🏐 Chrome
  • 💎 Node.js – 🦕 Deno
  • 🟨 Playdate Simulator

これらはユーザーから多くのリクエストが寄せられていたものです。また、Novaユーザーの多くにとってもメリットがあると考えています。今後、さらに多くの環境をサポートしていく可能性もありますし、他の環境のデバッグが行えるよう、拡張APIを提供してく予定です。

これらの環境の使用に関する詳細は、はじめにをご参照ください。

機能

デバッグサイドバー

デバッグサイドバーを使用することで、デバッグセッションを監視し、ブレークポイントを管理できます。サイドバードックに追加し、呼び出し易くすることも可能です。

デバッガペイン

コンソールペインのデバッガセクションは、選択されたセッションを制御するために使用され、一時停止されている間の変数と状態を表示します。デバッグセッションが一時停止すると自動的に展開されます。

ブレークポイント

行ブレークポイントは、エディタ内のガターで行番号をクリックすると追加できます。

間数ブレークポイントは、デバッグサイドバーから追加できます。

例外ブレークポイントは各デバッガによって提供されます。最初にデバッグセッションを呼び出した際、デバッグサイドバーに表示されます。

任意のブレークポイントをダブルクリックし、各ブレークポイントに到達した際の実行条件と追加のアクションを設定できます。

はじめに

🐘 PHP

  1. PHP環境に Xdebug 正しくインストールされていることを確認します。

    • 必要に応じて、PHPとXdebugの両方をHomebrewとPECLでインストールできます:
      1. brew install php
      2. pecl install xdebug

  2. 続いてphp.iniファイルがXdebugを有効にするよう設定されていることを確認します。通常、これはXdebugインストールプロセスによって自動的に行われます。この設定についてはドキュメントもご参照ください。

    [xdebug]
xdebug.mode = "debug"

  3. Novaのプロジェクト設定にて、PHPテンプレートの1つから新しいタスクを構成します:

    • PHPデバッグテンプレートを使用すると、既存のPHPアプリケーションに接続しデバッグできます。
    • PHPローカルウェブサーバテンプレートを使用すると、phpビルトインウェブサーバとXdebugを使用してNovaから直接、シンプルなPHPアプリを実行できます。このテンプレートは自動的にデバッグリクエストを有効にするので注意してください。

  4. 新しいタスクを実行します。

  5. ウェブアプリケーションのページに移動します。Xdebugが自動的にNovaに接続するでしょう。

🐍 Python

  1. Python環境にdebugpyが正しくインストールされていることを確認します。
    • pip install debugpy もしくは pip3 install debugpy
  2. Novaのプロジェクト設定にて、Pythonテンプレートの1つから新しいタスクを構成します
    • Pythonデバッグテンプレートを使用すると、ローカルのPythonスクリプトおよびモジュールを実行、デバッグできます。
    • Pythonリモートデバッグテンプレートを使用すると、ローカルまたはリモートで実行されているPythonアプリ（サーバ上やコンテナ化された環境など）に接続できます。
  3. 新しいタスクを実行します。

🏐 Chrome

  1. Novaのプロジェクト設定にて、Chromeデバッグテンプレートを使用して新しいタスクを構成します。
    • タスクをLaunchに設定すると、ブラウザが自動的に起動し接続します。
    • タスクをAttachに設定すると、既に実行中のブラウザインスタンスに接続しようとします。
  2. 新しいタスクを実行します。

💎 Node.js

  1. Novaのプロジェクト設定にて、Node.jsデバッグテンプレートを使用して新しいタスクを構成します。
    • タスクをLaunchに設定すると、アプリのインスタンスを自動的に起動し接続します。
    • タスクをAttachに設定すると、既に実行中のアプリのインスタンスに接続しようとします。
  2. 新しいタスクを実行します。

🦕 Deno

  1. Novaのプロジェクト設定にて、Denoデバッグテンプレートを使用して新しいタスクを構成します。
    • タスクをLaunchに設定すると、アプリのインスタンスを自動的に起動し接続します。
    • タスクをAttachに設定すると、既に実行中のアプリのインスタンスに接続しようとします。
  2. 新しいタスクを実行します。

🟨 Playdate

  1. Playdate SDK v1.7以降とPlaydate機能拡張が正しくインストールされていることを確認します。
  2. Novaのプロジェクト設定にて、Playdate Simulatorテンプレートを使用して新しいタスクを構成します。
  3. 新しいタスクを実行します。

拡張性

Novaにおけるデバッグ機能の提供はDebug Adapter Protocolに依存しています。上記の各組み込み環境はこのメカニズムによって実装されており、機能拡張は同じ方法で、追加のデバッガのサポートに貢献できます。

おそらくベータの後半に、追加のデバッガを提供するための拡張テンプレートが追加される予定です。暫定的に、追加のアダプタサポートに興味がある場合は、Novaの組み込み機能拡張（アプリバンドル内のContents/SharedSupport/Extensions/）をご参照ください。新しいAPIを使用するアダプタコードは、各機能拡張のTasks.jsスクリプト内にあります。デバッグサポートが提供される機能拡張は、JavaScript、PHP、およびPythonです。

追記事項

これら情報は、Nova 9 beta 1時点で最新のものです。

🐘 PHP

  • PHPのデバッグ機能は、Xdebugをラップするカスタムアダプターを使用して実装されます。

🐍 Python

  • Pythonのデバッグ機能は、debugpyパッケージを使用して実装されます。
  • Python 3の使用をお勧めします。debugpyはサポートされていますが、Python 2.xではテストされていません。

🏐 Chromeと💎 Node.js

  • ChromeとNodeを使用したデバッグ機能は、Chrome DevToolsをラップするカスタムアダプターを使用して実装されます。
  • Chrome DevToolsは現在、ランタイム内で名前付き関数ブレークポイントをサポートしていないため、現時点でChromeアダプターでサポートされていません。
  • Web WorkersとShared Workersのデバッグはサポートされていますが、完全にはテストされていません。
  • SourceMap resolutionはJavaScriptにコンパイルされるTypeScriptおよび他の言語でサポートされています。TypeScriptファイルにブレークポイントを設定すると、ソースマップが生成されていれば適切に変換されるよう設計されています。
  • DevToolsをサポートする他のChromiumベースのブラウザ（Edgeなど）は動作すると予想されますが、完全にはテストされていません。問題が発生した場合はフィードバックください。

🧭 Safariサポート

Appleのブラウザではデバッガを、サードパーティのツールで制御できません。WebKit内にはデバッグインタフェースが含まれていますが、Safariによる使用はmacOSが適用する特別な権限の下で制限されており、Apple製のソフトウエアのみ使用可能です。

これについて私たちはSafari / WebKitチームと話し合いましたが、残念なことにサードパーティソフトウエアへのサポートは彼らの短期的な計画には含まれていません。今後状況が変わり次第、私たちはそれに取り組みます。

これはビルトインのプレビュー機能でWebKitを使用しているNova自身にも当てはまります。

🦊 Firefoxサポート

FirefoxデバッガはMozillaによるRemote Debugging Protocolを通じて利用可能です。当初はChromeと同様、これを利用してFirefoxをサポートしようとしていました。しかしながらFirefoxプロトコルの複雑さと現在の使用シェア（Macユーザの平均5％未満）により、エンジニアリングリソースを他に割り振ることにしています。