IntelliJ IDEA 2026.1 Help

Cucumber.js

Cucumber.js(英語) は、ビヘイビア駆動 JavaScript 開発用のテストフレームワークです。 Cucumber.js テストは、人間が読める Gherkin(英語) 言語で記述されており、拡張子 feature を持つ 機能(英語)ファイルに保存されます。 IntelliJ IDEA は Cucumber.js と統合し、Gherkin で記述された機能を認識するため、IDE から直接 Cucumber.js テストを実行できます。

始める前に

  1. Cucumber.js バージョン 6.0.0+ を使用するには、IntelliJ IDEA 2020.3.1 以降を使用していることを確認してください。

  2. Node.js をダウンロードしてインストールします。

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

  4. JetBrains Marketplace からプラグインをインストールする説明に従って、 Cucumber.js および Gherkin プラグインを 設定 | プラグイン ページの Marketplace タブにインストールします。 プラグインは IntelliJ IDEA Ultimate でのみ利用できます。

Cucumber.js をインストールする

  • 埋め込まれた ターミナル （Alt+F12 ）で、次のいずれかのコマンドを入力します。

    • npm install cucumber をプロジェクトにローカルインストールします。

    • グローバルインストール用の npm install -g cucumber

    • npm install --save-dev cucumber は、Cucumber.js を 開発依存関係(英語)としてインストールします。

    Cucumber.js 公式サイトの Cucumber.js デモ(英語)も参照してください。

テスト定義の作成

IntelliJ IDEA では、JavaScript と TypeScript の両方でステップ定義を書くことができます。 IntelliJ IDEA は定義が欠落しているステップを検出してハイライトし、生成するためのクイックフィックスを提案します。

  1. 定義なしのステップにキャレットを置き、 Alt+Enter を押して、 ステップ定義を作成する または すべてのステップ定義を作成する を選択します。

    Cucumber.js ステップ定義を作成する: クイックフィックス

    または、ステップの上にマウスを移動し、ポップアップ内のリンクを使用します。

    Cucumber.js ステップ定義の作成: ポップアップからアクションを呼び出す

  2. 表示されたダイアログで、新しいファイルの名前と定義を書き込む言語を指定します。

    Cucumber.js ステップ定義の作成: 言語バージョンを選択

    そのようなファイルがすでに存在する場合は、IntelliJ IDEA はポップアップを表示して、そこに定義を追加するファイルを選択するか、新しいファイルを作成することを選択する必要があります。

テストの実行

Cucumber.js テストは、実行 / デバッグ構成によってのみ起動されます。

Cucumber.js 実行構成を作成する

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

  2. フィーチャーファイルまたはディレクトリ フィールドで、実行するテストを指定します。 多数の機能を実行する場合は、特定の .feature ファイルまたはフォルダーへのパスを入力します。

  3. 使用する Node.js ランタイムを指定します。

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

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

  4. Cucumber パッケージ フィールドで、 cucumber パッケージが格納されているフォルダーへのパスを指定します。

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

  6. オプション:

    • 「名前フィルター 」フィールドに、フィーチャーファイルまたはディレクトリからのすべてのシナリオの代わりに実行する特定のシナリオの名前を入力します。

    • 実行可能ファイルに渡すコマンドライン引数 (-r--require LIBRARY|DIR、 -t--tags TAG_EXPRESSION、 --coffee など) を指定します。 詳細については、 cucumber-js --help コマンドを通じて利用できるネイティブの組み込みヘルプを参照してください。

    • 環境変数 フィールドで、アプリケーションの環境変数を指定します。

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

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

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

テストファイルからテストを実行する

  • 単一のテストを実行するには、エディターでテストファイルを開き、実行するシナリオにキャレットを置き、コンテキストメニューから シナリオ実行: ＜シナリオ名＞ を選択します。

  • 単一のテストファイルからすべてのテストを実行するには、エディターでテストファイルを開くか、 プロジェクト ツールウィンドウでテストファイルを選択し、コンテキストメニューから <configuration> を実行する を選択します。

どちらの場合でも、IntelliJ IDEA は実行 / デバッグ構成を作成し、後で保存して使用することができます。

デバッグテスト

実行構成によるテストのデバッグ

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

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

テストファイルからテストをデバッグする

  • 単一のテストをデバッグするには、必要に応じて ブレークポイントを設定し 、デバッグするシナリオにキャレットを置き、コンテキストメニューから デバッグシナリオ: ＜シナリオ名＞ を選択します。

  • 単一のテストファイルからすべてのテストをデバッグするには、エディターでテストファイルを開くか、 プロジェクト ツールウィンドウでテストファイルを選択し、コンテキストメニューから デバッグ <名前> を選択します。

どちらの場合でも、IntelliJ IDEA は実行 / デバッグ構成を作成し、後で保存して使用することができます。

TypeScript で書かれたテストの実行とデバッグ

  1. 上記のように Cucumber.js 実行 / デバッグ構成を作成します。

  2. 起動前 領域で、 追加ボタン をクリックし、一覧から TypeScript のコンパイル を選択して、使用する tsconfig.json ファイルを指定します。 IntelliJ IDEA は、Cucumber.js を実行する前に、この tsconfig.json を使って TypeScript コンパイラーを実行します。

    Cucumber.js 実行構成: 起動前のコンパイル TypeScript タスクの追加

  3. TypeScript で書かれたテストをデバッグするには、 tsconfig.json を開き、 "sourceMap": true を設定してソースマップを有効にします。

IntelliJ IDEA を使用すると、ファイルと関連テストファイルの間、または テストランナータブのテスト結果からテストに移動できます。

  • テストとそのサブジェクト間、またはその逆に移動するには、エディターでファイルを開き、コンテキストメニューから テスト(S) へ移動 または 移動先 | テスト対象 を選択するか、 Ctrl+Shift+T を押します。

  • .feature ファイルのステップからステップ定義に移動するには、 Ctrl を押したまま、ステップにカーソルを合わせ、リンクになったときにステップをクリックします。

  • テスト結果からテスト定義に移動するには、「テストランナー 」タブでテスト名を 2 回クリックするか、コンテキストメニューから「ソースに移動 」を選択するか、単に F4 を押します。 テストファイルがエディターで開き、テスト定義にキャレットが置かれます。

構文ハイライトを構成する

好みや習慣に応じて、Cucumber.js 対応の構文ハイライトを設定できます。

  1. 設定 ダイアログ (Ctrl+Alt+S) で、 エディター | カラースキームの切り替え | Cucumber に進みます。

  2. カラースキームを選択し、デフォルトから引き継がれたハイライト設定を受け入れるか、 色とフォント に記載された手順 に従ってカスタマイズしてください。

2026 年 3 月 30 日
JavaScript のテストJest