PyCharm 2024.3 ヘルプ

Vitest

PyCharm は、Vite(英語) -native 単体テストフレームワークである Vitest(英語) と統合されます。実行、デバッグ、スナップショットテストの実行、およびエディターと実行 / デバッグ構成の両方からのテストカバレッジの測定を行うことができます。

失敗したテストを再実行するか、監視モードをオンにすることができます。このモードでテストセッションを起動すると、PyCharm はプロジェクトソースコードの変更を監視します。テストまたはそのサブジェクトに変更が加えられるとすぐに、PyCharm は影響を受けるテストを再実行します。実行 / デバッグ構成を再起動する必要さえありません。

始める前に

  1. お使いのコンピューターに Node.js(英語) がインストールされていることを確認してください。

  2. 設定で JavaScript and TypeScript プラグインが有効になっていることを確認します。Ctrl+Alt+S を押して設定を開き、プラグインを選択します。インストール済みタブをクリックします。検索フィールドに JavaScript and TypeScript と入力します。プラグインの詳細については、プラグインのマッピングを参照してください。

Vitest をインストールする

  • 埋め込まれたターミナルAlt+F12)で、次のように入力します。

    npm install --save-dev vitest

Vitest 公式 Web サイトでオンラインドキュメント(英語)および Vitest の設定(英語)の詳細を参照してください。

テストの実行とデバッグ

PyCharm を使用すると、単一の Vitest テストをエディターから直接実行またはデバッグしたり、実行 / デバッグ構成を作成して一部またはすべてのテストを実行またはデバッグしたりできます。

JavaScript および TypeScript コードの Vitest テストの作成の詳細については、Vitest 公式 Web サイトの Vitest の機能(英語)を参照してください。

エディターから単一のテストを実行またはデバッグする

  • ガターで the Run icon または the Rerun icon をクリックし、リストから実行 <テスト名> を選択します。

    Run one Vitest test from the editor

    ガターのテストステータスアイコン Test passed および Test failed により、エディターでテストが成功したか失敗したかを確認することもできます。

  • テストをデバッグするには、テスト内にブレークポイントを設定し、ガターで the Run icon または the Rerun icon をクリックし、リストからデバッグ <テスト名> を選択します。

    Debug one Vitest test from the editor

    デバッグツールウィンドウで、中断されたテストを調べ、ステップ実行します

    A Vitest debugging session

Vitest 実行構成を作成する

  1. 実行 / デバッグ構成ダイアログ (メインメニューの実行 | 実行構成の編集 ) を開き、左側のペインで the Add button をクリックし、リストから Vitest を選択します。「実行 / デバッグ構成: Vitest」ダイアログが開きます。

  2. 使用する Node.js インタープリターを指定します。

    プロジェクトエイリアスを選択すると、PyCharm は Node.js ページの Node インタープリターフィールドからプロジェクトの既定のインタープリターを自動的に使用します。ほとんどの場合、PyCharm はプロジェクトの既定のインタープリターを検出し、フィールド自体に入力します。

    別の構成済みのローカルインタープリターまたはリモートインタープリターを選択するか、the Browse button をクリックして新しいインタープリターを構成することもできます。

    必要に応じて、Node.js に渡す Node.js 固有のオプションパラメーター環境変数(英語)を指定します。

  3. vitest パッケージの場所を指定します。

  4. アプリケーションの作業ディレクトリを指定します。デフォルトでは、作業ディレクトリフィールドにはプロジェクトのルートフォルダーが表示されます。この定義済みの設定を変更するには、目的のフォルダーへのパスを指定します。

  5. 実行するテストを指定します。これは、特定のテストまたはスイート、テストファイル全体、テストファイルを含むフォルダーにすることができます。

  6. デフォルトでは、vite.config.ts が使用されます。vite.config.ts が存在しない場合、またはカスタム構成を使用する場合は、使用する vitest.config.ts を指定します。詳細については、Vitest オフィシャル Web サイト(英語)を参照してください。

  7. オプション:

    それらまたは関連するソースファイルの変更時に自動的に再実行されるテストを構成します。これを行うには、Vitest オプションフィールドに --watch フラグを追加します。

    他の Vitest オプションを追加することもできます。詳細については、Vitest オフィシャル Web サイト(英語)を参照してください。

  8. オプション:

    Node オプションフィールドに、Node.js 実行可能ファイルに渡される Node.js 固有のコマンドラインオプションを入力します。許容されるオプションは次のとおりです。

    • 実行中に CoffeeScript ファイルをオンザフライで JavaScript にコンパイルするには、--require coffeescript/register を使用します。

      このモードでは、coffeescript パッケージの一部である register.js ファイルがプロジェクト内に配置されている必要があります。CoffeeScript コンパイラーをインストールするの説明に従って、coffeescript パッケージがローカルにインストールされていることを確認してください。

    • Chrome デバッグプロトコル(英語)サポートには --inspect または --inspect-brk パラメーターを使用します。

