From b4455924a4dd55f56d56af6ad76580856e91744f Mon Sep 17 00:00:00 2001
From: Hiroshiba <hihokaruta@gmail.com>
Date: Sat, 21 Dec 2024 22:31:41 +0900
Subject: [PATCH 1/5] =?UTF-8?q?Refactoring:=20=E3=83=9B=E3=83=83=E3=83=88?=
 =?UTF-8?q?=E3=82=AD=E3=83=BC=E5=91=A8=E3=82=8A=E3=81=AE=E5=88=9D=E6=9C=9F?=
 =?UTF-8?q?=E5=80=A4=E3=81=AA=E3=81=A9=E3=82=92domain=E3=81=AB=E5=88=87?=
 =?UTF-8?q?=E3=82=8A=E5=87=BA=E3=81=99=20(#2366)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/browser/sandbox.ts                |   2 +-
 src/backend/common/ConfigManager.ts           |   8 +-
 .../Dialog/HotkeyRecordingDialog.vue          |   2 +-
 src/components/Dialog/HotkeySettingDialog.vue |   8 +-
 src/components/Menu/MenuItem.vue              |   2 +-
 src/components/Talk/TalkEditor.vue            |   6 +-
 src/domain/hotkeyAction.ts                    | 199 +++++++++++++++++
 src/plugins/hotkeyPlugin.ts                   |   2 +-
 src/store/setting.ts                          |   2 +-
 src/store/type.ts                             |   2 +-
 src/type/ipc.ts                               |   2 +-
 src/type/preload.ts                           | 204 +-----------------
 tests/unit/lib/hotkeyManager.spec.ts          |   2 +-
 13 files changed, 225 insertions(+), 216 deletions(-)
 create mode 100644 src/domain/hotkeyAction.ts

diff --git a/src/backend/browser/sandbox.ts b/src/backend/browser/sandbox.ts
index a722a36189..38b0f12e7a 100644
--- a/src/backend/browser/sandbox.ts
+++ b/src/backend/browser/sandbox.ts
@@ -13,10 +13,10 @@ import {
   EngineId,
   EngineSettingType,
   EngineSettings,
-  HotkeySettingType,
   Sandbox,
 } from "@/type/preload";
 import { AssetTextFileNames } from "@/type/staticResources";
+import { HotkeySettingType } from "@/domain/hotkeyAction";
 
 const toStaticPath = (fileName: string) =>
   `${import.meta.env.BASE_URL}/${fileName}`.replaceAll(/\/\/+/g, "/");
diff --git a/src/backend/common/ConfigManager.ts b/src/backend/common/ConfigManager.ts
index 22f5db1d28..ac23b792dd 100644
--- a/src/backend/common/ConfigManager.ts
+++ b/src/backend/common/ConfigManager.ts
@@ -5,15 +5,17 @@ import {
   ConfigType,
   configSchema,
   DefaultStyleId,
-  defaultHotkeySettings,
-  HotkeySettingType,
   ExperimentalSettingType,
-  HotkeyCombination,
   VoiceId,
   PresetKey,
 } from "@/type/preload";
 import { ensureNotNullish } from "@/helpers/errorHelper";
 import { loadEnvEngineInfos } from "@/domain/defaultEngine/envEngineInfo";
+import {
+  HotkeyCombination,
+  defaultHotkeySettings,
+  HotkeySettingType,
+} from "@/domain/hotkeyAction";
 
 const lockKey = "save";
 
diff --git a/src/components/Dialog/HotkeyRecordingDialog.vue b/src/components/Dialog/HotkeyRecordingDialog.vue
index 46047b9b65..b54bcc0d9e 100644
--- a/src/components/Dialog/HotkeyRecordingDialog.vue
+++ b/src/components/Dialog/HotkeyRecordingDialog.vue
@@ -83,7 +83,7 @@
 
 <script setup lang="ts">
 import { computed } from "vue";
-import { HotkeyCombination } from "@/type/preload";
+import { HotkeyCombination } from "@/domain/hotkeyAction";
 
 const props = defineProps<{
   isHotkeyDialogOpened: boolean;
diff --git a/src/components/Dialog/HotkeySettingDialog.vue b/src/components/Dialog/HotkeySettingDialog.vue
index 09e7d75e16..44900bddc8 100644
--- a/src/components/Dialog/HotkeySettingDialog.vue
+++ b/src/components/Dialog/HotkeySettingDialog.vue
@@ -126,12 +126,12 @@ import BaseButton from "@/components/Base/BaseButton.vue";
 import BaseIconButton from "@/components/Base/BaseIconButton.vue";
 import BaseScrollArea from "@/components/Base/BaseScrollArea.vue";
 import { useStore } from "@/store";
+import { useHotkeyManager, eventToCombination } from "@/plugins/hotkeyPlugin";
 import {
-  defaultHotkeySettings,
-  HotkeyActionNameType,
   HotkeyCombination,
-} from "@/type/preload";
-import { useHotkeyManager, eventToCombination } from "@/plugins/hotkeyPlugin";
+  HotkeyActionNameType,
+  defaultHotkeySettings,
+} from "@/domain/hotkeyAction";
 
 const props = defineProps<{
   modelValue: boolean;
diff --git a/src/components/Menu/MenuItem.vue b/src/components/Menu/MenuItem.vue
index 655fba721d..71c8291856 100644
--- a/src/components/Menu/MenuItem.vue
+++ b/src/components/Menu/MenuItem.vue
@@ -74,7 +74,7 @@
 import { ref, computed, watch } from "vue";
 import { MenuItemData } from "./type";
 import { useStore } from "@/store";
-import { hotkeyActionNameSchema } from "@/type/preload";
+import { hotkeyActionNameSchema } from "@/domain/hotkeyAction";
 const props = withDefaults(
   defineProps<{
     selected?: boolean;
diff --git a/src/components/Talk/TalkEditor.vue b/src/components/Talk/TalkEditor.vue
index 2038c1e3e8..ecf68b6041 100644
--- a/src/components/Talk/TalkEditor.vue
+++ b/src/components/Talk/TalkEditor.vue
@@ -135,12 +135,14 @@ import {
   PresetKey,
   SplitterPositionType,
   Voice,
-  HotkeyActionNameType,
-  actionPostfixSelectNthCharacter,
 } from "@/type/preload";
 import { useHotkeyManager } from "@/plugins/hotkeyPlugin";
 import onetimeWatch from "@/helpers/onetimeWatch";
 import path from "@/helpers/path";
+import {
+  actionPostfixSelectNthCharacter,
+  HotkeyActionNameType,
+} from "@/domain/hotkeyAction";
 
 const props = defineProps<{
   isEnginesReady: boolean;
diff --git a/src/domain/hotkeyAction.ts b/src/domain/hotkeyAction.ts
new file mode 100644
index 0000000000..2b62282072
--- /dev/null
+++ b/src/domain/hotkeyAction.ts
@@ -0,0 +1,199 @@
+import { z } from "zod";
+import { isMac } from "@/helpers/platform";
+
+const hotkeyCombinationSchema = z.string().brand("HotkeyCombination");
+export type HotkeyCombination = z.infer<typeof hotkeyCombinationSchema>;
+export const HotkeyCombination = (
+  hotkeyCombination: string,
+): HotkeyCombination => hotkeyCombinationSchema.parse(hotkeyCombination);
+
+// 共通のアクション名
+export const actionPostfixSelectNthCharacter = "番目のキャラクターを選択";
+
+export const hotkeyActionNameSchema = z.enum([
+  "音声書き出し",
+  "選択音声を書き出し",
+  "音声を繋げて書き出し",
+  "再生/停止",
+  "連続再生/停止",
+  "ｱｸｾﾝﾄ欄を表示",
+  "ｲﾝﾄﾈｰｼｮﾝ欄を表示",
+  "長さ欄を表示",
+  "テキスト欄を追加",
+  "テキスト欄を複製",
+  "テキスト欄を削除",
+  "テキスト欄からフォーカスを外す",
+  "テキスト欄にフォーカスを戻す",
+  "元に戻す",
+  "やり直す",
+  "新規プロジェクト",
+  "プロジェクトを名前を付けて保存",
+  "プロジェクトを上書き保存",
+  "プロジェクトを読み込む",
+  "テキストを読み込む",
+  "全体のイントネーションをリセット",
+  "選択中のアクセント句のイントネーションをリセット",
+  "コピー",
+  "切り取り",
+  "貼り付け",
+  "すべて選択",
+  "選択解除",
+  "全セルを選択",
+  `1${actionPostfixSelectNthCharacter}`,
+  `2${actionPostfixSelectNthCharacter}`,
+  `3${actionPostfixSelectNthCharacter}`,
+  `4${actionPostfixSelectNthCharacter}`,
+  `5${actionPostfixSelectNthCharacter}`,
+  `6${actionPostfixSelectNthCharacter}`,
+  `7${actionPostfixSelectNthCharacter}`,
+  `8${actionPostfixSelectNthCharacter}`,
+  `9${actionPostfixSelectNthCharacter}`,
+  `10${actionPostfixSelectNthCharacter}`,
+  "全画面表示を切り替え",
+  "拡大",
+  "縮小",
+  "拡大率のリセット",
+]);
+export type HotkeyActionNameType = z.infer<typeof hotkeyActionNameSchema>;
+
+export const hotkeySettingSchema = z.object({
+  action: hotkeyActionNameSchema,
+  combination: hotkeyCombinationSchema,
+});
+export type HotkeySettingType = z.infer<typeof hotkeySettingSchema>;
+
+// ホットキーを追加したときは設定のマイグレーションが必要
+export const defaultHotkeySettings: HotkeySettingType[] = [
+  {
+    action: "音声書き出し",
+    combination: HotkeyCombination(!isMac ? "Ctrl E" : "Meta E"),
+  },
+  {
+    action: "選択音声を書き出し",
+    combination: HotkeyCombination("E"),
+  },
+  {
+    action: "音声を繋げて書き出し",
+    combination: HotkeyCombination(""),
+  },
+  {
+    action: "再生/停止",
+    combination: HotkeyCombination("Space"),
+  },
+  {
+    action: "連続再生/停止",
+    combination: HotkeyCombination("Shift Space"),
+  },
+  {
+    action: "ｱｸｾﾝﾄ欄を表示",
+    combination: HotkeyCombination("1"),
+  },
+  {
+    action: "ｲﾝﾄﾈｰｼｮﾝ欄を表示",
+    combination: HotkeyCombination("2"),
+  },
+  {
+    action: "長さ欄を表示",
+    combination: HotkeyCombination("3"),
+  },
+  {
+    action: "テキスト欄を追加",
+    combination: HotkeyCombination("Shift Enter"),
+  },
+  {
+    action: "テキスト欄を複製",
+    combination: HotkeyCombination(!isMac ? "Ctrl D" : "Meta D"),
+  },
+  {
+    action: "テキスト欄を削除",
+    combination: HotkeyCombination("Shift Delete"),
+  },
+  {
+    action: "テキスト欄からフォーカスを外す",
+    combination: HotkeyCombination("Escape"),
+  },
+  {
+    action: "テキスト欄にフォーカスを戻す",
+    combination: HotkeyCombination("Enter"),
+  },
+  {
+    action: "元に戻す",
+    combination: HotkeyCombination(!isMac ? "Ctrl Z" : "Meta Z"),
+  },
+  {
+    action: "やり直す",
+    combination: HotkeyCombination(!isMac ? "Ctrl Y" : "Shift Meta Z"),
+  },
+  {
+    action: "拡大",
+    combination: HotkeyCombination(""),
+  },
+  {
+    action: "縮小",
+    combination: HotkeyCombination(""),
+  },
+  {
+    action: "拡大率のリセット",
+    combination: HotkeyCombination(""),
+  },
+  {
+    action: "新規プロジェクト",
+    combination: HotkeyCombination(!isMac ? "Ctrl N" : "Meta N"),
+  },
+  {
+    action: "全画面表示を切り替え",
+    combination: HotkeyCombination(!isMac ? "F11" : "Ctrl Meta F"),
+  },
+  {
+    action: "プロジェクトを名前を付けて保存",
+    combination: HotkeyCombination(!isMac ? "Ctrl Shift S" : "Shift Meta S"),
+  },
+  {
+    action: "プロジェクトを上書き保存",
+    combination: HotkeyCombination(!isMac ? "Ctrl S" : "Meta S"),
+  },
+  {
+    action: "プロジェクトを読み込む",
+    combination: HotkeyCombination(!isMac ? "Ctrl O" : "Meta O"),
+  },
+  {
+    action: "テキストを読み込む",
+    combination: HotkeyCombination(""),
+  },
+  {
+    action: "全体のイントネーションをリセット",
+    combination: HotkeyCombination(!isMac ? "Ctrl G" : "Meta G"),
+  },
+  {
+    action: "選択中のアクセント句のイントネーションをリセット",
+    combination: HotkeyCombination("R"),
+  },
+  {
+    action: "コピー",
+    combination: HotkeyCombination(!isMac ? "Ctrl C" : "Meta C"),
+  },
+  {
+    action: "切り取り",
+    combination: HotkeyCombination(!isMac ? "Ctrl X" : "Meta X"),
+  },
+  {
+    action: "貼り付け",
+    combination: HotkeyCombination(!isMac ? "Ctrl V" : "Meta V"),
+  },
+  {
+    action: "すべて選択",
+    combination: HotkeyCombination(!isMac ? "Ctrl A" : "Meta A"),
+  },
+  {
+    action: "選択解除",
+    combination: HotkeyCombination("Escape"),
+  },
+  ...Array.from({ length: 10 }, (_, index) => {
+    const roleKey = index == 9 ? 0 : index + 1;
+    return {
+      action:
+        `${index + 1}${actionPostfixSelectNthCharacter}` as HotkeyActionNameType,
+      combination: HotkeyCombination(`${!isMac ? "Ctrl" : "Meta"} ${roleKey}`),
+    };
+  }),
+];
diff --git a/src/plugins/hotkeyPlugin.ts b/src/plugins/hotkeyPlugin.ts
index c187075ef7..d436cf07d9 100644
--- a/src/plugins/hotkeyPlugin.ts
+++ b/src/plugins/hotkeyPlugin.ts
@@ -13,7 +13,7 @@ import {
   HotkeyActionNameType,
   HotkeyCombination,
   HotkeySettingType,
-} from "@/type/preload";
+} from "@/domain/hotkeyAction";
 import { createLogger } from "@/domain/frontend/log";
 
 const hotkeyManagerKey = "hotkeyManager";
diff --git a/src/store/setting.ts b/src/store/setting.ts
index cb6a03ce7d..6f14d6c9af 100644
--- a/src/store/setting.ts
+++ b/src/store/setting.ts
@@ -7,7 +7,6 @@ import {
   showQuestionDialog,
 } from "@/components/Dialog/Dialog";
 import {
-  HotkeySettingType,
   SavingSetting,
   ExperimentalSettingType,
   ToolbarSettingType,
@@ -16,6 +15,7 @@ import {
   RootMiscSettingType,
 } from "@/type/preload";
 import { IsEqual } from "@/type/utility";
+import { HotkeySettingType } from "@/domain/hotkeyAction";
 
 export const settingStoreState: SettingStoreState = {
   openedEditor: undefined,
diff --git a/src/store/type.ts b/src/store/type.ts
index 44d20d5614..580165ebf1 100644
--- a/src/store/type.ts
+++ b/src/store/type.ts
@@ -26,7 +26,6 @@ import {
   DefaultStyleId,
   AcceptRetrieveTelemetryStatus,
   AcceptTermsStatus,
-  HotkeySettingType,
   MoraDataType,
   SavingSetting,
   ThemeConf,
@@ -72,6 +71,7 @@ import {
   timeSignatureSchema,
   trackSchema,
 } from "@/domain/project/schema";
+import { HotkeySettingType } from "@/domain/hotkeyAction";
 
 /**
  * エディタ用のAudioQuery
diff --git a/src/type/ipc.ts b/src/type/ipc.ts
index 6a3f8bdba3..d4c64162fe 100644
--- a/src/type/ipc.ts
+++ b/src/type/ipc.ts
@@ -5,7 +5,6 @@ import {
   EngineId,
   EngineInfo,
   EngineSettingType,
-  HotkeySettingType,
   MessageBoxReturnValue,
   NativeThemeType,
   TextAsset,
@@ -13,6 +12,7 @@ import {
 } from "@/type/preload";
 import { AltPortInfos } from "@/store/type";
 import { Result } from "@/type/result";
+import { HotkeySettingType } from "@/domain/hotkeyAction";
 
 /**
  * invoke, handle
diff --git a/src/type/preload.ts b/src/type/preload.ts
index 5895e7adaf..7c53a25b0e 100644
--- a/src/type/preload.ts
+++ b/src/type/preload.ts
@@ -2,18 +2,16 @@ import { z } from "zod";
 import { IpcSOData } from "./ipc";
 import { AltPortInfos } from "@/store/type";
 import { Result } from "@/type/result";
-import { isMac } from "@/helpers/platform";
+import {
+  HotkeySettingType,
+  hotkeySettingSchema,
+  defaultHotkeySettings,
+} from "@/domain/hotkeyAction";
 
 const urlStringSchema = z.string().url().brand("URL");
 export type UrlString = z.infer<typeof urlStringSchema>;
 export const UrlString = (url: string): UrlString => urlStringSchema.parse(url);
 
-const hotkeyCombinationSchema = z.string().brand("HotkeyCombination");
-export type HotkeyCombination = z.infer<typeof hotkeyCombinationSchema>;
-export const HotkeyCombination = (
-  hotkeyCombination: string,
-): HotkeyCombination => hotkeyCombinationSchema.parse(hotkeyCombination);
-
 export const engineIdSchema = z.string().brand<"EngineId">();
 export type EngineId = z.infer<typeof engineIdSchema>;
 export const EngineId = (id: string): EngineId => engineIdSchema.parse(id);
@@ -51,145 +49,6 @@ export const trackIdSchema = z.string().brand<"TrackId">();
 export type TrackId = z.infer<typeof trackIdSchema>;
 export const TrackId = (id: string): TrackId => trackIdSchema.parse(id);
 
-// 共通のアクション名
-export const actionPostfixSelectNthCharacter = "番目のキャラクターを選択";
-
-// ホットキーを追加したときは設定のマイグレーションが必要
-export const defaultHotkeySettings: HotkeySettingType[] = [
-  {
-    action: "音声書き出し",
-    combination: HotkeyCombination(!isMac ? "Ctrl E" : "Meta E"),
-  },
-  {
-    action: "選択音声を書き出し",
-    combination: HotkeyCombination("E"),
-  },
-  {
-    action: "音声を繋げて書き出し",
-    combination: HotkeyCombination(""),
-  },
-  {
-    action: "再生/停止",
-    combination: HotkeyCombination("Space"),
-  },
-  {
-    action: "連続再生/停止",
-    combination: HotkeyCombination("Shift Space"),
-  },
-  {
-    action: "ｱｸｾﾝﾄ欄を表示",
-    combination: HotkeyCombination("1"),
-  },
-  {
-    action: "ｲﾝﾄﾈｰｼｮﾝ欄を表示",
-    combination: HotkeyCombination("2"),
-  },
-  {
-    action: "長さ欄を表示",
-    combination: HotkeyCombination("3"),
-  },
-  {
-    action: "テキスト欄を追加",
-    combination: HotkeyCombination("Shift Enter"),
-  },
-  {
-    action: "テキスト欄を複製",
-    combination: HotkeyCombination(!isMac ? "Ctrl D" : "Meta D"),
-  },
-  {
-    action: "テキスト欄を削除",
-    combination: HotkeyCombination("Shift Delete"),
-  },
-  {
-    action: "テキスト欄からフォーカスを外す",
-    combination: HotkeyCombination("Escape"),
-  },
-  {
-    action: "テキスト欄にフォーカスを戻す",
-    combination: HotkeyCombination("Enter"),
-  },
-  {
-    action: "元に戻す",
-    combination: HotkeyCombination(!isMac ? "Ctrl Z" : "Meta Z"),
-  },
-  {
-    action: "やり直す",
-    combination: HotkeyCombination(!isMac ? "Ctrl Y" : "Shift Meta Z"),
-  },
-  {
-    action: "拡大",
-    combination: HotkeyCombination(""),
-  },
-  {
-    action: "縮小",
-    combination: HotkeyCombination(""),
-  },
-  {
-    action: "拡大率のリセット",
-    combination: HotkeyCombination(""),
-  },
-  {
-    action: "新規プロジェクト",
-    combination: HotkeyCombination(!isMac ? "Ctrl N" : "Meta N"),
-  },
-  {
-    action: "全画面表示を切り替え",
-    combination: HotkeyCombination(!isMac ? "F11" : "Ctrl Meta F"),
-  },
-  {
-    action: "プロジェクトを名前を付けて保存",
-    combination: HotkeyCombination(!isMac ? "Ctrl Shift S" : "Shift Meta S"),
-  },
-  {
-    action: "プロジェクトを上書き保存",
-    combination: HotkeyCombination(!isMac ? "Ctrl S" : "Meta S"),
-  },
-  {
-    action: "プロジェクトを読み込む",
-    combination: HotkeyCombination(!isMac ? "Ctrl O" : "Meta O"),
-  },
-  {
-    action: "テキストを読み込む",
-    combination: HotkeyCombination(""),
-  },
-  {
-    action: "全体のイントネーションをリセット",
-    combination: HotkeyCombination(!isMac ? "Ctrl G" : "Meta G"),
-  },
-  {
-    action: "選択中のアクセント句のイントネーションをリセット",
-    combination: HotkeyCombination("R"),
-  },
-  {
-    action: "コピー",
-    combination: HotkeyCombination(!isMac ? "Ctrl C" : "Meta C"),
-  },
-  {
-    action: "切り取り",
-    combination: HotkeyCombination(!isMac ? "Ctrl X" : "Meta X"),
-  },
-  {
-    action: "貼り付け",
-    combination: HotkeyCombination(!isMac ? "Ctrl V" : "Meta V"),
-  },
-  {
-    action: "すべて選択",
-    combination: HotkeyCombination(!isMac ? "Ctrl A" : "Meta A"),
-  },
-  {
-    action: "選択解除",
-    combination: HotkeyCombination("Escape"),
-  },
-  ...Array.from({ length: 10 }, (_, index) => {
-    const roleKey = index == 9 ? 0 : index + 1;
-    return {
-      action:
-        `${index + 1}${actionPostfixSelectNthCharacter}` as HotkeyActionNameType,
-      combination: HotkeyCombination(`${!isMac ? "Ctrl" : "Meta"} ${roleKey}`),
-    };
-  }),
-];
-
 export const defaultToolbarButtonSetting: ToolbarSettingType = [
   "PLAY_CONTINUOUSLY",
   "STOP",
@@ -436,59 +295,6 @@ export type MorphableTargetInfoTable = Record<
     >
 >;
 
-export const hotkeyActionNameSchema = z.enum([
-  "音声書き出し",
-  "選択音声を書き出し",
-  "音声を繋げて書き出し",
-  "再生/停止",
-  "連続再生/停止",
-  "ｱｸｾﾝﾄ欄を表示",
-  "ｲﾝﾄﾈｰｼｮﾝ欄を表示",
-  "長さ欄を表示",
-  "テキスト欄を追加",
-  "テキスト欄を複製",
-  "テキスト欄を削除",
-  "テキスト欄からフォーカスを外す",
-  "テキスト欄にフォーカスを戻す",
-  "元に戻す",
-  "やり直す",
-  "新規プロジェクト",
-  "プロジェクトを名前を付けて保存",
-  "プロジェクトを上書き保存",
-  "プロジェクトを読み込む",
-  "テキストを読み込む",
-  "全体のイントネーションをリセット",
-  "選択中のアクセント句のイントネーションをリセット",
-  "コピー",
-  "切り取り",
-  "貼り付け",
-  "すべて選択",
-  "選択解除",
-  "全セルを選択",
-  `1${actionPostfixSelectNthCharacter}`,
-  `2${actionPostfixSelectNthCharacter}`,
-  `3${actionPostfixSelectNthCharacter}`,
-  `4${actionPostfixSelectNthCharacter}`,
-  `5${actionPostfixSelectNthCharacter}`,
-  `6${actionPostfixSelectNthCharacter}`,
-  `7${actionPostfixSelectNthCharacter}`,
-  `8${actionPostfixSelectNthCharacter}`,
-  `9${actionPostfixSelectNthCharacter}`,
-  `10${actionPostfixSelectNthCharacter}`,
-  "全画面表示を切り替え",
-  "拡大",
-  "縮小",
-  "拡大率のリセット",
-]);
-
-export type HotkeyActionNameType = z.infer<typeof hotkeyActionNameSchema>;
-
-export const hotkeySettingSchema = z.object({
-  action: hotkeyActionNameSchema,
-  combination: hotkeyCombinationSchema,
-});
-export type HotkeySettingType = z.infer<typeof hotkeySettingSchema>;
-
 export type HotkeyReturnType =
   | void
   | boolean
diff --git a/tests/unit/lib/hotkeyManager.spec.ts b/tests/unit/lib/hotkeyManager.spec.ts
index 57c1997d10..2cc1e72020 100644
--- a/tests/unit/lib/hotkeyManager.spec.ts
+++ b/tests/unit/lib/hotkeyManager.spec.ts
@@ -1,6 +1,6 @@
 import { describe, it, expect, beforeEach } from "vitest";
 import { HotkeyManager, HotkeysJs, HotkeyAction } from "@/plugins/hotkeyPlugin";
-import { HotkeyCombination, HotkeySettingType } from "@/type/preload";
+import { HotkeyCombination, HotkeySettingType } from "@/domain/hotkeyAction";
 
 type DummyHotkeysJs = HotkeysJs & {
   registeredHotkeys: {

From 586ac69eb6c5bf3e6a47cd4d34ad8ec3efec7ff8 Mon Sep 17 00:00:00 2001
From: Hiroshiba <hihokaruta@gmail.com>
Date: Sun, 22 Dec 2024 00:06:39 +0900
Subject: [PATCH 2/5] =?UTF-8?q?test:=20engineMock=E3=81=A8=E3=81=9D?=
 =?UTF-8?q?=E3=81=AE=E3=83=86=E3=82=B9=E3=83=88=E3=81=A0=E3=81=91=E5=AE=9F?=
 =?UTF-8?q?=E8=A3=85=E3=81=99=E3=82=8B=20(#2377)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                             |  28 +-
 package.json                                  |   1 +
 src/{sing => helpers}/convertToWavFileData.ts |   7 +-
 src/mock/engineMock/README.md                 |  44 +++
 .../mock/engineMock}/assets/icon_1.png        | Bin
 .../mock/engineMock}/assets/icon_2.png        | Bin
 .../mock/engineMock}/assets/icon_3.png        | Bin
 .../mock/engineMock}/assets/icon_4.png        | Bin
 .../mock/engineMock}/assets/portrait_1.png    | Bin
 .../mock/engineMock}/assets/portrait_2.png    | Bin
 .../mock/engineMock}/assets/portrait_3.png    | Bin
 .../mock/engineMock}/assets/portrait_4.png    | Bin
 src/mock/engineMock/audioQueryMock.ts         | 195 ++++++++++++++
 src/mock/engineMock/characterResourceMock.ts  | 139 ++++++++++
 src/mock/engineMock/index.ts                  | 216 +++++++++++++++
 src/mock/engineMock/manifestMock.ts           |  36 +++
 src/mock/engineMock/phonemeMock.ts            | 168 ++++++++++++
 src/mock/engineMock/singModelMock.ts          | 168 ++++++++++++
 src/mock/engineMock/synthesisMock.ts          | 254 ++++++++++++++++++
 src/mock/engineMock/talkModelMock.ts          | 234 ++++++++++++++++
 src/store/singing.ts                          |   2 +-
 ...3\203\247\343\203\203\343\203\210.spec.ts" |   6 +-
 .../__snapshots__/index.spec.ts.snap          | 176 ++++++++++++
 tests/unit/mock/engineMock/index.spec.ts      |  68 +++++
 tests/unit/utils.ts                           |  11 +-
 25 files changed, 1746 insertions(+), 7 deletions(-)
 rename src/{sing => helpers}/convertToWavFileData.ts (91%)
 create mode 100644 src/mock/engineMock/README.md
 rename {tests/e2e/browser => src/mock/engineMock}/assets/icon_1.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/icon_2.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/icon_3.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/icon_4.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/portrait_1.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/portrait_2.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/portrait_3.png (100%)
 rename {tests/e2e/browser => src/mock/engineMock}/assets/portrait_4.png (100%)
 create mode 100644 src/mock/engineMock/audioQueryMock.ts
 create mode 100644 src/mock/engineMock/characterResourceMock.ts
 create mode 100644 src/mock/engineMock/index.ts
 create mode 100644 src/mock/engineMock/manifestMock.ts
 create mode 100644 src/mock/engineMock/phonemeMock.ts
 create mode 100644 src/mock/engineMock/singModelMock.ts
 create mode 100644 src/mock/engineMock/synthesisMock.ts
 create mode 100644 src/mock/engineMock/talkModelMock.ts
 create mode 100644 tests/unit/mock/engineMock/__snapshots__/index.spec.ts.snap
 create mode 100644 tests/unit/mock/engineMock/index.spec.ts

diff --git a/package-lock.json b/package-lock.json
index 6e17b62596..f3533798b3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,6 +23,7 @@
         "glob": "11.0.0",
         "hotkeys-js": "3.13.6",
         "immer": "9.0.21",
+        "kuromoji": "github:VOICEVOX/kuromoji.js#0.0.1",
         "markdown-it": "13.0.2",
         "move-file": "3.0.0",
         "multistream": "4.1.0",
@@ -6753,6 +6754,12 @@
         "url": "https://dotenvx.com"
       }
     },
+    "node_modules/doublearray": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/doublearray/-/doublearray-0.0.2.tgz",
+      "integrity": "sha512-aw55FtZzT6AmiamEj2kvmR6BuFqvYgKZUkfQ7teqVRNqD5UE0rw8IeW/3gieHNKQ5sPuDKlljWEn4bzv5+1bHw==",
+      "license": "MIT"
+    },
     "node_modules/earcut": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.2.4.tgz",
@@ -8128,7 +8135,6 @@
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
       "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/figures": {
@@ -10154,6 +10160,25 @@
         "node": ">=6"
       }
     },
+    "node_modules/kuromoji": {
+      "version": "0.0.1",
+      "resolved": "git+ssh://git@github.com/VOICEVOX/kuromoji.js.git#0e8d670cd3df64217d0502d3bb71f431531ff353",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "async": "^2.0.1",
+        "doublearray": "0.0.2",
+        "fflate": "^0.8.2"
+      }
+    },
+    "node_modules/kuromoji/node_modules/async": {
+      "version": "2.6.4",
+      "resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz",
+      "integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash": "^4.17.14"
+      }
+    },
     "node_modules/lazy-val": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/lazy-val/-/lazy-val-1.0.5.tgz",
@@ -10311,7 +10336,6 @@
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/lodash.clonedeep": {
diff --git a/package.json b/package.json
index 114b642d4b..c705d416d1 100644
--- a/package.json
+++ b/package.json
@@ -57,6 +57,7 @@
     "glob": "11.0.0",
     "hotkeys-js": "3.13.6",
     "immer": "9.0.21",
+    "kuromoji": "github:VOICEVOX/kuromoji.js#0.0.1",
     "markdown-it": "13.0.2",
     "move-file": "3.0.0",
     "multistream": "4.1.0",
diff --git a/src/sing/convertToWavFileData.ts b/src/helpers/convertToWavFileData.ts
similarity index 91%
rename from src/sing/convertToWavFileData.ts
rename to src/helpers/convertToWavFileData.ts
index 1ddfb637e4..424b2f514e 100644
--- a/src/sing/convertToWavFileData.ts
+++ b/src/helpers/convertToWavFileData.ts
@@ -1,4 +1,9 @@
-export const convertToWavFileData = (audioBuffer: AudioBuffer) => {
+export const convertToWavFileData = (
+  audioBuffer: Pick<
+    AudioBuffer,
+    "sampleRate" | "length" | "numberOfChannels" | "getChannelData"
+  >,
+) => {
   const bytesPerSample = 4; // Float32
   const formatCode = 3; // WAVE_FORMAT_IEEE_FLOAT
 
diff --git a/src/mock/engineMock/README.md b/src/mock/engineMock/README.md
new file mode 100644
index 0000000000..166e4043db
--- /dev/null
+++ b/src/mock/engineMock/README.md
@@ -0,0 +1,44 @@
+# エンジンモックのドキュメント
+
+## 概要
+
+通信を介さずに音声合成できるエンジンのモックです。
+
+同じ入力には同じ出力を返し、別の入力には別の出力を返すようになっています。
+また出力を見たときにUIや処理の実装の異常に気付けるように、ある程度直感に合う出力を返すよう努力されています。
+
+例：音量を下げると音声が小さくなる、音程と周波数が一致する、など。
+
+モックの実装は気軽に破壊的変更をしても問題ありません。
+
+## ビルド戦略
+
+ブラウザ版でも使えるようにすべく、ソフトウェアにも組み込める形で実装されています。
+ビルド時のモックエンジンの取り扱いポリシーはこんな感じです。
+
+- 重い処理が一切実行されないようにする
+  - 辞書の初期化、画像の読み込みなど
+- なるべく重いファイルはビルドに含まれないようにする
+  - 形態素解析の辞書ファイルやダミー画像など
+
+## ファイル構成
+
+- `talkModelMock.ts`
+  - トーク用の音声クエリを作るまでの処理周り
+- `singModelMock.ts`
+  - ソング用の音声クエリを作るまでの処理周り
+- `audioQueryMock.ts`
+  - 音声クエリ周り
+- `synthesisMock.ts`
+  - 音声波形の合成周り
+- `characterResourceMock.ts`
+  - キャラ名や画像などのリソース周り
+- `phonemeMock.ts`
+  - 音素周り
+- `manifestMock.ts`
+  - エンジンのマニフェスト周り
+
+## kuromoji.jsについて
+
+本家kuromoji.jsはパス操作周りでエラーが起こるので、フォーク版を使っています。
+mock用途以外にkuromoji.jsを使う予定はなく、もし動かなくなった際は依存を外すことも検討します。
diff --git a/tests/e2e/browser/assets/icon_1.png b/src/mock/engineMock/assets/icon_1.png
similarity index 100%
rename from tests/e2e/browser/assets/icon_1.png
rename to src/mock/engineMock/assets/icon_1.png
diff --git a/tests/e2e/browser/assets/icon_2.png b/src/mock/engineMock/assets/icon_2.png
similarity index 100%
rename from tests/e2e/browser/assets/icon_2.png
rename to src/mock/engineMock/assets/icon_2.png
diff --git a/tests/e2e/browser/assets/icon_3.png b/src/mock/engineMock/assets/icon_3.png
similarity index 100%
rename from tests/e2e/browser/assets/icon_3.png
rename to src/mock/engineMock/assets/icon_3.png
diff --git a/tests/e2e/browser/assets/icon_4.png b/src/mock/engineMock/assets/icon_4.png
similarity index 100%
rename from tests/e2e/browser/assets/icon_4.png
rename to src/mock/engineMock/assets/icon_4.png
diff --git a/tests/e2e/browser/assets/portrait_1.png b/src/mock/engineMock/assets/portrait_1.png
similarity index 100%
rename from tests/e2e/browser/assets/portrait_1.png
rename to src/mock/engineMock/assets/portrait_1.png
diff --git a/tests/e2e/browser/assets/portrait_2.png b/src/mock/engineMock/assets/portrait_2.png
similarity index 100%
rename from tests/e2e/browser/assets/portrait_2.png
rename to src/mock/engineMock/assets/portrait_2.png
diff --git a/tests/e2e/browser/assets/portrait_3.png b/src/mock/engineMock/assets/portrait_3.png
similarity index 100%
rename from tests/e2e/browser/assets/portrait_3.png
rename to src/mock/engineMock/assets/portrait_3.png
diff --git a/tests/e2e/browser/assets/portrait_4.png b/src/mock/engineMock/assets/portrait_4.png
similarity index 100%
rename from tests/e2e/browser/assets/portrait_4.png
rename to src/mock/engineMock/assets/portrait_4.png
diff --git a/src/mock/engineMock/audioQueryMock.ts b/src/mock/engineMock/audioQueryMock.ts
new file mode 100644
index 0000000000..8a4c4dda33
--- /dev/null
+++ b/src/mock/engineMock/audioQueryMock.ts
@@ -0,0 +1,195 @@
+/**
+ * AudioQueryとFrameAudioQueryのモック。
+ * VOICEVOX ENGINEリポジトリの処理とほぼ同じ。
+ */
+
+import { AccentPhrase, AudioQuery, FrameAudioQuery, Mora } from "@/openapi";
+
+function generateSilenceMora(length: number): Mora {
+  return {
+    text: "　",
+    vowel: "sil",
+    vowelLength: length,
+    pitch: 0.0,
+  };
+}
+
+function toFlattenMoras(accentPhrases: AccentPhrase[]): Mora[] {
+  let moras: Mora[] = [];
+  accentPhrases.forEach((accentPhrase) => {
+    moras = moras.concat(accentPhrase.moras);
+    if (accentPhrase.pauseMora) {
+      moras.push(accentPhrase.pauseMora);
+    }
+  });
+  return moras;
+}
+
+function toFlattenPhonemes(moras: Mora[]): string[] {
+  const phonemes: string[] = [];
+  for (const mora of moras) {
+    if (mora.consonant) {
+      phonemes.push(mora.consonant);
+    }
+    phonemes.push(mora.vowel);
+  }
+  return phonemes;
+}
+
+/** 前後の無音モーラを追加する */
+function applyPrePostSilence(moras: Mora[], query: AudioQuery): Mora[] {
+  const preSilenceMoras = [generateSilenceMora(query.prePhonemeLength)];
+  const postSilenceMoras = [generateSilenceMora(query.postPhonemeLength)];
+  return preSilenceMoras.concat(moras).concat(postSilenceMoras);
+}
+
+/** 無音時間を置き換える */
+function applyPauseLength(moras: Mora[], query: AudioQuery): Mora[] {
+  if (query.pauseLength != undefined) {
+    for (const mora of moras) {
+      if (mora.vowel == "pau") {
+        mora.vowelLength = query.pauseLength;
+      }
+    }
+  }
+  return moras;
+}
+
+/** 無音時間スケールを適用する */
+function applyPauseLengthScale(moras: Mora[], query: AudioQuery): Mora[] {
+  if (query.pauseLengthScale != undefined) {
+    for (const mora of moras) {
+      if (mora.vowel == "pau") {
+        mora.vowelLength *= query.pauseLengthScale;
+      }
+    }
+  }
+  return moras;
+}
+
+/** 話速スケールを適用する */
+function applySpeedScale(moras: Mora[], query: AudioQuery): Mora[] {
+  for (const mora of moras) {
+    mora.vowelLength /= query.speedScale;
+    if (mora.consonantLength) {
+      mora.consonantLength /= query.speedScale;
+    }
+  }
+  return moras;
+}
+
+/** 音高スケールを適用する */
+function applyPitchScale(moras: Mora[], query: AudioQuery): Mora[] {
+  for (const mora of moras) {
+    mora.pitch *= 2 ** query.pitchScale;
+  }
+  return moras;
+}
+
+/** 抑揚スケールを適用する */
+function applyIntonationScale(moras: Mora[], query: AudioQuery): Mora[] {
+  const voiced = moras.filter((mora) => mora.pitch > 0);
+  if (voiced.length == 0) {
+    return moras;
+  }
+
+  const meanF0 =
+    voiced.reduce((sum, mora) => sum + mora.pitch, 0) / voiced.length;
+  for (const mora of voiced) {
+    mora.pitch = (mora.pitch - meanF0) * query.intonationScale + meanF0;
+  }
+  return moras;
+}
+
+/** 疑問文の最後に音高の高いモーラを追加する */
+function applyInterrogativeUpspeak(accentPhrases: Array<AccentPhrase>) {
+  accentPhrases.forEach((accentPhrase) => {
+    const moras = accentPhrase.moras;
+    if (
+      moras.length > 0 &&
+      accentPhrase.isInterrogative &&
+      moras[moras.length - 1].pitch > 0
+    ) {
+      const lastMora = moras[moras.length - 1];
+      const upspeakMora: Mora = {
+        text: "ー",
+        vowel: lastMora.vowel,
+        vowelLength: 0.15,
+        pitch: lastMora.pitch + 0.3,
+      };
+      accentPhrase.moras.push(upspeakMora);
+    }
+  });
+}
+
+function secondToFrame(second: number): number {
+  const FRAME_RATE = 24000 / 256;
+  return Math.round(second * FRAME_RATE);
+}
+
+/** モーラや音素ごとのフレーム数を数える */
+function countFramePerUnit(moras: Mora[]): {
+  framePerPhoneme: number[];
+  framePerMora: number[];
+} {
+  const framePerPhoneme: number[] = [];
+  const framePerMora: number[] = [];
+
+  for (const mora of moras) {
+    const vowelFrames = secondToFrame(mora.vowelLength);
+    const consonantFrames = mora.consonantLength
+      ? secondToFrame(mora.consonantLength)
+      : 0;
+    const moraFrames = vowelFrames + consonantFrames;
+
+    if (mora.consonant) {
+      framePerPhoneme.push(consonantFrames);
+    }
+    framePerPhoneme.push(vowelFrames);
+    framePerMora.push(moraFrames);
+  }
+
+  return { framePerPhoneme, framePerMora };
+}
+
+/** AudioQueryを適当にFrameAudioQueryに変換する */
+export function audioQueryToFrameAudioQueryMock(
+  audioQuery: AudioQuery,
+  { enableInterrogativeUpspeak }: { enableInterrogativeUpspeak: boolean },
+): FrameAudioQuery {
+  const accentPhrases = audioQuery.accentPhrases;
+
+  if (enableInterrogativeUpspeak) {
+    applyInterrogativeUpspeak(accentPhrases);
+  }
+
+  let moras = toFlattenMoras(accentPhrases);
+  moras = applyPrePostSilence(moras, audioQuery);
+  moras = applyPauseLength(moras, audioQuery);
+  moras = applyPauseLengthScale(moras, audioQuery);
+  moras = applySpeedScale(moras, audioQuery);
+  moras = applyPitchScale(moras, audioQuery);
+  moras = applyIntonationScale(moras, audioQuery);
+
+  const { framePerPhoneme, framePerMora } = countFramePerUnit(moras);
+
+  const f0 = moras.flatMap((mora, i) =>
+    Array<number>(framePerMora[i]).fill(
+      mora.pitch == 0 ? 0 : Math.exp(mora.pitch),
+    ),
+  );
+  const volume = Array<number>(f0.length).fill(audioQuery.volumeScale);
+  const phonemes = toFlattenPhonemes(moras).map((phoneme, i) => ({
+    phoneme,
+    frameLength: framePerPhoneme[i],
+  }));
+
+  return {
+    f0,
+    volume,
+    phonemes,
+    volumeScale: audioQuery.volumeScale,
+    outputSamplingRate: audioQuery.outputSamplingRate,
+    outputStereo: audioQuery.outputStereo,
+  };
+}
diff --git a/src/mock/engineMock/characterResourceMock.ts b/src/mock/engineMock/characterResourceMock.ts
new file mode 100644
index 0000000000..400fcd67de
--- /dev/null
+++ b/src/mock/engineMock/characterResourceMock.ts
@@ -0,0 +1,139 @@
+/**
+ * キャラクター情報を作るモック。
+ * なんとなくVOICEVOX ENGINEリポジトリのモック実装と揃えている。
+ */
+
+import { Speaker, SpeakerInfo } from "@/openapi";
+
+/** 立ち絵のURLを得る */
+async function getPortraitUrl(characterIndex: number) {
+  const portraits = Object.values(
+    import.meta.glob<{ default: string }>("./assets/portrait_*.png"),
+  );
+  return (await portraits[characterIndex]()).default;
+}
+
+/** アイコンのURLを得る */
+async function getIconUrl(characterIndex: number) {
+  const icons = Object.values(
+    import.meta.glob<{ default: string }>("./assets/icon_*.png"),
+  );
+  return (await icons[characterIndex]()).default;
+}
+
+const baseCharactersMock = [
+  // トーク２つ・ハミング２つ
+  {
+    name: "dummy1",
+    styles: [
+      { name: "style0", id: 0 },
+      { name: "style1", id: 2 },
+      { name: "style2", id: 4, type: "frame_decode" },
+      { name: "style3", id: 6, type: "frame_decode" },
+    ],
+    speakerUuid: "7ffcb7ce-00ec-4bdc-82cd-45a8889e43ff",
+    version: "mock",
+  },
+  // トーク２つ・ハミング１つ・ソング１つ
+  {
+    name: "dummy2",
+    styles: [
+      { name: "style0", id: 1 },
+      { name: "style1", id: 3 },
+      { name: "style2", id: 5, type: "frame_decode" },
+      { name: "style3", id: 7, type: "sing" },
+    ],
+    speakerUuid: "388f246b-8c41-4ac1-8e2d-5d79f3ff56d9",
+    version: "mock",
+  },
+  // トーク１つ
+  {
+    name: "dummy3",
+    styles: [{ name: "style0", id: 8, type: "talk" }],
+    speakerUuid: "35b2c544-660e-401e-b503-0e14c635303a",
+    version: "mock",
+  },
+  // ソング１つ
+  {
+    name: "dummy4",
+    styles: [{ name: "style0", id: 9, type: "sing" }],
+    speakerUuid: "b1a81618-b27b-40d2-b0ea-27a9ad408c4b",
+    version: "mock",
+  },
+] satisfies Speaker[];
+
+/** 全てのキャラクターを返すモック */
+export function getCharactersMock(): Speaker[] {
+  return baseCharactersMock;
+}
+
+/** 喋れるキャラクターを返すモック */
+export function getSpeakersMock(): Speaker[] {
+  return (
+    baseCharactersMock
+      // スタイルをトークのみに絞り込む
+      .map((character) => ({
+        ...character,
+        styles: character.styles.filter(
+          (style) => style.type == undefined || style.type == "talk",
+        ),
+      }))
+      // １つもスタイルがないキャラクターを除外
+      .filter((character) => character.styles.length > 0)
+  );
+}
+
+/* 歌えるキャラクターを返すモック */
+export function getSingersMock(): Speaker[] {
+  return (
+    baseCharactersMock
+      // スタイルをソングのみに絞り込む
+      .map((character) => ({
+        ...character,
+        styles: character.styles.filter(
+          (style) => style.type == "frame_decode" || style.type == "sing",
+        ),
+      }))
+      // １つもスタイルがないキャラクターを除外
+      .filter((character) => character.styles.length > 0)
+  );
+}
+
+/** キャラクターの追加情報を返すモック。 */
+export async function getCharacterInfoMock(
+  speakerUuid: string,
+): Promise<SpeakerInfo> {
+  // NOTE: 画像のURLを得るために必要
+  const characterIndex = baseCharactersMock.findIndex(
+    (speaker) => speaker.speakerUuid === speakerUuid,
+  );
+  if (characterIndex === -1) {
+    throw new Error(`Character not found: ${speakerUuid}`);
+  }
+
+  const styleIds = baseCharactersMock[characterIndex].styles.map(
+    (style) => style.id,
+  );
+
+  return {
+    policy: `Dummy policy for ${speakerUuid}`,
+    portrait: await getPortraitUrl(characterIndex),
+    styleInfos: await Promise.all(
+      styleIds.map(async (id) => ({
+        id,
+        icon: await getIconUrl(characterIndex),
+        voiceSamples: [],
+      })),
+    ),
+  };
+}
+
+/**
+ * 喋れるキャラクターの追加情報を返すモック。
+ * 本当は喋れるスタイルのみでフィルタリングすべき。
+ */
+export async function getSpeakerInfoMock(
+  speakerUuid: string,
+): Promise<SpeakerInfo> {
+  return getCharacterInfoMock(speakerUuid);
+}
diff --git a/src/mock/engineMock/index.ts b/src/mock/engineMock/index.ts
new file mode 100644
index 0000000000..96d8ac01fa
--- /dev/null
+++ b/src/mock/engineMock/index.ts
@@ -0,0 +1,216 @@
+import { audioQueryToFrameAudioQueryMock } from "./audioQueryMock";
+import { getEngineManifestMock } from "./manifestMock";
+import {
+  getSingersMock,
+  getSpeakerInfoMock,
+  getSpeakersMock,
+} from "./characterResourceMock";
+import { synthesisFrameAudioQueryMock } from "./synthesisMock";
+import {
+  replaceLengthMock,
+  replacePitchMock,
+  textToActtentPhrasesMock,
+} from "./talkModelMock";
+import {
+  notesAndFramePhonemesAndPitchToVolumeMock,
+  notesAndFramePhonemesToPitchMock,
+  notesToFramePhonemesMock,
+} from "./singModelMock";
+
+import { cloneWithUnwrapProxy } from "@/helpers/cloneWithUnwrapProxy";
+import {
+  AccentPhrase,
+  AccentPhrasesAccentPhrasesPostRequest,
+  AudioQuery,
+  AudioQueryAudioQueryPostRequest,
+  DefaultApiInterface,
+  EngineManifest,
+  FrameAudioQuery,
+  FrameSynthesisFrameSynthesisPostRequest,
+  MoraDataMoraDataPostRequest,
+  SingerInfoSingerInfoGetRequest,
+  SingFrameAudioQuerySingFrameAudioQueryPostRequest,
+  SingFrameVolumeSingFrameVolumePostRequest,
+  Speaker,
+  SpeakerInfo,
+  SpeakerInfoSpeakerInfoGetRequest,
+  SupportedDevicesInfo,
+  SynthesisSynthesisPostRequest,
+  UserDictWord,
+} from "@/openapi";
+
+/**
+ * エンジンのOpenAPIの関数群のモック。
+ * 実装されていない関数もある。
+ */
+export function createOpenAPIEngineMock(): DefaultApiInterface {
+  const mockApi: Partial<DefaultApiInterface> = {
+    async versionVersionGet(): Promise<string> {
+      return "mock";
+    },
+
+    // メタ情報
+    async engineManifestEngineManifestGet(): Promise<EngineManifest> {
+      return getEngineManifestMock();
+    },
+
+    async supportedDevicesSupportedDevicesGet(): Promise<SupportedDevicesInfo> {
+      return { cpu: true, cuda: false, dml: false };
+    },
+
+    // キャラクター情報
+    async isInitializedSpeakerIsInitializedSpeakerGet(): Promise<boolean> {
+      return true;
+    },
+
+    async initializeSpeakerInitializeSpeakerPost(): Promise<void> {
+      return;
+    },
+
+    async speakersSpeakersGet(): Promise<Speaker[]> {
+      return getSpeakersMock();
+    },
+
+    async speakerInfoSpeakerInfoGet(
+      payload: SpeakerInfoSpeakerInfoGetRequest,
+    ): Promise<SpeakerInfo> {
+      return getSpeakerInfoMock(payload.speakerUuid);
+    },
+
+    async singersSingersGet(): Promise<Speaker[]> {
+      return getSingersMock();
+    },
+
+    async singerInfoSingerInfoGet(
+      paload: SingerInfoSingerInfoGetRequest,
+    ): Promise<SpeakerInfo> {
+      return getSpeakerInfoMock(paload.speakerUuid);
+    },
+
+    // トーク系
+    async audioQueryAudioQueryPost(
+      payload: AudioQueryAudioQueryPostRequest,
+    ): Promise<AudioQuery> {
+      const accentPhrases = await textToActtentPhrasesMock(
+        payload.text,
+        payload.speaker,
+      );
+
+      return {
+        accentPhrases,
+        speedScale: 1.0,
+        pitchScale: 0,
+        intonationScale: 1.0,
+        volumeScale: 1.0,
+        prePhonemeLength: 0.1,
+        postPhonemeLength: 0.1,
+        outputSamplingRate: getEngineManifestMock().defaultSamplingRate,
+        outputStereo: false,
+      };
+    },
+
+    async accentPhrasesAccentPhrasesPost(
+      payload: AccentPhrasesAccentPhrasesPostRequest,
+    ): Promise<AccentPhrase[]> {
+      if (payload.isKana == true)
+        throw new Error("AquesTalk風記法は未対応です");
+
+      const accentPhrases = await textToActtentPhrasesMock(
+        payload.text,
+        payload.speaker,
+      );
+      return accentPhrases;
+    },
+
+    async moraDataMoraDataPost(
+      payload: MoraDataMoraDataPostRequest,
+    ): Promise<AccentPhrase[]> {
+      const accentPhrase = cloneWithUnwrapProxy(payload.accentPhrase);
+      replaceLengthMock(accentPhrase, payload.speaker);
+      replacePitchMock(accentPhrase, payload.speaker);
+      return accentPhrase;
+    },
+
+    async synthesisSynthesisPost(
+      payload: SynthesisSynthesisPostRequest,
+    ): Promise<Blob> {
+      const frameAudioQuery = audioQueryToFrameAudioQueryMock(
+        payload.audioQuery,
+        {
+          enableInterrogativeUpspeak:
+            payload.enableInterrogativeUpspeak ?? false,
+        },
+      );
+      const buffer = synthesisFrameAudioQueryMock(
+        frameAudioQuery,
+        payload.speaker,
+      );
+      return new Blob([buffer], { type: "audio/wav" });
+    },
+
+    // ソング系
+    async singFrameAudioQuerySingFrameAudioQueryPost(
+      payload: SingFrameAudioQuerySingFrameAudioQueryPostRequest,
+    ): Promise<FrameAudioQuery> {
+      const { score, speaker: styleId } = cloneWithUnwrapProxy(payload);
+
+      const phonemes = notesToFramePhonemesMock(score.notes, styleId);
+      const f0 = notesAndFramePhonemesToPitchMock(
+        score.notes,
+        phonemes,
+        styleId,
+      );
+      const volume = notesAndFramePhonemesAndPitchToVolumeMock(
+        score.notes,
+        phonemes,
+        f0,
+        styleId,
+      );
+
+      return {
+        f0,
+        volume,
+        phonemes,
+        volumeScale: 1.0,
+        outputSamplingRate: getEngineManifestMock().defaultSamplingRate,
+        outputStereo: false,
+      };
+    },
+
+    async singFrameVolumeSingFrameVolumePost(
+      payload: SingFrameVolumeSingFrameVolumePostRequest,
+    ): Promise<Array<number>> {
+      const {
+        speaker: styleId,
+        bodySingFrameVolumeSingFrameVolumePost: { score, frameAudioQuery },
+      } = cloneWithUnwrapProxy(payload);
+
+      const volume = notesAndFramePhonemesAndPitchToVolumeMock(
+        score.notes,
+        frameAudioQuery.phonemes,
+        frameAudioQuery.f0,
+        styleId,
+      );
+      return volume;
+    },
+
+    async frameSynthesisFrameSynthesisPost(
+      payload: FrameSynthesisFrameSynthesisPostRequest,
+    ): Promise<Blob> {
+      const { speaker: styleId, frameAudioQuery } =
+        cloneWithUnwrapProxy(payload);
+      const buffer = synthesisFrameAudioQueryMock(frameAudioQuery, styleId);
+      return new Blob([buffer], { type: "audio/wav" });
+    },
+
+    // 辞書系
+    async getUserDictWordsUserDictGet(): Promise<{
+      [key: string]: UserDictWord;
+    }> {
+      // ダミーで空の辞書を返す
+      return {};
+    },
+  };
+
+  return mockApi satisfies Partial<DefaultApiInterface> as DefaultApiInterface;
+}
diff --git a/src/mock/engineMock/manifestMock.ts b/src/mock/engineMock/manifestMock.ts
new file mode 100644
index 0000000000..4a32cf957b
--- /dev/null
+++ b/src/mock/engineMock/manifestMock.ts
@@ -0,0 +1,36 @@
+/**
+ * エンジンマニフェストのモック。
+ */
+
+import { EngineManifest } from "@/openapi";
+
+/** エンジンマニフェストを返すモック */
+export function getEngineManifestMock() {
+  return {
+    manifestVersion: "0.13.1",
+    name: "DUMMY Engine",
+    brandName: "DUMMY",
+    uuid: "c7b58856-bd56-4aa1-afb7-b8415f824b06",
+    url: "not_found",
+    icon: "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAA1JREFUGFdjWHpl7X8AB24DJsTeKbEAAAAASUVORK5CYII=", // 1pxの画像
+    defaultSamplingRate: 24000,
+    frameRate: 93.75,
+    termsOfService: "not_found",
+    updateInfos: [],
+    dependencyLicenses: [],
+    supportedVvlibManifestVersion: undefined,
+    supportedFeatures: {
+      adjustMoraPitch: true,
+      adjustPhonemeLength: true,
+      adjustSpeedScale: true,
+      adjustPitchScale: true,
+      adjustIntonationScale: true,
+      adjustVolumeScale: true,
+      interrogativeUpspeak: false,
+      synthesisMorphing: false,
+      sing: true,
+      manageLibrary: false,
+      returnResourceUrl: true,
+    },
+  } satisfies EngineManifest;
+}
diff --git a/src/mock/engineMock/phonemeMock.ts b/src/mock/engineMock/phonemeMock.ts
new file mode 100644
index 0000000000..d128b1648e
--- /dev/null
+++ b/src/mock/engineMock/phonemeMock.ts
@@ -0,0 +1,168 @@
+/** カタカナを音素に変換する */
+export const moraToPhonemes: {
+  [key: string]: [string | undefined, string];
+} = {
+  ヴォ: ["v", "o"],
+  ヴェ: ["v", "e"],
+  ヴィ: ["v", "i"],
+  ヴァ: ["v", "a"],
+  ヴ: ["v", "u"],
+  ン: [undefined, "N"],
+  ワ: ["w", "a"],
+  ロ: ["r", "o"],
+  レ: ["r", "e"],
+  ル: ["r", "u"],
+  リョ: ["ry", "o"],
+  リュ: ["ry", "u"],
+  リャ: ["ry", "a"],
+  リェ: ["ry", "e"],
+  リ: ["r", "i"],
+  ラ: ["r", "a"],
+  ヨ: ["y", "o"],
+  ユ: ["y", "u"],
+  ヤ: ["y", "a"],
+  モ: ["m", "o"],
+  メ: ["m", "e"],
+  ム: ["m", "u"],
+  ミョ: ["my", "o"],
+  ミュ: ["my", "u"],
+  ミャ: ["my", "a"],
+  ミェ: ["my", "e"],
+  ミ: ["m", "i"],
+  マ: ["m", "a"],
+  ポ: ["p", "o"],
+  ボ: ["b", "o"],
+  ホ: ["h", "o"],
+  ペ: ["p", "e"],
+  ベ: ["b", "e"],
+  ヘ: ["h", "e"],
+  プ: ["p", "u"],
+  ブ: ["b", "u"],
+  フォ: ["f", "o"],
+  フェ: ["f", "e"],
+  フィ: ["f", "i"],
+  ファ: ["f", "a"],
+  フ: ["f", "u"],
+  ピョ: ["py", "o"],
+  ピュ: ["py", "u"],
+  ピャ: ["py", "a"],
+  ピェ: ["py", "e"],
+  ピ: ["p", "i"],
+  ビョ: ["by", "o"],
+  ビュ: ["by", "u"],
+  ビャ: ["by", "a"],
+  ビェ: ["by", "e"],
+  ビ: ["b", "i"],
+  ヒョ: ["hy", "o"],
+  ヒュ: ["hy", "u"],
+  ヒャ: ["hy", "a"],
+  ヒェ: ["hy", "e"],
+  ヒ: ["h", "i"],
+  パ: ["p", "a"],
+  バ: ["b", "a"],
+  ハ: ["h", "a"],
+  ノ: ["n", "o"],
+  ネ: ["n", "e"],
+  ヌ: ["n", "u"],
+  ニョ: ["ny", "o"],
+  ニュ: ["ny", "u"],
+  ニャ: ["ny", "a"],
+  ニェ: ["ny", "e"],
+  ニ: ["n", "i"],
+  ナ: ["n", "a"],
+  ドゥ: ["d", "u"],
+  ド: ["d", "o"],
+  トゥ: ["t", "u"],
+  ト: ["t", "o"],
+  デョ: ["dy", "o"],
+  デュ: ["dy", "u"],
+  デャ: ["dy", "a"],
+  デェ: ["dy", "e"],
+  ディ: ["d", "i"],
+  デ: ["d", "e"],
+  テョ: ["ty", "o"],
+  テュ: ["ty", "u"],
+  テャ: ["ty", "a"],
+  ティ: ["t", "i"],
+  テ: ["t", "e"],
+  ツォ: ["ts", "o"],
+  ツェ: ["ts", "e"],
+  ツィ: ["ts", "i"],
+  ツァ: ["ts", "a"],
+  ツ: ["ts", "u"],
+  ッ: [undefined, "cl"],
+  チョ: ["ch", "o"],
+  チュ: ["ch", "u"],
+  チャ: ["ch", "a"],
+  チェ: ["ch", "e"],
+  チ: ["ch", "i"],
+  ダ: ["d", "a"],
+  タ: ["t", "a"],
+  ゾ: ["z", "o"],
+  ソ: ["s", "o"],
+  ゼ: ["z", "e"],
+  セ: ["s", "e"],
+  ズィ: ["z", "i"],
+  ズ: ["z", "u"],
+  スィ: ["s", "i"],
+  ス: ["s", "u"],
+  ジョ: ["j", "o"],
+  ジュ: ["j", "u"],
+  ジャ: ["j", "a"],
+  ジェ: ["j", "e"],
+  ジ: ["j", "i"],
+  ショ: ["sh", "o"],
+  シュ: ["sh", "u"],
+  シャ: ["sh", "a"],
+  シェ: ["sh", "e"],
+  シ: ["sh", "i"],
+  ザ: ["z", "a"],
+  サ: ["s", "a"],
+  ゴ: ["g", "o"],
+  コ: ["k", "o"],
+  ゲ: ["g", "e"],
+  ケ: ["k", "e"],
+  グヮ: ["gw", "a"],
+  グ: ["g", "u"],
+  クヮ: ["kw", "a"],
+  ク: ["k", "u"],
+  ギョ: ["gy", "o"],
+  ギュ: ["gy", "u"],
+  ギャ: ["gy", "a"],
+  ギェ: ["gy", "e"],
+  ギ: ["g", "i"],
+  キョ: ["ky", "o"],
+  キュ: ["ky", "u"],
+  キャ: ["ky", "a"],
+  キェ: ["ky", "e"],
+  キ: ["k", "i"],
+  ガ: ["g", "a"],
+  カ: ["k", "a"],
+  オ: [undefined, "o"],
+  エ: [undefined, "e"],
+  ウォ: ["w", "o"],
+  ウェ: ["w", "e"],
+  ウィ: ["w", "i"],
+  ウ: [undefined, "u"],
+  イェ: ["y", "e"],
+  イ: [undefined, "i"],
+  ア: [undefined, "a"],
+  ヴョ: ["by", "o"],
+  ヴュ: ["by", "u"],
+  ヴャ: ["by", "a"],
+  ヲ: [undefined, "o"],
+  ヱ: [undefined, "e"],
+  ヰ: [undefined, "i"],
+  ヮ: ["w", "a"],
+  ョ: ["y", "o"],
+  ュ: ["y", "u"],
+  ヅ: ["z", "u"],
+  ヂ: ["j", "i"],
+  ヶ: ["k", "e"],
+  ャ: ["y", "a"],
+  ォ: [undefined, "o"],
+  ェ: [undefined, "e"],
+  ゥ: [undefined, "u"],
+  ィ: [undefined, "i"],
+  ァ: [undefined, "a"],
+};
diff --git a/src/mock/engineMock/singModelMock.ts b/src/mock/engineMock/singModelMock.ts
new file mode 100644
index 0000000000..7005f8586e
--- /dev/null
+++ b/src/mock/engineMock/singModelMock.ts
@@ -0,0 +1,168 @@
+/**
+ * ソング系の構造体を作るモック。
+ */
+
+import { moraToPhonemes } from "./phonemeMock";
+import { convertHiraToKana } from "@/domain/japanese";
+import { Note, FramePhoneme } from "@/openapi";
+
+function noteNumberToFrequency(noteNumber: number) {
+  return 440 * Math.pow(2, (noteNumber - 69) / 12);
+}
+
+/** アルファベット文字列を適当な0~1の適当な数値に変換する */
+function alphabetsToNumber(text: string): number {
+  const codes = text.split("").map((c) => c.charCodeAt(0));
+  const sum = codes.reduce((a, b) => a + b);
+  return (sum % 256) / 256;
+}
+
+/** 0.01~0.25になるように適当な長さを決める */
+function phonemeToLengthMock(phoneme: string): number {
+  return alphabetsToNumber(phoneme) * 0.24 + 0.01;
+}
+
+/** 揺れ幅が-30cent~30centになるように適当なピッチを決める */
+function phonemeAndKeyToPitchMock(phoneme: string, key: number): number {
+  const base = noteNumberToFrequency(key);
+  const shift = (-30 + 60 * alphabetsToNumber(phoneme)) / 1200;
+  return base * Math.pow(2, shift);
+}
+
+/** 0.8~1.0になるような適当な音量を決める */
+function phonemeAndPitchToVolumeMock(phoneme: string, pitch: number): number {
+  const minPitch = noteNumberToFrequency(1);
+  const maxPitch = noteNumberToFrequency(128);
+  const normalized = (pitch - minPitch) / (maxPitch - minPitch);
+  return 0.75 + normalized * 0.2 + alphabetsToNumber(phoneme) * 0.05;
+}
+
+/**
+ * ノートから音素と適当な音素長を作成する。
+ * 母音の開始位置をノートの開始位置は一致させ、子音は前のノートに食い込むようにする。
+ */
+export function notesToFramePhonemesMock(
+  notes: Note[],
+  styleId: number,
+): FramePhoneme[] {
+  const framePhonemes: FramePhoneme[] = [];
+  for (const note of notes) {
+    const noteId = note.id;
+
+    // 休符の場合はノートの長さ
+    if (note.key == undefined && note.lyric == "") {
+      framePhonemes.push({
+        noteId,
+        phoneme: "pau",
+        frameLength: note.frameLength,
+      });
+      continue;
+    }
+
+    const phonemes = moraToPhonemes[convertHiraToKana(note.lyric)];
+    if (phonemes == undefined)
+      throw new Error(`音素に変換できません: ${note.lyric}`);
+
+    const [consonant, vowel] = phonemes;
+
+    if (consonant != undefined) {
+      // 子音は適当な長さ
+      let consonantLength = phonemeToLengthMock(consonant);
+
+      // 別の歌手で同じにならないように適当に値をずらす
+      consonantLength += styleId * 0.03;
+
+      // 子音の長さが前のノートの長さ以上になる場合、子音の長さをノートの半分にする
+      const beforeFramePhoneme = framePhonemes[framePhonemes.length - 1];
+      if (beforeFramePhoneme.frameLength < consonantLength) {
+        consonantLength = beforeFramePhoneme.frameLength / 2;
+      }
+
+      // 整数値にする
+      consonantLength = Math.max(Math.round(consonantLength), 1);
+
+      // 子音は前のノートに食い込む
+      beforeFramePhoneme.frameLength -= consonantLength;
+      framePhonemes.push({
+        noteId,
+        phoneme: consonant,
+        frameLength: consonantLength,
+      });
+    }
+
+    // 母音はノートの長さ
+    const vowelLength = note.frameLength;
+    framePhonemes.push({ noteId, phoneme: vowel, frameLength: vowelLength });
+  }
+
+  return framePhonemes;
+}
+
+/** ノートと音素長から適当なピッチを作成する */
+export function notesAndFramePhonemesToPitchMock(
+  notes: Note[],
+  framePhonemes: FramePhoneme[],
+  styleId: number,
+): number[] {
+  // 製品版エンジンへの特別対応の都合でstyleId=6000が来ることがあるので特別処理
+  styleId %= 6000;
+
+  return framePhonemes.flatMap((phoneme, i) => {
+    let pitch;
+
+    // 休符の場合は0
+    if (phoneme.phoneme == "pau") {
+      pitch = 0;
+    } else {
+      // IDが同じノートを探す
+      const note = notes
+        .filter((note) => note.id != undefined)
+        .find((note) => note.id == phoneme.noteId);
+      if (note == undefined)
+        throw new Error(
+          `ノートが見つかりません: index=${i} phoneme=${phoneme.phoneme}`,
+        );
+
+      if (note.key != undefined) {
+        pitch = phonemeAndKeyToPitchMock(phoneme.phoneme, note.key);
+
+        // 別の歌手で同じにならないように適当に値をずらす
+        pitch *= 1 + styleId * 0.03;
+      } else {
+        pitch = 0;
+      }
+    }
+
+    return Array<number>(phoneme.frameLength).fill(pitch);
+  });
+}
+
+/**
+ * ノートと音素長とピッチから適当な音量を作成する。
+ * ピッチが高いほど音量が大きくなるようにする。
+ * NOTE: ノートは一旦無視している。
+ */
+export function notesAndFramePhonemesAndPitchToVolumeMock(
+  notes: Note[],
+  framePhonemes: FramePhoneme[],
+  f0: number[],
+  styleId: number,
+): number[] {
+  const phonemePerFrame = framePhonemes.flatMap((phoneme) =>
+    Array<string>(phoneme.frameLength).fill(phoneme.phoneme),
+  );
+
+  return Array<number>(f0.length)
+    .fill(-1)
+    .map((_, i) => {
+      const phoneme = phonemePerFrame[i];
+      const pitch = f0[i];
+
+      let volume = phonemeAndPitchToVolumeMock(phoneme, pitch);
+
+      // 別の歌手で同じにならないように適当に値をずらす
+      volume *= 1 - styleId * 0.03;
+
+      return volume;
+    });
+}
diff --git a/src/mock/engineMock/synthesisMock.ts b/src/mock/engineMock/synthesisMock.ts
new file mode 100644
index 0000000000..9042fc764b
--- /dev/null
+++ b/src/mock/engineMock/synthesisMock.ts
@@ -0,0 +1,254 @@
+/**
+ * 音声合成するモック。
+ * 音高と音量はそれっぽい音を合成する。
+ * 音素は適当に別々の電子音にする。
+ */
+
+import { FrameAudioQuery } from "@/openapi";
+import { convertToWavFileData } from "@/helpers/convertToWavFileData";
+import { applyGaussianFilter } from "@/sing/utility";
+
+/** 0~1を返す疑似乱数生成器 */
+function Random(seed: number = 0) {
+  // 線形合同法
+  const a = 1664525;
+  const c = 1013904223;
+  const m = 2 ** 31;
+
+  return () => {
+    seed = (a * seed + c) % m;
+    return seed / m;
+  };
+}
+
+/** 波形の種類 */
+const waveTypes = ["sine", "square", "noise", "silence"] as const;
+type WaveType = (typeof waveTypes)[number];
+
+/** サイン波などを生成する */
+function generateWave(
+  f0: Array<number>,
+  volume: Array<number>,
+  frameRate: number,
+  sampleRate: number,
+  type: WaveType,
+) {
+  const duration = f0.length / frameRate;
+  const samplesPerOriginal = sampleRate / frameRate;
+  const wave = new Float32Array(sampleRate * duration);
+
+  const seed =
+    Math.round(f0.concat(volume).reduce((acc, v) => acc + v, 0)) % 2 ** 31; // そこそこ被らないシード値
+  const random = Random(seed);
+  let phase = 0;
+  for (let frameIndex = 0; frameIndex < f0.length; frameIndex++) {
+    const freq = f0[frameIndex];
+    const vol = volume[frameIndex];
+    const omega = (2 * Math.PI * freq) / sampleRate;
+
+    for (let i = 0; i < samplesPerOriginal; i++) {
+      const sampleIndex = frameIndex * samplesPerOriginal + i;
+      switch (type) {
+        case "sine":
+          wave[sampleIndex] = Math.sin(phase);
+          break;
+        case "square":
+          wave[sampleIndex] = (phase / Math.PI) % 2 < 1 ? 1 : -1;
+          break;
+        case "noise":
+          wave[sampleIndex] = random() * 2 - 1;
+          break;
+        case "silence":
+          wave[sampleIndex] = 0;
+          break;
+      }
+      wave[sampleIndex] *= vol;
+
+      phase += omega;
+      if (phase > 2 * Math.PI) {
+        phase -= 2 * Math.PI;
+      }
+    }
+  }
+
+  return wave;
+}
+
+/**
+ * 音素ごとの特徴。
+ * FIXME: できるならデバッグしやすいようそれっぽい音に近づけたい。
+ */
+const phonemeFeatures = {
+  有声母音: ["a", "i", "u", "e", "o", "N"],
+  無声母音: ["A", "I", "U", "E", "O"],
+  無音: ["sil", "pau", "cl"],
+  有声子音: [
+    "b",
+    "by",
+    "d",
+    "dy",
+    "g",
+    "gw",
+    "gy",
+    "j",
+    "m",
+    "my",
+    "n",
+    "ny",
+    "r",
+    "ry",
+    "v",
+    "w",
+    "y",
+    "z",
+  ],
+  無声子音: [
+    "ch",
+    "f",
+    "h",
+    "hy",
+    "k",
+    "kw",
+    "ky",
+    "p",
+    "py",
+    "s",
+    "sh",
+    "t",
+    "ts",
+    "ty",
+  ],
+};
+
+/** 音素ごとの波形の配合率を適当に決める */
+function getWaveRate(phoneme: string): { [key in WaveType]: number } {
+  const waveRate: { [key in WaveType]: number } = {
+    sine: 0,
+    square: 0,
+    noise: 0,
+    silence: 0,
+  };
+
+  // 無音ならほぼ無音
+  if (phonemeFeatures.無音.includes(phoneme)) {
+    const index = phonemeFeatures.無音.indexOf(phoneme);
+    waveRate.noise = ((index + 1) % 30) / 30;
+    return waveRate;
+  }
+
+  // 有声母音ならノイズなし
+  if (phonemeFeatures.有声母音.includes(phoneme)) {
+    const rate =
+      phonemeFeatures.有声母音.indexOf(phoneme) /
+      (phonemeFeatures.有声母音.length - 1);
+    waveRate.sine = 1 - rate;
+    waveRate.square = rate;
+    return waveRate;
+  }
+
+  // 無声母音ならノイズ多め
+  if (phonemeFeatures.無声母音.includes(phoneme)) {
+    const rate =
+      phonemeFeatures.無声母音.indexOf(phoneme) /
+      (phonemeFeatures.無声母音.length - 1);
+    waveRate.sine = (1 - rate) * 0.1;
+    waveRate.square = rate * 0.1;
+    waveRate.noise = 0.3;
+    return waveRate;
+  }
+
+  // 有声子音ならノイズ少なめ
+  if (phonemeFeatures.有声子音.includes(phoneme)) {
+    const rate =
+      phonemeFeatures.有声子音.indexOf(phoneme) /
+      (phonemeFeatures.有声子音.length - 1);
+    waveRate.sine = (1 - rate) * 0.7;
+    waveRate.square = rate * 0.7;
+    waveRate.noise = 0.2;
+    return waveRate;
+  }
+
+  // 無声子音ならノイズ多めで音量小さい
+  if (phonemeFeatures.無声子音.includes(phoneme)) {
+    const rate =
+      phonemeFeatures.無声子音.indexOf(phoneme) /
+      (phonemeFeatures.無声子音.length - 1);
+    waveRate.sine = (1 - rate) * 0.1;
+    waveRate.square = rate * 0.1;
+    waveRate.noise = 0.1;
+    return waveRate;
+  }
+
+  throw new Error(`未対応の音素: ${phoneme}`);
+}
+
+/**
+ * FrameAudioQueryから適当に音声合成する。
+ * いろんな波形を作り、音素ごとに波形の配合率を変える。
+ */
+export function synthesisFrameAudioQueryMock(
+  frameAudioQuery: FrameAudioQuery,
+  styleId: number,
+): Uint8Array {
+  const sampleRate = frameAudioQuery.outputSamplingRate;
+  const samplePerFrame = 256;
+  const frameRate = sampleRate / samplePerFrame;
+
+  const _generateWave = (type: WaveType) =>
+    generateWave(
+      frameAudioQuery.f0,
+      frameAudioQuery.volume,
+      frameRate,
+      sampleRate,
+      type,
+    );
+  const waves: { [key in WaveType]: Float32Array } = {
+    sine: _generateWave("sine"),
+    square: _generateWave("square"),
+    noise: _generateWave("noise"),
+    silence: _generateWave("silence"),
+  };
+
+  // フレームごとの音声波形の配分率
+  const waveRatesPerFrame = frameAudioQuery.phonemes.flatMap((phoneme) => {
+    const waveRate = getWaveRate(phoneme.phoneme);
+    return Array<{ [key in WaveType]: number }>(phoneme.frameLength).fill(
+      waveRate,
+    );
+  });
+
+  // サンプルごとの配分率
+  // 耳が痛くならないように10msほどの移動平均を取る
+  const calcWaveRate = (type: WaveType) => {
+    const waveRate = waveRatesPerFrame.flatMap((o) =>
+      Array<number>(samplePerFrame).fill(o[type]),
+    );
+    applyGaussianFilter(waveRate, (sampleRate * 0.01) / 3);
+    return waveRate;
+  };
+  const waveRates = Object.fromEntries(
+    waveTypes.map((type) => [type, calcWaveRate(type)]),
+  ) as { [key in WaveType]: number[] };
+
+  // 波形を合成。
+  // 念の為に-1~1に丸め、音量を1/10にする。
+  // 話者ごとに同じにならないように適当に値をずらす
+  const wave = new Float32Array(frameAudioQuery.f0.length * samplePerFrame);
+  for (let i = 0; i < wave.length; i++) {
+    let sample = waveTypes.reduce((acc, type) => {
+      return acc + waves[type][i] * waveRates[type][i];
+    }, 0);
+    sample += (styleId % 977) / 977 / 20; // 977は適当な素数
+    wave[i] = Math.min(Math.max(sample, -1), 1) / 10;
+  }
+
+  // Blobに変換
+  const numberOfChannels = frameAudioQuery.outputStereo ? 2 : 1;
+  const buffer = convertToWavFileData({
+    sampleRate,
+    length: wave.length,
+    numberOfChannels,
+    getChannelData: () => wave,
+  });
+  return buffer;
+}
diff --git a/src/mock/engineMock/talkModelMock.ts b/src/mock/engineMock/talkModelMock.ts
new file mode 100644
index 0000000000..bcaaac3920
--- /dev/null
+++ b/src/mock/engineMock/talkModelMock.ts
@@ -0,0 +1,234 @@
+/**
+ * トーク系の構造体を作るモック。
+ */
+
+import { builder, IpadicFeatures, Tokenizer } from "kuromoji";
+import { moraToPhonemes } from "./phonemeMock";
+import { moraPattern } from "@/domain/japanese";
+import { AccentPhrase, Mora } from "@/openapi";
+
+/** Nodeとして動いてほしいかを判定する */
+const isNode =
+  // window.documentがなければNode
+  typeof window == "undefined" ||
+  typeof window.document == "undefined" ||
+  // happy-domのときはNode
+  typeof (window as { happyDOM?: unknown }).happyDOM != "undefined";
+
+let _tokenizer: Tokenizer<IpadicFeatures> | undefined;
+
+/** kuromoji用の辞書のパスを取得する */
+function getDicPath() {
+  if (isNode) {
+    return "node_modules/kuromoji/dict";
+  } else {
+    return "https://cdn.jsdelivr.net/npm/kuromoji@0.1.2/dict";
+  }
+}
+
+/** テキストをトークン列に変換するトークナイザーを取得する */
+async function createOrGetTokenizer() {
+  if (_tokenizer != undefined) {
+    return _tokenizer;
+  }
+
+  return new Promise<Tokenizer<IpadicFeatures>>((resolve, reject) => {
+    builder({
+      dicPath: getDicPath(),
+      nodeOrBrowser: isNode ? "node" : "browser",
+    }).build((err: Error, tokenizer: Tokenizer<IpadicFeatures>) => {
+      if (err) {
+        reject(err);
+      } else {
+        _tokenizer = tokenizer;
+        resolve(tokenizer);
+      }
+    });
+  });
+}
+
+/** アルファベット文字列を適当な0~1の適当な数値に変換する */
+function alphabetsToNumber(text: string): number {
+  const codes = text.split("").map((c) => c.charCodeAt(0));
+  const sum = codes.reduce((a, b) => a + b);
+  return (sum % 256) / 256;
+}
+
+/** 0.01~0.25になるように適当な長さを決める */
+function phonemeToLengthMock(phoneme: string): number {
+  return alphabetsToNumber(phoneme) * 0.24 + 0.01;
+}
+
+/** 3~5になるように適当なピッチを決める */
+function phonemeToPitchMock(phoneme: string): number {
+  return (1 - alphabetsToNumber(phoneme)) * 2 + 3;
+}
+
+/** カタカナテキストをモーラに変換する */
+function textToMoraMock(text: string): Mora {
+  const phonemes = moraToPhonemes[text];
+  if (phonemes == undefined) throw new Error(`モーラに変換できません: ${text}`);
+
+  return {
+    text,
+    consonant: phonemes[0],
+    consonantLength: phonemes[0] == undefined ? undefined : 0,
+    vowel: phonemes[1],
+    vowelLength: 0,
+    pitch: 0,
+  };
+}
+
+/**
+ * カタカナテキストを適当なアクセント句に変換する。
+ * アクセント位置は適当に決める。
+ */
+function textToAccentPhraseMock(text: string): AccentPhrase {
+  const moras: Mora[] = [...text.matchAll(moraPattern)].map((m) =>
+    textToMoraMock(m[0]),
+  );
+  const alphabets = moras.map((m) => (m.consonant ?? "") + m.vowel).join("");
+  const accent =
+    1 + Math.round(alphabetsToNumber(alphabets) * (moras.length - 1));
+  return { moras, accent };
+}
+
+/**
+ * アクセント句内のモーラの長さを適当に代入する。
+ * 最後のモーラだけ長くする。
+ */
+export function replaceLengthMock(
+  accentPhrases: AccentPhrase[],
+  styleId: number,
+) {
+  for (const accentPhrase of accentPhrases) {
+    for (let i = 0; i < accentPhrase.moras.length; i++) {
+      const mora = accentPhrase.moras[i];
+
+      // 最後のモーラだけ長く
+      const offset = i == accentPhrase.moras.length - 1 ? 0.05 : 0;
+
+      if (mora.consonant != undefined)
+        mora.consonantLength =
+          (phonemeToLengthMock(mora.consonant) + offset) / 5;
+      mora.vowelLength = phonemeToLengthMock(mora.vowel) + offset;
+    }
+  }
+
+  // 別のアクセント句や話者で同じにならないように適当に値をずらす
+  for (let i = 0; i < accentPhrases.length; i++) {
+    const diff = i * 0.01 + styleId * 0.03;
+    const accentPhrase = accentPhrases[i];
+    for (const mora of accentPhrase.moras) {
+      if (mora.consonantLength != undefined) mora.consonantLength += diff;
+      mora.vowelLength += diff;
+    }
+    if (accentPhrase.pauseMora != undefined) {
+      accentPhrase.pauseMora.vowelLength += diff;
+    }
+  }
+}
+
+/**
+ * アクセント句内のモーラのピッチを適当に代入する。
+ * アクセント位置のモーラだけ高くする。
+ */
+export function replacePitchMock(
+  accentPhrases: AccentPhrase[],
+  styleId: number,
+) {
+  for (const accentPhrase of accentPhrases) {
+    for (let i = 0; i < accentPhrase.moras.length; i++) {
+      const mora = accentPhrase.moras[i];
+
+      // 無声化している場合はピッチを0にする
+      if (mora.vowel == "U") {
+        mora.pitch = 0;
+        continue;
+      }
+
+      // アクセント位置のモーラだけ高く
+      const offset = i == accentPhrase.accent ? 0.3 : 0;
+
+      const phoneme = (mora.consonant ?? "") + mora.vowel[1];
+      mora.pitch = phonemeToPitchMock(phoneme) + offset;
+    }
+  }
+
+  // 別のアクセント句や話者で同じにならないように適当に値をずらす
+  for (let i = 0; i < accentPhrases.length; i++) {
+    const diff = i * 0.01 + styleId * 0.03;
+    const accentPhrase = accentPhrases[i];
+    for (const mora of accentPhrase.moras) {
+      if (mora.pitch > 0) mora.pitch += diff;
+    }
+  }
+}
+
+/**
+ * テキストを適当なアクセント句に分割する。
+ * 助詞ごとに区切る。記号ごとに無音を入れる。
+ * 無音で終わるアクセント句の最後のモーラが「す」「つ」の場合は無声化する。
+ */
+export async function textToActtentPhrasesMock(text: string, styleId: number) {
+  const accentPhrases: AccentPhrase[] = [];
+
+  // トークンに分割
+  const tokenizer = await createOrGetTokenizer();
+  const tokens = tokenizer.tokenize(text);
+
+  let textPhrase = "";
+  for (const token of tokens) {
+    // 記号の場合は無音を入れて区切る
+    if (token.pos == "記号") {
+      if (textPhrase.length == 0) continue;
+
+      const accentPhrase = textToAccentPhraseMock(textPhrase);
+      accentPhrase.pauseMora = {
+        text: "、",
+        vowel: "pau",
+        vowelLength: 1 - 1 / (accentPhrases.length + 1),
+        pitch: 0,
+      };
+      accentPhrases.push(accentPhrase);
+      textPhrase = "";
+      continue;
+    }
+
+    // 記号以外は連結
+    if (token.reading == undefined)
+      throw new Error(`発音がないトークン: ${token.surface_form}`);
+    textPhrase += token.reading;
+
+    // 助詞の場合は区切る
+    if (token.pos == "助詞") {
+      accentPhrases.push(textToAccentPhraseMock(textPhrase));
+      textPhrase = "";
+    }
+  }
+  if (textPhrase != "") {
+    accentPhrases.push(textToAccentPhraseMock(textPhrase));
+  }
+
+  // 最後のアクセント句の無音をなくす
+  if (accentPhrases.length > 0) {
+    const lastPhrase = accentPhrases[accentPhrases.length - 1];
+    lastPhrase.pauseMora = undefined;
+  }
+
+  // 無音のあるアクセント句を無声化
+  for (const phrase of accentPhrases) {
+    if (phrase.pauseMora == undefined) continue;
+    const lastMora = phrase.moras[phrase.moras.length - 1];
+    if (lastMora.text == "ス" || lastMora.text == "ツ") {
+      lastMora.vowel = "U";
+      lastMora.pitch = 0;
+    }
+  }
+
+  // 長さとピッチを代入
+  replaceLengthMock(accentPhrases, styleId);
+  replacePitchMock(accentPhrases, styleId);
+
+  return accentPhrases;
+}
diff --git a/src/store/singing.ts b/src/store/singing.ts
index ef86fbe4a7..7c0809621a 100644
--- a/src/store/singing.ts
+++ b/src/store/singing.ts
@@ -103,7 +103,7 @@ import { getOrThrow } from "@/helpers/mapHelper";
 import { cloneWithUnwrapProxy } from "@/helpers/cloneWithUnwrapProxy";
 import { ufProjectToVoicevox } from "@/sing/utaformatixProject/toVoicevox";
 import { uuid4 } from "@/helpers/random";
-import { convertToWavFileData } from "@/sing/convertToWavFileData";
+import { convertToWavFileData } from "@/helpers/convertToWavFileData";
 import { generateWriteErrorMessage } from "@/helpers/fileHelper";
 import path from "@/helpers/path";
 import { showAlertDialog } from "@/components/Dialog/Dialog";
diff --git "a/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts" "b/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
index d47c880093..8c8df39ee8 100644
--- "a/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
+++ "b/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
@@ -20,6 +20,7 @@ let speakerImages:
 
 /**
  * 差し替え用の立ち絵・アイコンを取得する。
+ * TOOD: エンジンモックを使ってこのコードを削除する。
  */
 async function getSpeakerImages(): Promise<
   {
@@ -28,7 +29,10 @@ async function getSpeakerImages(): Promise<
   }[]
 > {
   if (!speakerImages) {
-    const assetsPath = path.resolve(__dirname, "assets");
+    const assetsPath = path.resolve(
+      __dirname,
+      "../../../src/mock/engineMock/assets",
+    );
     const images = await fs.readdir(assetsPath);
     const icons = images.filter((image) => image.startsWith("icon"));
     icons.sort(
diff --git a/tests/unit/mock/engineMock/__snapshots__/index.spec.ts.snap b/tests/unit/mock/engineMock/__snapshots__/index.spec.ts.snap
new file mode 100644
index 0000000000..2905c56cb3
--- /dev/null
+++ b/tests/unit/mock/engineMock/__snapshots__/index.spec.ts.snap
@@ -0,0 +1,176 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`createOpenAPIEngineMock > audioQueryAudioQueryPost 1`] = `
+{
+  "accentPhrases": [
+    {
+      "accent": 5,
+      "moras": [
+        {
+          "consonant": "k",
+          "consonantLength": 0.0220625,
+          "pitch": 4.7734375,
+          "text": "コ",
+          "vowel": "o",
+          "vowelLength": 0.1140625,
+        },
+        {
+          "consonant": undefined,
+          "consonantLength": undefined,
+          "pitch": 3.609375,
+          "text": "ン",
+          "vowel": "N",
+          "vowelLength": 0.08312499999999999,
+        },
+        {
+          "consonant": "n",
+          "consonantLength": 0.022625,
+          "pitch": 4.75,
+          "text": "ニ",
+          "vowel": "i",
+          "vowelLength": 0.10843749999999999,
+        },
+        {
+          "consonant": "ch",
+          "consonantLength": 0.0400625,
+          "pitch": 4.0234375,
+          "text": "チ",
+          "vowel": "i",
+          "vowelLength": 0.10843749999999999,
+        },
+        {
+          "consonant": "h",
+          "consonantLength": 0.0315,
+          "pitch": 4.796875,
+          "text": "ハ",
+          "vowel": "a",
+          "vowelLength": 0.1509375,
+        },
+      ],
+      "pauseMora": undefined,
+    },
+  ],
+  "intonationScale": 1,
+  "outputSamplingRate": 24000,
+  "outputStereo": false,
+  "pitchScale": 0,
+  "postPhonemeLength": 0.1,
+  "prePhonemeLength": 0.1,
+  "speedScale": 1,
+  "volumeScale": 1,
+}
+`;
+
+exports[`createOpenAPIEngineMock > frameSynthesisFrameSynthesisPost 1`] = `"394cfbc01397e0b6fcc3433d9537aa850e6131f7d89048da6889e7375fe03a24"`;
+
+exports[`createOpenAPIEngineMock > singFrameAudioQuerySingFrameAudioQueryPost 1`] = `
+{
+  "f0": [
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    46.17422889791779,
+    46.08055781881967,
+    46.08055781881967,
+    46.16797823967303,
+    46.18048040243588,
+    46.18048040243588,
+    82.27312267254713,
+    82.21745071316357,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+  ],
+  "outputSamplingRate": 24000,
+  "outputStereo": false,
+  "phonemes": [
+    {
+      "frameLength": 9,
+      "noteId": "a",
+      "phoneme": "pau",
+    },
+    {
+      "frameLength": 1,
+      "noteId": "b",
+      "phoneme": "t",
+    },
+    {
+      "frameLength": 2,
+      "noteId": "b",
+      "phoneme": "e",
+    },
+    {
+      "frameLength": 1,
+      "noteId": "c",
+      "phoneme": "s",
+    },
+    {
+      "frameLength": 2,
+      "noteId": "c",
+      "phoneme": "u",
+    },
+    {
+      "frameLength": 1,
+      "noteId": "d",
+      "phoneme": "t",
+    },
+    {
+      "frameLength": 1,
+      "noteId": "d",
+      "phoneme": "o",
+    },
+    {
+      "frameLength": 10,
+      "noteId": "e",
+      "phoneme": "pau",
+    },
+  ],
+  "volume": [
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7732211475542967,
+    0.7702900494608796,
+    0.7702900494608796,
+    0.7730257409255916,
+    0.7734165541957456,
+    0.7734165541957456,
+    0.7737647610411076,
+    0.7727873601766926,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+    0.7635414345273557,
+  ],
+  "volumeScale": 1,
+}
+`;
+
+exports[`createOpenAPIEngineMock > synthesisSynthesisPost 1`] = `"23f4b910863418a7188648f7c5226a0f02b9d067b964be1690b69b1e9ffde7bc"`;
+
+exports[`createOpenAPIEngineMock > versionVersionGet 1`] = `"mock"`;
diff --git a/tests/unit/mock/engineMock/index.spec.ts b/tests/unit/mock/engineMock/index.spec.ts
new file mode 100644
index 0000000000..5855815692
--- /dev/null
+++ b/tests/unit/mock/engineMock/index.spec.ts
@@ -0,0 +1,68 @@
+import { hash } from "../../utils";
+import { createOpenAPIEngineMock } from "@/mock/engineMock";
+
+describe("createOpenAPIEngineMock", () => {
+  const mock = createOpenAPIEngineMock();
+
+  it("versionVersionGet", async () => {
+    const response = await mock.versionVersionGet();
+    expect(response).toMatchSnapshot();
+  });
+
+  it("audioQueryAudioQueryPost", async () => {
+    const response = await mock.audioQueryAudioQueryPost({
+      text: "こんにちは",
+      speaker: 0,
+    });
+    expect(response).toMatchSnapshot();
+  });
+
+  it("synthesisSynthesisPost", async () => {
+    const audioQuery = await mock.audioQueryAudioQueryPost({
+      text: "こんにちは",
+      speaker: 0,
+    });
+    const response = await mock.synthesisSynthesisPost({
+      audioQuery,
+      speaker: 0,
+    });
+    expect(await hash(await response.arrayBuffer())).toMatchSnapshot();
+  });
+
+  it("singFrameAudioQuerySingFrameAudioQueryPost", async () => {
+    const response = await mock.singFrameAudioQuerySingFrameAudioQueryPost({
+      speaker: 0,
+      score: {
+        notes: [
+          { id: "a", key: undefined, frameLength: 10, lyric: "" },
+          { id: "b", key: 30, frameLength: 3, lyric: "て" },
+          { id: "c", key: 30, frameLength: 3, lyric: "す" },
+          { id: "d", key: 40, frameLength: 1, lyric: "と" },
+          { id: "e", key: undefined, frameLength: 10, lyric: "" },
+        ],
+      },
+    });
+    expect(response).toMatchSnapshot();
+  });
+
+  it("frameSynthesisFrameSynthesisPost", async () => {
+    const frameAudioQuery =
+      await mock.singFrameAudioQuerySingFrameAudioQueryPost({
+        speaker: 0,
+        score: {
+          notes: [
+            { id: "a", key: undefined, frameLength: 10, lyric: "" },
+            { id: "b", key: 30, frameLength: 3, lyric: "て" },
+            { id: "c", key: 30, frameLength: 3, lyric: "す" },
+            { id: "d", key: 40, frameLength: 1, lyric: "と" },
+            { id: "e", key: undefined, frameLength: 10, lyric: "" },
+          ],
+        },
+      });
+    const response = await mock.frameSynthesisFrameSynthesisPost({
+      frameAudioQuery,
+      speaker: 0,
+    });
+    expect(await hash(await response.arrayBuffer())).toMatchSnapshot();
+  });
+});
diff --git a/tests/unit/utils.ts b/tests/unit/utils.ts
index 3bc85e6dd9..2c89db5c50 100644
--- a/tests/unit/utils.ts
+++ b/tests/unit/utils.ts
@@ -3,7 +3,7 @@ import { Component } from "vue";
 
 // QPageContainerとQLayoutで囲うためのヘルパー関数。
 // QPageはQLayout > QPageContainer > QPageの構造にしないとエラーになるため必要。
-export const wrapQPage = (page: Component) => {
+export function wrapQPage(page: Component) {
   return {
     template: `
       <QLayout>
@@ -18,4 +18,11 @@ export const wrapQPage = (page: Component) => {
       QLayout,
     },
   };
-};
+}
+
+/** バイナリからSHA-256ハッシュを計算する */
+export async function hash(data: ArrayBuffer): Promise<string> {
+  const hashBuffer = await crypto.subtle.digest("SHA-256", data);
+  const hashArray = Array.from(new Uint8Array(hashBuffer));
+  return hashArray.map((b) => b.toString(16).padStart(2, "0")).join("");
+}

From b91830e3d4eff0b51a96fb0d4523d41307f9d92b Mon Sep 17 00:00:00 2001
From: Hiroshiba <hihokaruta@gmail.com>
Date: Sun, 22 Dec 2024 00:36:24 +0900
Subject: [PATCH 3/5] =?UTF-8?q?Add:=20ConfigManager=E3=81=AE=E3=83=9E?=
 =?UTF-8?q?=E3=82=A4=E3=82=B0=E3=83=AC=E3=83=BC=E3=82=B7=E3=83=A7=E3=83=B3?=
 =?UTF-8?q?=E6=99=82=E3=81=AB=E3=82=B9=E3=83=8A=E3=83=83=E3=83=97=E3=82=B7?=
 =?UTF-8?q?=E3=83=A7=E3=83=83=E3=83=88=E3=83=86=E3=82=B9=E3=83=88=E3=82=92?=
 =?UTF-8?q?=E8=BF=BD=E5=8A=A0=20(#2357)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/common/ConfigManager.ts           |   6 +
 .../__snapshots__/configManager.spec.ts.snap  | 256 ++++++++++++++++++
 .../unit/backend/common/configManager.spec.ts |   8 +
 3 files changed, 270 insertions(+)
 create mode 100644 tests/unit/backend/common/__snapshots__/configManager.spec.ts.snap

diff --git a/src/backend/common/ConfigManager.ts b/src/backend/common/ConfigManager.ts
index ac23b792dd..7c216464b1 100644
--- a/src/backend/common/ConfigManager.ts
+++ b/src/backend/common/ConfigManager.ts
@@ -343,6 +343,12 @@ export abstract class BaseConfigManager {
     this._save();
   }
 
+  /** 全ての設定を取得する。テスト用。 */
+  public getAll(): ConfigType {
+    if (!this.config) throw new Error("Config is not initialized");
+    return this.config;
+  }
+
   private _save() {
     void this.lock.acquire(lockKey, async () => {
       await this.save({
diff --git a/tests/unit/backend/common/__snapshots__/configManager.spec.ts.snap b/tests/unit/backend/common/__snapshots__/configManager.spec.ts.snap
new file mode 100644
index 0000000000..27c1b4d8f6
--- /dev/null
+++ b/tests/unit/backend/common/__snapshots__/configManager.spec.ts.snap
@@ -0,0 +1,256 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`0.13.0からマイグレーションできる 1`] = `
+{
+  "acceptRetrieveTelemetry": "Accepted",
+  "acceptTerms": "Accepted",
+  "activePointScrollMode": "OFF",
+  "confirmedTips": {
+    "engineStartedOnAltPort": false,
+    "notifyOnGenerate": false,
+    "tweakableSliderByScroll": false,
+  },
+  "currentTheme": "Default",
+  "defaultPresetKeys": {},
+  "defaultStyleIds": [],
+  "editorFont": "default",
+  "enableMemoNotation": false,
+  "enableMultiEngine": false,
+  "enablePreset": false,
+  "enableRubyNotation": false,
+  "engineSettings": {
+    "074fc39e-678b-4c13-8916-ffca8d505d1d": {
+      "outputSamplingRate": "engineDefault",
+      "useGpu": false,
+    },
+  },
+  "experimentalSetting": {
+    "enableInterrogativeUpspeak": false,
+    "enableMorphing": false,
+    "enableMultiSelect": false,
+    "shouldKeepTuningOnTextChange": false,
+  },
+  "hotkeySettings": [
+    {
+      "action": "音声書き出し",
+      "combination": "Ctrl E",
+    },
+    {
+      "action": "選択音声を書き出し",
+      "combination": "E",
+    },
+    {
+      "action": "音声を繋げて書き出し",
+      "combination": "",
+    },
+    {
+      "action": "再生/停止",
+      "combination": "Space",
+    },
+    {
+      "action": "連続再生/停止",
+      "combination": "Shift Space",
+    },
+    {
+      "action": "ｱｸｾﾝﾄ欄を表示",
+      "combination": "1",
+    },
+    {
+      "action": "ｲﾝﾄﾈｰｼｮﾝ欄を表示",
+      "combination": "2",
+    },
+    {
+      "action": "長さ欄を表示",
+      "combination": "3",
+    },
+    {
+      "action": "テキスト欄を追加",
+      "combination": "Shift Enter",
+    },
+    {
+      "action": "テキスト欄を複製",
+      "combination": "Ctrl D",
+    },
+    {
+      "action": "テキスト欄を削除",
+      "combination": "Shift Delete",
+    },
+    {
+      "action": "テキスト欄からフォーカスを外す",
+      "combination": "Escape",
+    },
+    {
+      "action": "テキスト欄にフォーカスを戻す",
+      "combination": "Enter",
+    },
+    {
+      "action": "元に戻す",
+      "combination": "Ctrl Z",
+    },
+    {
+      "action": "やり直す",
+      "combination": "Ctrl Y",
+    },
+    {
+      "action": "拡大",
+      "combination": "",
+    },
+    {
+      "action": "縮小",
+      "combination": "",
+    },
+    {
+      "action": "拡大率のリセット",
+      "combination": "",
+    },
+    {
+      "action": "新規プロジェクト",
+      "combination": "Ctrl N",
+    },
+    {
+      "action": "全画面表示を切り替え",
+      "combination": "F11",
+    },
+    {
+      "action": "プロジェクトを名前を付けて保存",
+      "combination": "Ctrl Shift S",
+    },
+    {
+      "action": "プロジェクトを上書き保存",
+      "combination": "Ctrl S",
+    },
+    {
+      "action": "プロジェクトを読み込む",
+      "combination": "Ctrl O",
+    },
+    {
+      "action": "テキストを読み込む",
+      "combination": "",
+    },
+    {
+      "action": "全体のイントネーションをリセット",
+      "combination": "Ctrl G",
+    },
+    {
+      "action": "選択中のアクセント句のイントネーションをリセット",
+      "combination": "R",
+    },
+    {
+      "action": "コピー",
+      "combination": "Ctrl C",
+    },
+    {
+      "action": "切り取り",
+      "combination": "Ctrl X",
+    },
+    {
+      "action": "貼り付け",
+      "combination": "Ctrl V",
+    },
+    {
+      "action": "すべて選択",
+      "combination": "Ctrl A",
+    },
+    {
+      "action": "選択解除",
+      "combination": "",
+    },
+    {
+      "action": "1番目のキャラクターを選択",
+      "combination": "Ctrl 1",
+    },
+    {
+      "action": "2番目のキャラクターを選択",
+      "combination": "Ctrl 2",
+    },
+    {
+      "action": "3番目のキャラクターを選択",
+      "combination": "Ctrl 3",
+    },
+    {
+      "action": "4番目のキャラクターを選択",
+      "combination": "Ctrl 4",
+    },
+    {
+      "action": "5番目のキャラクターを選択",
+      "combination": "Ctrl 5",
+    },
+    {
+      "action": "6番目のキャラクターを選択",
+      "combination": "Ctrl 6",
+    },
+    {
+      "action": "7番目のキャラクターを選択",
+      "combination": "Ctrl 7",
+    },
+    {
+      "action": "8番目のキャラクターを選択",
+      "combination": "Ctrl 8",
+    },
+    {
+      "action": "9番目のキャラクターを選択",
+      "combination": "Ctrl 9",
+    },
+    {
+      "action": "10番目のキャラクターを選択",
+      "combination": "Ctrl 0",
+    },
+  ],
+  "inheritAudioInfo": true,
+  "openedEditor": "talk",
+  "playheadPositionDisplayFormat": "MINUTES_SECONDS",
+  "presets": {
+    "items": {},
+    "keys": [],
+  },
+  "recentlyUsedProjects": [],
+  "registeredEngineDirs": [],
+  "savingSetting": {
+    "audioOutputDevice": "default",
+    "avoidOverwrite": false,
+    "exportLab": false,
+    "exportText": false,
+    "fileEncoding": "UTF-8",
+    "fileNamePattern": "",
+    "fixedExportDir": "",
+    "fixedExportEnabled": false,
+    "outputStereo": false,
+    "songTrackFileNamePattern": "",
+  },
+  "shouldApplyDefaultPresetOnVoiceChanged": false,
+  "showAddAudioItemButton": true,
+  "showSingCharacterPortrait": true,
+  "showTextLineNumber": false,
+  "splitTextWhenPaste": "PERIOD_AND_NEW_LINE",
+  "splitterPosition": {},
+  "toolbarSetting": [
+    "PLAY_CONTINUOUSLY",
+    "STOP",
+    "EXPORT_AUDIO_SELECTED",
+    "EMPTY",
+    "UNDO",
+    "REDO",
+  ],
+  "undoableTrackOperations": {
+    "panAndGain": true,
+    "soloAndMute": true,
+  },
+  "userCharacterOrder": [
+    "7ffcb7ce-00ec-4bdc-82cd-45a8889e43ff",
+    "388f246b-8c41-4ac1-8e2d-5d79f3ff56d9",
+    "35b2c544-660e-401e-b503-0e14c635303a",
+    "3474ee95-c274-47f9-aa1a-8322163d96f1",
+    "b1a81618-b27b-40d2-b0ea-27a9ad408c4b",
+    "c30dc15a-0992-4f8d-8bb8-ad3b314e6a6f",
+    "e5020595-5c5d-4e87-b849-270a518d0dcf",
+    "4f51116a-d9ee-4516-925d-21f183e2afad",
+    "8eaad775-3119-417e-8cf4-2a10bfd592c8",
+    "481fb609-6446-4870-9f46-90c4dd623403",
+    "9f3ee141-26ad-437e-97bd-d22298d02ad2",
+    "1a17ca16-7ee5-4ea5-b191-2f02ace24d21",
+    "67d5d8da-acd7-4207-bb10-b5542d3a663b",
+    "0f56c2f2-644c-49c9-8989-94e11f7129d0",
+    "044830d2-f23b-44d6-ac0d-b5d733caa900",
+  ],
+}
+`;
diff --git a/tests/unit/backend/common/configManager.spec.ts b/tests/unit/backend/common/configManager.spec.ts
index a24cfc0b5f..d1109ada57 100644
--- a/tests/unit/backend/common/configManager.spec.ts
+++ b/tests/unit/backend/common/configManager.spec.ts
@@ -1,5 +1,6 @@
 import pastConfigs from "./pastConfigs";
 import configBugDefaultPreset1996 from "./pastConfigs/0.19.1-bug_default_preset.json";
+import { isMac } from "@/helpers/platform";
 import { BaseConfigManager } from "@/backend/common/ConfigManager";
 import { configSchema } from "@/type/preload";
 
@@ -85,6 +86,13 @@ for (const [version, data] of pastConfigs) {
     const configManager = new TestConfigManager();
     await configManager.initialize();
     expect(configManager).toBeTruthy();
+
+    // マイグレーション後のデータが正しいことをスナップショットで確認
+    // NOTE: Macはショートカットキーが異なるためパス
+    // TODO: ConfigManagerにOSを引数指定できるようにしてテストを分ける
+    if (!isMac) {
+      expect(configManager.getAll()).toMatchSnapshot();
+    }
   });
 }
 

From 52eb43792a9f4ad10bd75db176b93d8f90685aa9 Mon Sep 17 00:00:00 2001
From: Hiroshiba <hihokaruta@gmail.com>
Date: Sun, 22 Dec 2024 02:36:41 +0900
Subject: [PATCH 4/5] =?UTF-8?q?fix:=20TODO=E3=82=B3=E3=83=A1=E3=83=B3?=
 =?UTF-8?q?=E3=83=88=E3=81=AE=E3=82=B9=E3=83=9A=E3=83=AB=E3=83=9F=E3=82=B9?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3=20(#2424)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ...263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts" | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git "a/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts" "b/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
index 8c8df39ee8..485eb7fb66 100644
--- "a/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
+++ "b/tests/e2e/browser/\343\202\271\343\202\257\343\203\252\343\203\274\343\203\263\343\202\267\343\203\247\343\203\203\343\203\210.spec.ts"
@@ -20,7 +20,7 @@ let speakerImages:
 
 /**
  * 差し替え用の立ち絵・アイコンを取得する。
- * TOOD: エンジンモックを使ってこのコードを削除する。
+ * TODO: エンジンモックを使ってこのコードを削除する。
  */
 async function getSpeakerImages(): Promise<
   {

From f1e3966a5c146a21ea598538954e6b8df91553a2 Mon Sep 17 00:00:00 2001
From: Hiroshiba <hihokaruta@gmail.com>
Date: Sun, 22 Dec 2024 02:38:52 +0900
Subject: [PATCH 5/5] =?UTF-8?q?refactor:=20=E3=83=97=E3=83=AA=E3=82=BB?=
 =?UTF-8?q?=E3=83=83=E3=83=88=E3=83=91=E3=83=A9=E3=83=A1=E3=83=BC=E3=82=BF?=
 =?UTF-8?q?=E3=83=BC=E3=81=AE=E3=83=87=E3=83=95=E3=82=A9=E3=83=AB=E3=83=88?=
 =?UTF-8?q?=E5=80=A4=E3=81=AA=E3=81=A9=E3=82=92=E6=8C=81=E3=81=A4=E3=83=87?=
 =?UTF-8?q?=E3=83=BC=E3=82=BF=E6=A7=8B=E9=80=A0=E3=81=AE=E3=82=AD=E3=83=BC?=
 =?UTF-8?q?=E3=82=92=E3=83=97=E3=83=AA=E3=82=BB=E3=83=83=E3=83=88=E3=81=AE?=
 =?UTF-8?q?=E3=82=AD=E3=83=BC=E3=81=AB=E3=81=82=E3=82=8F=E3=81=9B=E3=82=8B?=
 =?UTF-8?q?=20(#2422)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Talk/AudioInfo.vue | 85 +++++++++++++++----------------
 src/store/utility.ts              | 38 +++++++++-----
 src/type/preload.ts               |  3 ++
 3 files changed, 69 insertions(+), 57 deletions(-)

diff --git a/src/components/Talk/AudioInfo.vue b/src/components/Talk/AudioInfo.vue
index 1d76ffd9b2..7f329ef1e2 100644
--- a/src/components/Talk/AudioInfo.vue
+++ b/src/components/Talk/AudioInfo.vue
@@ -308,6 +308,7 @@ import {
   MorphingInfo,
   Preset,
   PresetKey,
+  PresetSliderKey,
   Voice,
 } from "@/type/preload";
 import {
@@ -348,14 +349,12 @@ const selectedAudioKeys = computed(() =>
     : [props.activeAudioKey],
 );
 
-type ParameterKey = keyof Omit<Preset, "name" | "morphingInfo">; // NOTE: パラメーターの種類はPresetのキーと同じ
-
 /** パラメーターを制御するための元情報リスト */
 type ParameterConfig = {
   label: string;
   sliderProps: Omit<PreviewSliderHelperProps, "onChange">;
   onChange: PreviewSliderHelperProps["onChange"]; // NOTE: onChangeだけ使い回すので分離している
-  key: ParameterKey;
+  key: PresetSliderKey;
 };
 const parameterConfigs = computed<ParameterConfig[]>(() => [
   {
@@ -364,11 +363,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
       modelValue: () => query.value?.speedScale ?? null,
       disable: () =>
         uiLocked.value || !supportedFeatures.value?.adjustSpeedScale,
-      max: SLIDER_PARAMETERS.SPEED.max,
-      min: SLIDER_PARAMETERS.SPEED.min,
-      step: SLIDER_PARAMETERS.SPEED.step,
-      scrollStep: SLIDER_PARAMETERS.SPEED.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.SPEED.scrollMinStep,
+      max: SLIDER_PARAMETERS.speedScale.max,
+      min: SLIDER_PARAMETERS.speedScale.min,
+      step: SLIDER_PARAMETERS.speedScale.step,
+      scrollStep: SLIDER_PARAMETERS.speedScale.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.speedScale.scrollMinStep,
     },
     onChange: (speedScale: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_SPEED_SCALE({
@@ -383,10 +382,10 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
       modelValue: () => query.value?.pitchScale ?? null,
       disable: () =>
         uiLocked.value || !supportedFeatures.value?.adjustPitchScale,
-      max: SLIDER_PARAMETERS.PITCH.max,
-      min: SLIDER_PARAMETERS.PITCH.min,
-      step: SLIDER_PARAMETERS.PITCH.step,
-      scrollStep: SLIDER_PARAMETERS.PITCH.scrollStep,
+      max: SLIDER_PARAMETERS.pitchScale.max,
+      min: SLIDER_PARAMETERS.pitchScale.min,
+      step: SLIDER_PARAMETERS.pitchScale.step,
+      scrollStep: SLIDER_PARAMETERS.pitchScale.scrollStep,
     },
     onChange: (pitchScale: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_PITCH_SCALE({
@@ -401,11 +400,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
       modelValue: () => query.value?.intonationScale ?? null,
       disable: () =>
         uiLocked.value || !supportedFeatures.value?.adjustIntonationScale,
-      max: SLIDER_PARAMETERS.INTONATION.max,
-      min: SLIDER_PARAMETERS.INTONATION.min,
-      step: SLIDER_PARAMETERS.INTONATION.step,
-      scrollStep: SLIDER_PARAMETERS.INTONATION.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.INTONATION.scrollMinStep,
+      max: SLIDER_PARAMETERS.intonationScale.max,
+      min: SLIDER_PARAMETERS.intonationScale.min,
+      step: SLIDER_PARAMETERS.intonationScale.step,
+      scrollStep: SLIDER_PARAMETERS.intonationScale.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.intonationScale.scrollMinStep,
     },
     onChange: (intonationScale: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_INTONATION_SCALE({
@@ -420,11 +419,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
       modelValue: () => query.value?.volumeScale ?? null,
       disable: () =>
         uiLocked.value || !supportedFeatures.value?.adjustVolumeScale,
-      max: SLIDER_PARAMETERS.VOLUME.max,
-      min: SLIDER_PARAMETERS.VOLUME.min,
-      step: SLIDER_PARAMETERS.VOLUME.step,
-      scrollStep: SLIDER_PARAMETERS.VOLUME.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.VOLUME.scrollMinStep,
+      max: SLIDER_PARAMETERS.volumeScale.max,
+      min: SLIDER_PARAMETERS.volumeScale.min,
+      step: SLIDER_PARAMETERS.volumeScale.step,
+      scrollStep: SLIDER_PARAMETERS.volumeScale.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.volumeScale.scrollMinStep,
     },
     onChange: (volumeScale: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_VOLUME_SCALE({
@@ -439,11 +438,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
       modelValue: () => query.value?.pauseLengthScale ?? null,
       disable: () =>
         uiLocked.value || !supportedFeatures.value?.adjustPauseLength,
-      max: SLIDER_PARAMETERS.PAUSE_LENGTH_SCALE.max,
-      min: SLIDER_PARAMETERS.PAUSE_LENGTH_SCALE.min,
-      step: SLIDER_PARAMETERS.PAUSE_LENGTH_SCALE.step,
-      scrollStep: SLIDER_PARAMETERS.PAUSE_LENGTH_SCALE.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.PAUSE_LENGTH_SCALE.scrollMinStep,
+      max: SLIDER_PARAMETERS.pauseLengthScale.max,
+      min: SLIDER_PARAMETERS.pauseLengthScale.min,
+      step: SLIDER_PARAMETERS.pauseLengthScale.step,
+      scrollStep: SLIDER_PARAMETERS.pauseLengthScale.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.pauseLengthScale.scrollMinStep,
     },
     onChange: (pauseLengthScale: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_PAUSE_LENGTH_SCALE({
@@ -457,11 +456,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
     sliderProps: {
       modelValue: () => query.value?.prePhonemeLength ?? null,
       disable: () => uiLocked.value,
-      max: SLIDER_PARAMETERS.PRE_PHONEME_LENGTH.max,
-      min: SLIDER_PARAMETERS.PRE_PHONEME_LENGTH.min,
-      step: SLIDER_PARAMETERS.PRE_PHONEME_LENGTH.step,
-      scrollStep: SLIDER_PARAMETERS.PRE_PHONEME_LENGTH.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.PRE_PHONEME_LENGTH.scrollMinStep,
+      max: SLIDER_PARAMETERS.prePhonemeLength.max,
+      min: SLIDER_PARAMETERS.prePhonemeLength.min,
+      step: SLIDER_PARAMETERS.prePhonemeLength.step,
+      scrollStep: SLIDER_PARAMETERS.prePhonemeLength.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.prePhonemeLength.scrollMinStep,
     },
     onChange: (prePhonemeLength: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_PRE_PHONEME_LENGTH({
@@ -475,11 +474,11 @@ const parameterConfigs = computed<ParameterConfig[]>(() => [
     sliderProps: {
       modelValue: () => query.value?.postPhonemeLength ?? null,
       disable: () => uiLocked.value,
-      max: SLIDER_PARAMETERS.POST_PHONEME_LENGTH.max,
-      min: SLIDER_PARAMETERS.POST_PHONEME_LENGTH.min,
-      step: SLIDER_PARAMETERS.POST_PHONEME_LENGTH.step,
-      scrollStep: SLIDER_PARAMETERS.POST_PHONEME_LENGTH.scrollStep,
-      scrollMinStep: SLIDER_PARAMETERS.POST_PHONEME_LENGTH.scrollMinStep,
+      max: SLIDER_PARAMETERS.postPhonemeLength.max,
+      min: SLIDER_PARAMETERS.postPhonemeLength.min,
+      step: SLIDER_PARAMETERS.postPhonemeLength.step,
+      scrollStep: SLIDER_PARAMETERS.postPhonemeLength.scrollStep,
+      scrollMinStep: SLIDER_PARAMETERS.postPhonemeLength.scrollMinStep,
     },
     onChange: (postPhonemeLength: number) =>
       store.actions.COMMAND_MULTI_SET_AUDIO_POST_PHONEME_LENGTH({
@@ -495,7 +494,7 @@ type Parameter = {
   label: string;
   slider: PreviewSliderHelper;
   onChange: PreviewSliderHelperProps["onChange"];
-  key: ParameterKey;
+  key: PresetSliderKey;
 };
 const parameters = computed<Parameter[]>(() =>
   parameterConfigs.value.map((parameterConfig) => ({
@@ -665,11 +664,11 @@ const morphingRateSlider = previewSliderHelper({
   modelValue: () => audioItem.value.morphingInfo?.rate ?? null,
   disable: () => uiLocked.value,
   onChange: setMorphingRate,
-  max: SLIDER_PARAMETERS.MORPHING_RATE.max,
-  min: SLIDER_PARAMETERS.MORPHING_RATE.min,
-  step: SLIDER_PARAMETERS.MORPHING_RATE.step,
-  scrollStep: SLIDER_PARAMETERS.MORPHING_RATE.scrollStep,
-  scrollMinStep: SLIDER_PARAMETERS.MORPHING_RATE.scrollMinStep,
+  max: SLIDER_PARAMETERS.morphingRate.max,
+  min: SLIDER_PARAMETERS.morphingRate.min,
+  step: SLIDER_PARAMETERS.morphingRate.step,
+  scrollStep: SLIDER_PARAMETERS.morphingRate.scrollStep,
+  scrollMinStep: SLIDER_PARAMETERS.morphingRate.scrollMinStep,
 });
 
 // プリセット
diff --git a/src/store/utility.ts b/src/store/utility.ts
index 5f0ac52677..3334fa44fd 100644
--- a/src/store/utility.ts
+++ b/src/store/utility.ts
@@ -1,6 +1,7 @@
 import * as diff from "fast-array-diff";
 import {
   CharacterInfo,
+  PresetSliderKey,
   StyleInfo,
   StyleType,
   ToolbarButtonTagType,
@@ -40,14 +41,23 @@ export function sanitizeFileName(fileName: string): string {
   return fileName.replace(sanitizer, "");
 }
 
+type SliderParameter = {
+  max: () => number;
+  min: () => number;
+  step: () => number;
+  scrollStep: () => number;
+  scrollMinStep?: () => number;
+};
+
 /**
  * AudioInfoコンポーネントに表示されるパラメータ
+ * TODO: src/domain/talk.ts辺りに切り出す
  */
-export const SLIDER_PARAMETERS = {
+export const SLIDER_PARAMETERS: Record<PresetSliderKey, SliderParameter> = {
   /**
    * 話速パラメータの定義
    */
-  SPEED: {
+  speedScale: {
     max: () => 2,
     min: () => 0.5,
     step: () => 0.01,
@@ -57,7 +67,7 @@ export const SLIDER_PARAMETERS = {
   /**
    * 音高パラメータの定義
    */
-  PITCH: {
+  pitchScale: {
     max: () => 0.15,
     min: () => -0.15,
     step: () => 0.01,
@@ -66,7 +76,7 @@ export const SLIDER_PARAMETERS = {
   /**
    *  抑揚パラメータの定義
    */
-  INTONATION: {
+  intonationScale: {
     max: () => 2,
     min: () => 0,
     step: () => 0.01,
@@ -76,7 +86,7 @@ export const SLIDER_PARAMETERS = {
   /**
    *  音量パラメータの定義
    */
-  VOLUME: {
+  volumeScale: {
     max: () => 2,
     min: () => 0,
     step: () => 0.01,
@@ -84,19 +94,19 @@ export const SLIDER_PARAMETERS = {
     scrollMinStep: () => 0.01,
   },
   /**
-   *  開始無音パラメータの定義
+   *  文内無音(倍率)パラメータの定義
    */
-  PRE_PHONEME_LENGTH: {
-    max: () => 1.5,
+  pauseLengthScale: {
+    max: () => 2,
     min: () => 0,
     step: () => 0.01,
     scrollStep: () => 0.1,
     scrollMinStep: () => 0.01,
   },
   /**
-   *  終了無音パラメータの定義
+   *  開始無音パラメータの定義
    */
-  POST_PHONEME_LENGTH: {
+  prePhonemeLength: {
     max: () => 1.5,
     min: () => 0,
     step: () => 0.01,
@@ -104,10 +114,10 @@ export const SLIDER_PARAMETERS = {
     scrollMinStep: () => 0.01,
   },
   /**
-   *  文内無音(倍率)パラメータの定義
+   *  終了無音パラメータの定義
    */
-  PAUSE_LENGTH_SCALE: {
-    max: () => 2,
+  postPhonemeLength: {
+    max: () => 1.5,
     min: () => 0,
     step: () => 0.01,
     scrollStep: () => 0.1,
@@ -116,7 +126,7 @@ export const SLIDER_PARAMETERS = {
   /**
    *  モーフィングレートパラメータの定義
    */
-  MORPHING_RATE: {
+  morphingRate: {
     max: () => 1,
     min: () => 0,
     step: () => 0.01,
diff --git a/src/type/preload.ts b/src/type/preload.ts
index 7c53a25b0e..24e4afc361 100644
--- a/src/type/preload.ts
+++ b/src/type/preload.ts
@@ -271,6 +271,9 @@ export type Preset = {
   postPhonemeLength: number;
   morphingInfo?: MorphingInfo;
 };
+export type PresetSliderKey =
+  | keyof Omit<Preset, "name" | "morphingInfo">
+  | "morphingRate";
 
 export type MorphingInfo = {
   rate: number;