継続的インテグレーション

拡張機能の統合テストは、CI サービス上で実行できます。@vscode/test-electron ライブラリは、CI プロバイダー上での拡張機能テストのセットアップを支援し、Azure Pipelines 上でセットアップされたサンプル拡張機能が含まれています。ビルドパイプラインを確認するか、直接 azure-pipelines.yml ファイルへ進んでください。

自動発行

CI を設定して、拡張機能の新しいバージョンを自動的に発行することも可能です。

発行コマンドは vsce を使用してローカル環境から発行する場合と同様ですが、パーソナルアクセストークン (PAT) を安全な方法で提供する必要があります。PAT を VSCE_PAT というシークレット変数として保存することで、vsce がそれを使用できるようになります。シークレット変数は公開されることがないため、CI パイプラインで使用しても安全です。

Azure Pipelines

Azure Pipelines は、Windows、macOS、Linux 上でのテスト実行をサポートしているため、VS Code 拡張機能のテストを実行するのに最適です。オープンソースプロジェクトの場合、無制限の実行時間と 10 個の無料並列ジョブを利用できます。このセクションでは、拡張機能テストを実行するための Azure Pipelines の設定方法を説明します。

まず、Azure DevOps で無料アカウントを作成し、拡張機能用の Azure DevOps プロジェクトを作成してください。

次に、以下の azure-pipelines.yml ファイルを拡張機能リポジトリのルートに追加します。ヘッドレス Linux CI マシン上で VS Code を実行するために必要な Linux 用の xvfb セットアップスクリプトを除けば、定義は非常にシンプルです。

trigger:
  branches:
    include:
    - main
  tags:
    include:
    - v*

strategy:
  matrix:
    linux:
      imageName: 'ubuntu-latest'
    mac:
      imageName: 'macos-latest'
    windows:
      imageName: 'windows-latest'

pool:
  vmImage: $(imageName)

steps:

- task: NodeTool@0
  inputs:
    versionSpec: '10.x'
  displayName: 'Install Node.js'

- bash: |
    /usr/bin/Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
    echo ">>> Started xvfb"
  displayName: Start xvfb
  condition: and(succeeded(), eq(variables['Agent.OS'], 'Linux'))

- bash: |
    echo ">>> Compile vscode-test"
    yarn && yarn compile
    echo ">>> Compiled vscode-test"
    cd sample
    echo ">>> Run sample integration test"
    yarn && yarn compile && yarn test
  displayName: Run Tests
  env:
    DISPLAY: ':99.0'

最後に、DevOps プロジェクトで 新しいパイプラインを作成し、azure-pipelines.yml ファイルを指定します。ビルドをトリガーすれば完了です。

ブランチへのプッシュ時やプルリクエスト時にもビルドが継続的に実行されるように設定できます。詳細については、ビルドパイプラインのトリガーを参照してください。

Azure Pipelines による自動発行

1. Azure DevOps のシークレットに関する説明に従い、VSCE_PAT をシークレット変数として設定します。
2. vsce を devDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
3. PAT を含めずに、package.json に deploy スクリプトを宣言します (デフォルトで、vsce は環境変数 VSCE_PAT をパーソナルアクセストークンとして使用します)。

"scripts": {
  "deploy": "vsce publish --yarn"
}

4. タグが作成されたときにもビルドが実行されるように CI を設定します。

trigger:
  branches:
    include:
    - main
  tags:
    include:
    - refs/tags/v*

5. シークレット変数を使用して yarn deploy を呼び出す publish ステップを azure-pipelines.yml に追加します。

- bash: |
    echo ">>> Publish"
    yarn deploy
  displayName: Publish
  condition: and(succeeded(), startsWith(variables['Build.SourceBranch'], 'refs/tags/'), eq(variables['Agent.OS'], 'Linux'))
  env:
    VSCE_PAT: $(VSCE_PAT)

condition プロパティを使用すると、特定のケースでのみ公開ステップを実行するように CI に指示できます。

この例では、条件には 3 つのチェックが含まれています。