実行構成を介してテストを実行する

  1. 構成のリストから Vitest 実行 / デバッグ構成を選択し、リストまたはツールバーの the Run icon をクリックします。

    select run/debug configuration
  2. 実行ツールウィンドウのテストランナータブで、テストの実行を監視し、テスト結果を分析します。詳細については、テスト結果を調べるを参照してください。

    Vitest: test results

テストをデバッグするには、必要に応じてブレークポイントを設定し、実行 / デバッグ構成を選択して、the Debug button をクリックします。

テストの再実行

指定したスコープ Alt+Shift+R 内のすべてのテストを再実行するか、失敗したテストのみを再実行できます。

--watch モード(英語)でテストを起動することもできます。このモードでは、PyCharm モニターは、テストおよび関連するテスト対象への変更を保存しました。変更が検出されるとすぐに、PyCharm は現在のテストセッションを停止することなく、影響を受けたテストを再実行します。

失敗したテストの再実行

  • テスト結果ツールバーの the Rerun Failed Tests icon をクリックします。PyCharm は、前回のセッション中に失敗したすべてのテストを実行します。

    Vitest: Rerunning all failed tests
  • 特定の失敗したテストを再実行するには、そのコンテキストメニューで実行 <テスト名> を選択します。

詳細は、テストの再実行を参照してください。

更新されたテストを自動的に再実行する (--watch モード)

  1. Vitest 実行 / デバッグ構成を開くか、上記のように新しい構成を作成します。

  2. Vitest オプションフィールドに --watch と入力します。自動生成されたすべてのテスト構成では、--watch オプションがすでに指定されています。

  3. 実行 / デバッグ構成を起動します。一部のテストが失敗した場合、テストセッションを停止することなく、それらのテストまたは関連するテストサブジェクトを更新できます。変更が保存されるとすぐに、PyCharm はそれらを検出し、影響を受けるテストを再実行します。

    以下の例では、vue.test.ts29 行でのテストが失敗します。--watch オプションを使用すると、vue.test.ts'4 x 4 = 18''4 x 4 = 16' に置き換え、変更を Ctrl+S で保存するか、フォーカスを PyCharm から移動した後で、テストが再実行されます。

    Rerun updated test in the --watch mode

スナップショットテスト

PyCharm は Vitest スナップショットテスト(英語)もサポートします。PyCharm が初めて toMatchSnapshot() メソッドでテストを実行すると、スナップショットファイルが作成され、toMatchSnapshot () の横のガターに Snapshot アイコンが表示されます。the Snapshot icon をクリックして、生成されたスナップショットを開きます。

Snapshot

コードカバレッジを監視する

PyCharm を使用すると、Vitest テストでカバーされている(英語)コードの量を監視することもできます。PyCharm は、専用のカバレッジツールウィンドウにこの統計を表示し、カバーされた行とカバーされていない行をエディターとプロジェクトツールウィンドウで視覚的にマークします。

Vitest Coverage report

Vitest のコードカバレッジを有効にする

