Merge: main -> buffer/2024-02-18

VOICEVOX · Feb 18, 2024 · 0896bd3 · 0896bd3
2 parents 0acfe45 + 821d298
commit 0896bd3
Show file tree

Hide file tree

Showing 148 changed files with 10,646 additions and 2,014 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -11,6 +11,7 @@ module.exports = {
     "@vue/prettier",
     "@vue/eslint-config-typescript/recommended",
     "@vue/eslint-config-prettier",
+    "plugin:@voicevox/all",
   ],
   plugins: ["import"],
   parser: "vue-eslint-parser",
@@ -55,34 +56,13 @@ module.exports = {
         order: ["template", "script", "style"],
       },
     ],
-    "import/order": "error",
-    "no-restricted-syntax": [
-      "warn",
-      {
-        selector:
-          "BinaryExpression[operator='==='][right.type='Literal'][right.value=null]",
-        message:
-          "'=== null'ではなく'== null'を使用してください。詳細: https://github.com/VOICEVOX/voicevox/issues/1513",
-      },
-      {
-        selector:
-          "BinaryExpression[operator='!=='][right.type='Literal'][right.value=null]",
-        message:
-          "'!== null'ではなく'!= null'を使用してください。詳細: https://github.com/VOICEVOX/voicevox/issues/1513",
-      },
-      {
-        selector:
-          "BinaryExpression[operator='==='][right.type='Identifier'][right.name=undefined]",
-        message:
-          "'=== undefined'ではなく'== undefined'を使用してください。詳細: https://github.com/VOICEVOX/voicevox/issues/1513",
-      },
+    "vue/multi-word-component-names": [
+      "error",
       {
-        selector:
-          "BinaryExpression[operator='!=='][right.type='Identifier'][right.name=undefined]",
-        message:
-          "'!== undefined'ではなく'!= undefined'を使用してください。詳細: https://github.com/VOICEVOX/voicevox/issues/1513",
+        ignores: ["Container", "Presentation"],
       },
     ],
+    "import/order": "error",
   },
   overrides: [
     {

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -27,8 +27,8 @@ on:
 
 env:
   VOICEVOX_ENGINE_REPO_URL: "https://github.com/VOICEVOX/voicevox_engine"
-  VOICEVOX_ENGINE_VERSION: 0.14.7
-  VOICEVOX_RESOURCE_VERSION: 0.15.0-preview.3
+  VOICEVOX_ENGINE_VERSION: 0.16.0
+  VOICEVOX_RESOURCE_VERSION: 0.16.0
   VOICEVOX_EDITOR_VERSION:
     |- # releaseタグ名か、workflow_dispatchでのバージョン名か、999.999.999-developが入る
     ${{ github.event.release.tag_name || github.event.inputs.version || '999.999.999-develop' }}
@@ -119,7 +119,7 @@ jobs:
             compressed_artifact_name: voicevox-macos-cpu
             app_asar_dir: prepackage/VOICEVOX.app/Contents/Resources
             installer_artifact_name: macos-cpu-dmg
-            macos_artifact_name: "VOICEVOX.${ext}"
+            macos_artifact_name: "VOICEVOX ${version}.${ext}"
             os: macos-11
 
     runs-on: ${{ matrix.os }}

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -16,6 +16,29 @@ defaults:
     shell: bash
 
 jobs:
+  config: # 全 jobs で利用する定数の定義. `env` が利用できないコンテキストでも利用できる.
+    runs-on: ubuntu-latest
+    outputs:
+      shouldUpdateSnapshots: ${{ steps.check-whether-to-update-snapshots.outputs.shouldUpdateSnapshots }}
+    steps:
+      - name: Check if commit message includes [update snapshots]
+        id: check-whether-to-update-snapshots
+        uses: actions/github-script@v7
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const commits = ${{ toJson(github.event.commits) }};
+            if (!commits) {
+              // pull_request などでコミットがない場合はスキップ
+              core.setOutput("shouldUpdateSnapshots", false);
+              process.exit(0);
+            }
+            const shouldUpdateSnapshots = commits.some((commit) =>
+              commit.message.toLowerCase().includes("[update snapshots]")
+            );
+            core.setOutput("shouldUpdateSnapshots", shouldUpdateSnapshots);
+            console.log(`shouldUpdateSnapshots: ${shouldUpdateSnapshots}`);
+
   # ビルドのテスト
   build-test:
     runs-on: windows-latest
@@ -38,6 +61,7 @@ jobs:
   # e2e テスト
   e2e-test:
     runs-on: ${{ matrix.os }}
+    needs: [config]
     strategy:
       fail-fast: false
       matrix:
@@ -81,34 +105,19 @@ jobs:
           # .env
           sed -i -e 's|"074fc39e-678b-4c13-8916-ffca8d505d1d"|"208cf94d-43d2-4cf5-abc0-9783cac36d29"|' .env.test
           sed -i -e 's|"../voicevox_engine/run.exe"|"${{ steps.download-engine.outputs.run_path }}"|' .env.test
-          sed -i -e 's|"executionArgs": \[\],|"executionArgs": ["--port=50021"],|' .env.test
+          # GitHub Actions 環境だとたまに50021が封じられていることがあるので、ランダムなポートを使うようにする
+          PORT=$(node -r net -e "server=net.createServer();server.listen(0,()=>{console.log(server.address().port);server.close()})")
+          sed -i -e 's|"host": "http://127.0.0.1:50021"|"host": "http://127.0.0.1:'$PORT'"|' .env.test
+          sed -i -e 's|"executionArgs": \[\],|"executionArgs": ["--port='$PORT'"],|' .env.test
           cp .env.test .env
 
-      - name: Check if commit message includes [update snapshots]
-        id: check-whether-to-update-snapshots
-        uses: actions/github-script@v7
-        with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          script: |
-            const commits = ${{ toJson(github.event.commits) }};
-            if (!commits) {
-              // pull_request などでコミットがない場合はスキップ
-              core.setOutput("shouldUpdateSnapshots", false);
-              process.exit(0);
-            }
-            const shouldUpdateSnapshots = commits.some((commit) =>
-              commit.message.toLowerCase().includes("[update snapshots]")
-            );
-            core.setOutput("shouldUpdateSnapshots", shouldUpdateSnapshots);
-            console.log(`shouldUpdateSnapshots: ${shouldUpdateSnapshots}`);
-
       - name: Run npm run test:browser-e2e
         run: |
           if [ -n "${{ runner.debug }}" ]; then
             export DEBUG="pw:browser*"
           fi
           ARGS=""
-          if [[ ${{ steps.check-whether-to-update-snapshots.outputs.shouldUpdateSnapshots }} == 'true' ]]; then
+          if [[ ${{ needs.config.outputs.shouldUpdateSnapshots }} == 'true' ]]; then
             ARGS="--update-snapshots"
           fi
           npm run test:browser-e2e -- $ARGS
@@ -131,35 +140,49 @@ jobs:
           name: playwright-report-${{ matrix.os }}
           path: playwright-report
 
-      - name: Upload updated snapshots to artifact
-        if: steps.check-whether-to-update-snapshots.outputs.shouldUpdateSnapshots == 'true'
+      - name: Collect patch for snapshots
+        if: needs.config.outputs.shouldUpdateSnapshots == 'true'
+        run: |
+          git add --intent-to-add tests/  # git diff に表示されるようにする
+          git diff tests/  # ロギング用
+          git diff --binary tests/ > patch-${{ matrix.os }}.diff
+
+      - name: Upload patch to artifact
+        if: needs.config.outputs.shouldUpdateSnapshots == 'true'
         uses: actions/upload-artifact@v4
         with:
           name: updated-snapshots-${{ matrix.os }}
-          path: tests/e2e/browser/*-snapshots/*
+          path: patch-${{ matrix.os }}.diff
 
   commit-snapshots:
     runs-on: ubuntu-latest
     permissions:
       contents: write
-    needs:
-      - e2e-test
+    needs: [config, e2e-test]
+    if: needs.config.outputs.shouldUpdateSnapshots == 'true'
     steps:
       - uses: actions/checkout@v3
 
       - name: Download artifacts
         uses: actions/download-artifact@v4
         with:
           pattern: updated-snapshots-*
-          path: tests/e2e/browser
+          path: patches
           merge-multiple: true
 
       - name: Commit updated snapshots
         run: |
-          git config --global user.name "github-actions[bot]"
-          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+          # パッチを適用
+          for patch in patches/*.diff; do
+            git apply --allow-empty $patch
+            rm $patch
+          done
+
+          # 変更があるかチェック
           if [ -n "$(git status --porcelain)" ]; then
-            git add tests/e2e/browser
+            git config --global user.name "github-actions[bot]"
+            git config --global user.email "github-actions[bot]@users.noreply.github.com"
+            git add tests/
             git commit -m "（スナップショットを更新）"
             git push
           else

diff --git a/README.md b/README.md
@@ -158,7 +158,7 @@ npm run electron:serve
 npm run browser:serve
 ```
 
-また、main ブランチのビルド結果がこちらにデプロイされています <https://voicevox-browser-dev.netlify.app/#/home>  
+また、main ブランチのビルド結果がこちらにデプロイされています <https://voicevox-browser-dev.netlify.app/#/talk>  
 今はローカル PC 上で音声合成エンジンを起動する必要があります。
 
 ## ビルド
@@ -174,6 +174,7 @@ npm run electron:build
 ```bash
 npm run test:unit
 npm run test-watch:unit # 監視モード
+npm run test:unit -- --update # スナップショットの更新
 ```
 
 ### ブラウザ End to End テスト
@@ -193,16 +194,19 @@ Playwright を使用しているためテストパターンを生成すること
 **ブラウザ版を起動している状態で**以下のコマンドを実行してください。
 
 ```bash
-npx playwright codegen http://localhost:5173/#/home  --viewport-size=800,600
+npx playwright codegen http://localhost:5173/#/talk  --viewport-size=800,600
 ```
 
 詳細は [Playwright ドキュメントの Test generator](https://playwright.dev/docs/codegen-intro) を参照してください。
 
 #### スクリーンショットの更新
 
 ブラウザ End to End テストでは Visual Regression Testing を行っています。
+現在 VRT テストは Windows のみで行っています。
 以下の手順でスクリーンショットを更新できます：
 
+##### Github Actions で更新する場合
+
 1. フォークしたリポジトリの設定で GitHub Actions を有効にします。
 2. リポジトリの設定の Actions > General > Workflow permissions で Read and write permissions を選択します。
 3. `[update snapshots]` という文字列をコミットメッセージに含めてコミットします。
@@ -213,6 +217,14 @@ npx playwright codegen http://localhost:5173/#/home  --viewport-size=800,600
 
 4. Github Workflow が完了すると、更新されたスクリーンショットがコミットされます。
 
+##### ローカルで更新する場合
+
+ローカル PC の OS に対応したもののみが更新されます。
+
+```bash
+npm run test:browser-e2e -- --update-snapshots
+```
+
 ### Electron End to End テスト
 
 Electron の機能が必要な、エンジン起動・終了などを含めた End to End テストを実行します。

diff --git a/docs/UI名称とVueファイル名の対応早見表.md b/docs/UI名称とVueファイル名の対応早見表.md
@@ -12,7 +12,7 @@
 
 ### views ディレクトリ
 
-- メイン画面全体 ･･･ [EditorHome](../src/views/EditorHome.vue)
+- メイン画面全体 ･･･ [EditorHome](../src/components/Talk/EditorHome.vue)
 
 ### compornents ディレクトリ
 
@@ -21,39 +21,39 @@
     - メニューの項目リスト ･･･ [MenuItem](../src/components/MenuItem.vue)
     - メニューのボタン ･･･ [MenuButton](../src/components/MenuButton.vue)
     - エンジン
-      - エンジンの管理 ･･･ [EngineManageDialog](../src/components/EngineManageDialog.vue)
+      - エンジンの管理 ･･･ [EngineManageDialog](../src/components/Dialog/EngineManageDialog.vue)
     - 設定
-      - キー割り当て ･･･ [HotkeySettingDialog](../src/components/HotkeySettingDialog.vue)
-      - ツールバーのカスタマイズ ･･･ [HeaderBarCustomDialog](../src/components/HeaderBarCustomDialog.vue)
-      - キャラクター並び替え・試聴 ･･･ [CharacterOrderDialog](../src/components/CharacterOrderDialog.vue)
-        - サンプルボイス一覧の各キャラクター ･･･ [CharacterTryListenCard](../src/components/CharacterTryListenCard.vue)
-      - デフォルトスタイル ･･･ [DefaultStyleListDialog](../src/components/DefaultStyleListDialog.vue)
-        - 個別選択 ･･･ [DefaultStyleSelectDialog](../src/components/DefaultStyleSelectDialog.vue)
-      - 読み方＆アクセント辞書 ･･･ [DictionaryManageDialog](../src/components/DictionaryManageDialog.vue)
-      - オプション ･･･ [SettingDialog](../src/components/SettingDialog.vue)
-        - 書き出しファイル名パターン ･･･ [FileNamePatternDialog](../src/components/FileNamePatternDialog.vue)
+      - キー割り当て ･･･ [HotkeySettingDialog](../src/components/Dialog/HotkeySettingDialog.vue)
+      - ツールバーのカスタマイズ ･･･ [ToolBarCustomDialog](../src/components/Dialog/ToolBarCustomDialog.vue)
+      - キャラクター並び替え・試聴 ･･･ [CharacterOrderDialog](../src/components/Dialog/CharacterOrderDialog.vue)
+        - サンプルボイス一覧の各キャラクター ･･･ [CharacterTryListenCard](../src/components/Dialog/CharacterTryListenCard.vue)
+      - デフォルトスタイル ･･･ [DefaultStyleListDialog](../src/components/Dialog/DefaultStyleListDialog.vue)
+        - 個別選択 ･･･ [DefaultStyleSelectDialog](../src/components/Dialog/DefaultStyleSelectDialog.vue)
+      - 読み方＆アクセント辞書 ･･･ [DictionaryManageDialog](../src/components/Dialog/DictionaryManageDialog.vue)
+      - オプション ･･･ [SettingDialog](../src/components/Dialog/SettingDialog.vue)
+        - 書き出しファイル名パターン ･･･ [FileNamePatternDialog](../src/components/Dialog/FileNamePatternDialog.vue)
     - ヘルプ ･･･ `help`ディレクトリ
-      - [HelpDialog](../src/components/help/HelpDialog.vue) の`pagedata`の`components`をご参照ください。
+      - [HelpDialog](../src/components/Dialog/HelpDialog/HelpDialog.vue) の`pagedata`の`components`をご参照ください。
   - ウィンドウ右上のボタン群（ピンボタン含む） ･･･ [TitleBarButtons](../src/components/TitleBarButtons.vue)
     - ピンボタン以外のボタン ･･･ [MinMaxCloseButtons](../src/components/MinMaxCloseButtons.vue)
-- ツールバー ･･･ [HeaderBar](../src/components/HeaderBar.vue)
-- キャラクター表示欄 ･･･ [CharacterPortrait](../src/components/CharacterPortrait.vue)
+- ツールバー ･･･ [ToolBar](../src/components/ToolBar.vue)
+- キャラクター表示欄 ･･･ [CharacterPortrait](../src/components/Talk/CharacterPortrait.vue)
 - 台本欄（テキスト欄追加ボタンを含む） ･･･ [views/EditorHome](../src/views/EditorHome.vue) に含まれる
-  - レーン（行番号・テキスト欄含む） ･･･ [AudioCell](../src/components/AudioCell.vue)
+  - レーン（行番号・テキスト欄含む） ･･･ [AudioCell](../src/components/Talk/AudioCell.vue)
     - キャラクターアイコン ･･･ [CharacterButton](../src/components/CharacterButton.vue)
     - コンテキスト（右クリック）メニュー ･･･ [ContextMenu](../src/components/ContextMenu.vue)
-- パラメータ調整欄 ･･･ [AudioInfo](../src/components/AudioInfo.vue)
-  - プリセット管理 ･･･ [PresetManageDialog](../src/components/PresetManageDialog.vue)
-- 詳細調整欄（各項目・再生ボタンを含む） ･･･ [AudioDetail](../src/components/AudioDetail.vue)
-  - ｱｸｾﾝﾄ項目のうち、文字以外の部分の UI ･･･ [AudioAccent](../src/components/AudioAccent.vue)
-  - ｲﾝﾄﾈｰｼｮﾝ・長さ項目のスライダー [AudioParameter](../src/components/AudioParameter.vue)
+- パラメータ調整欄 ･･･ [AudioInfo](../src/components/Talk/AudioInfo.vue)
+  - プリセット管理 ･･･ [PresetManageDialog](../src/components/Dialog/PresetManageDialog.vue)
+- 詳細調整欄（各項目・再生ボタンを含む） ･･･ [AudioDetail](../src/components/Talk/AudioDetail.vue)
+  - ｱｸｾﾝﾄ項目のうち、文字以外の部分の UI ･･･ [AudioAccent](../src/components/Talk/AudioAccent.vue)
+  - ｲﾝﾄﾈｰｼｮﾝ・長さ項目のスライダー [AudioParameter](../src/components/Talk/AudioParameter.vue)
 - その他
   - 初回起動時に表示される画面
-    - 利用規約 ･･･ [AcceptTermsDialog](../src/components/AcceptTermsDialog.vue)
-    - データ収集とプライバシーポリシー ･･･ [AcceptRetrieveTelemetryDialog](../src/components/AcceptRetrieveTelemetryDialog.vue)
+    - 利用規約 ･･･ [AcceptTermsDialog](../src/components/Dialog/AcceptTermsDialog.vue)
+    - データ収集とプライバシーポリシー ･･･ [AcceptRetrieveTelemetryDialog](../src/components/Dialog/AcceptRetrieveTelemetryDialog.vue)
   - 起動時に表示される画面
-    - 追加キャラクターの紹介 ･･･ [CharacterOrderDialog](../src/components/CharacterOrderDialog.vue)（設定 / キャラクター並び替え・試聴 と共通）
-  - 「音声書き出し」時の成否の通知 ･･･ [SaveAllResultDialog](../src/components/SaveAllResultDialog.vue)
+    - 追加キャラクターの紹介 ･･･ [CharacterOrderDialog](../src/components/Dialog/CharacterOrderDialog.vue)（設定 / キャラクター並び替え・試聴 と共通）
+  - 「音声書き出し」時の成否の通知 ･･･ [SaveAllResultDialog](../src/components/Dialog/SaveAllResultDialog.vue)
   - 一度のみ表示されるヒント ･･･ [ToolTip](../src/components/ToolTip.vue)
-  - 音声生成中の進捗表示 ･･･ [ProgressDialog](../src/components/ProgressDialog.vue)
+  - 音声生成中の進捗表示 ･･･ [ProgressView](../src/components/ProgressView.vue)
   - エラー記録用（UI には影響なし） ･･･ [ErrorBoundary](../src/components/ErrorBoundary.vue)
diff --git a/docs/UX・UIデザインの方針.md b/docs/UX・UIデザインの方針.md
@@ -45,7 +45,7 @@
    - テキストでも手書きの図でもサンプル実装でもなんでも OK です
 2. 実際に実装してプルリクエストを作成
    - UI/UX デザインは触ってみないとわからない部分が多いので、実装をお願いする形になります
-   - デザインの変更はコード量が少なくても内容がかさばるので、+-合計80程度の差分に収めておくとマージまでがスムーズです
+   - デザインの変更はコード量が少なくても内容がかさばるので、+-合計 80 程度の差分に収めておくとマージまでがスムーズです
 3. 問題箇所を洗い出す
 4. マージ
 5. 全体のデザインを見て必要であればメンテナーが微調整
@@ -80,7 +80,7 @@
     - 行番号 ･･･ レーンの番号、レーンがユーザー向けになったら「レーン番号」へ
     - キャラクターアイコン ･･･ キャラクターやスタイルを変更できるボタン
     - テキスト欄 ･･･ 音声合成するためのテキストを入力する区画
-  - テキスト欄追加ボタン 🚷 ･･･ レーンを追加するボタン
+  - テキスト追加ボタン ･･･ レーンを追加するボタン
 - パラメータ調整欄 🚷 ･･･ 画面右にあるパラメータなどを調整できるパネル
 - 詳細調整欄 🚷 ･･･ 画面下にあるイントネーションなどを調整できるパネル
   - 項目 ･･･ 詳細調整欄のイントネーションやアクセントなどの選択ボタン

diff --git a/docs/res/エンジン再起動シーケンス図.md b/docs/res/エンジン再起動シーケンス図.md
@@ -10,8 +10,10 @@ flowchart LR
     408243["各エンジン"] --> 927120["Vuex.GET_ONLY_ENGINE_INFOS"]
     927120 --> 512074["Vuex.POST_ENGINE_START"]
     subgraph 408243["各エンジン"]
-      262932["SET_ENGINE_STATE(state=STARTING)"] --- 595264["back.RESTART_ENGINE"]
-      595264 --- 920995["engine.restartEngine"]
+      262932["SET_ENGINE_STATE(state=STARTING)"] --> 595264["back.RESTART_ENGINE"]
+      595264 --> 920995["engine.restartEngine"]
+      920995 --> 939785["runtimeInfo.setEngineInfos"]
+      939785 --> 494722["runtimeInfo.exportFile"]
     end
     subgraph 512074["Vuex.POST_ENGINE_START"]
       623200["Vuex.GET_ALT_PORT_INFOS"] --> 225947["各エンジン"]