• succeeded() - テストが成功した場合のみ公開します。
• startsWith(variables['Build.SourceBranch'], 'refs/tags/') - タグ付けされた（リリース）ビルドの場合のみ公開します。
• eq(variables['Agent.OS'], 'Linux') - ビルドを複数のエージェント（Windows、Linux など）で実行している場合に含めます。そうでない場合は、条件のこの部分を削除してください。

VSCE_PAT はシークレット変数であるため、そのままでは環境変数として使用できません。そのため、環境変数 VSCE_PAT をシークレット変数に明示的にマッピングする必要があります。

GitHub Actions

GitHub Actions を設定して拡張機能の CI を実行することもできます。ヘッドレス Linux CI マシンでは VS Code を実行するために xvfb が必要となるため、現在の OS が Linux の場合は Xvfb を有効にした環境でテストを実行してください。

on:
  push:
    branches:
      - main

jobs:
  build:
    strategy:
      matrix:
        os: [macos-latest, ubuntu-latest, windows-latest]
    runs-on: ${{ matrix.os }}
    steps:
    - name: Checkout
      uses: actions/checkout@v4
    - name: Install Node.js
      uses: actions/setup-node@v4
      with:
        node-version: 18.x
    - run: npm install
    - run: xvfb-run -a npm test
      if: runner.os == 'Linux'
    - run: npm test
      if: runner.os != 'Linux'

GitHub Actions による自動発行

1. GitHub Actions のシークレットに関する説明に従い、VSCE_PAT を暗号化されたシークレットとして設定します。
2. vsce を devDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
3. PAT を含めずに、package.json に deploy スクリプトを宣言します。

"scripts": {
  "deploy": "vsce publish --yarn"
}

4. タグが作成されたときにもビルドが実行されるように CI を設定します。

on:
  push:
    branches:
    - main
  release:
    types:
    - created

5. シークレット変数を使用して npm run deploy を呼び出す publish ジョブをパイプラインに追加します。

- name: Publish
  if: success() && startsWith(github.ref, 'refs/tags/') && matrix.os == 'ubuntu-latest'
  run: npm run deploy
  env:
    VSCE_PAT: ${{ secrets.VSCE_PAT }}

if プロパティを使用すると、特定のケースでのみ公開ステップを実行するように CI に指示できます。

この例では、条件には 3 つのチェックが含まれています。

• success() - テストが成功した場合のみ公開します。
• startsWith(github.ref, 'refs/tags/') - タグ付けされた（リリース）ビルドの場合のみ公開します。
• matrix.os == 'ubuntu-latest' - ビルドを複数のエージェント（Windows、Linux など）で実行している場合に含めます。そうでない場合は、条件のこの部分を削除してください。

GitLab CI

GitLab CI を使用して、ヘッドレス Docker コンテナ内で拡張機能のテストや発行を行うことができます。これには、事前設定された Docker イメージをプルするか、パイプラインの実行中に xvfb および Visual Studio Code の実行に必要なライブラリをインストールする方法があります。

image: node:12-buster

before_script:
  - npm install

test:
  script:
    - |
      apt update
      apt install -y libasound2 libgbm1 libgtk-3-0 libnss3 xvfb
      xvfb-run -a npm run test

GitLab CI による自動発行

1. GitLab CI のドキュメントに従い、VSCE_PAT をマスクされた変数として設定します。
2. vsce を devDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
3. PAT を含めずに、package.json に deploy スクリプトを宣言します。

"scripts": {
  "deploy": "vsce publish --yarn"
}

4. タグが付けられたときにのみトリガーされる、マスクされた変数を使用して npm run deploy を呼び出す deploy ジョブを追加します。

deploy:
  only:
    - tags
  script:
    - npm run deploy

よくある質問

継続的インテグレーションに Yarn を使う必要がありますか？

上記のすべての例は Yarn で構築された架空のプロジェクトを前提としていますが、npm、Grunt、Gulp、またはその他の JavaScript ビルドツールを使用するように適合させることができます。