c8 または istanbul(英語) をインストールします。これを行うには、組み込みのターミナル Alt+F12 を開き、次のいずれかを入力します。

  • npm install --save-dev @vitest/coverage-c8

  • npm install --save-dev @vitest/coverage-istanbul .

Vitest 公式 Web サイトでカバレッジ(英語)の詳細を参照してください。

カバレッジでテストを実行する

  1. エディターからのカバレッジで特定のスイートまたはテストを実行します。ガターで the Run button または the Rerun button をクリックし、リストからカバレッジで <test_name> を実行するを選択します。

    Run Vitest tests with coverage from the editor

    あるいは:

    上記の説明に従って、Vitest 実行 / デバッグ構成を作成します。メインツールバーのリストから Vitest 実行 / デバッグ構成を選択し、リストの右側にある Run with Coverage icon をクリックします。

  2. カバレッジツールウィンドウでコードカバレッジを監視します。このレポートには、テストでカバーされたファイルの数と、その中にカバーされている行の割合が表示されます。レポートから、ファイルに移動して、どの行が覆われていたか(緑色にマーキングされているか、どの行が覆われていないか)、赤色に表示されているかを確認できます。

関連ページ:

プラグインのインストール

プラグインは PyCharm のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。プラグイン設定を開くを押して設定を開き、を選択します。マーケットプレースタブを使用して、JetBrains マーケット...

ブレークポイント

ブレークポイントは、特定のポイントでプログラムの実行を一時停止する特別なマーカーです。これにより、プログラムの状態と動作を調べることができます。ブレークポイントは、たとえば、特定のコード行に到達したときにプログラムを一時停止するなどの単純なものから、追加の条件をチェックしたり、ログに書き込んだりするなどのより複雑なロジックを含むものまであります。ブレークポイントは、一度設定すると、一時的なブレークポイントを除き、明示的に削除するまでプロジェクト内に残ります。ブレークポイントの種類:PyChar

中断されたプログラムを調べる

デバッガーセッションが開始されると、デバッグツールウィンドウが表示され、次のいずれかが発生するまでプログラムが正常に実行されます。ブレークポイントがヒットしました、プログラムを手動で一時停止する、その後、プログラムは中断され、現在の状態を調べたり、実行を制御したり、実行時にさまざまなシナリオをテストしたりできます。フレームを調べる:プログラムの状態はフレームで表されます。プログラムが一時停止すると、現在のフレームスタックがデバッグツールウィンドウのフレームタブに表示されます。フレームはアクティ

プログラムのステップスルー

ステップは、プログラムの段階的な実行を制御するプロセスです。PyCharm は、次の行に直接移動する必要があるか、中間のメソッド呼び出しもインスペクションする必要があるかなど、戦略に応じて使用される一連のステップアクションを提供します。ステップボタンは、デバッグウィンドウのツールバーにあります。ステップオーバー:現在のコード行をステップオーバーし、ハイライトされた行にメソッド呼び出しが含まれている場合でも、次の行に移動します。メソッドの実装はスキップされ、呼び出し元メソッドの次の行に直接移動し...

実行 / デバッグ構成ダイアログ

このダイアログを使用して、実行 / デバッグ構成を作成、編集、調整、削除したり、新しく作成されたすべての実行 / デバッグ構成に適用されるデフォルトのテンプレートを構成したりします。既存の実行 / デバッグ構成は、構成タイプごとにグループ化されています。新しい構成を作成するためのテンプレートは編集可能であり、ダイアログの左側のペインにある構成テンプレートの編集リンクから利用できます。いくつかの実行 / デバッグ構成では、PyCharm はログファイルでの出力の表示をサポートしています。対応する実...

実行 / デバッグ構成: Node.js

作成: 次の Node.js バージョンは、PyCharm 2023.3 以降でサポートされています。Node.js 20 - アクティブな長期サポート (LTS) バージョン、Node.js 21 - 現在のバージョン、サポートされている Node.js バージョンの詳細を参照してください。このダイアログで、コンピューター上の Node.js アプリケーションと一緒にデバッガーを開始するための構成を作成します。始める前に:Node.js をダウンロードしてインストールします。JetBrains...