[WIP] エンジンのモック作成＋それを使ったコンポーネントテスト

package.json

@@ -93,6 +93,7 @@
     "@types/async-lock": "1.4.0",
     "@types/encoding-japanese": "1.0.18",
     "@types/glob": "8.0.0",
+    "@types/kuromoji": "0.1.3",
     "@types/markdown-it": "12.2.0",
     "@types/multistream": "4.1.0",
     "@types/semver": "7.3.9",
@@ -122,6 +123,7 @@
     "eslint-plugin-storybook": "0.8.0",
     "eslint-plugin-vue": "9.26.0",
     "happy-dom": "8.4.2",
+    "kuromoji": "0.1.2",
     "license-checker-rseidelsohn": "4.3.0",
     "markdownlint-cli": "0.37.0",
     "playwright": "1.48.0",

playwright.config.ts

@@ -1,5 +1,4 @@
 import type { PlaywrightTestConfig, Project } from "@playwright/test";
-import { z } from "zod";
 
 import dotenv from "dotenv";
 dotenv.config({ override: true });
@@ -10,26 +9,6 @@ const isElectron = process.env.VITE_TARGET === "electron";
 const isBrowser = process.env.VITE_TARGET === "browser";
 const isStorybook = process.env.TARGET === "storybook";
 
-// エンジンの起動が必要
-const defaultEngineInfosEnv = process.env.VITE_DEFAULT_ENGINE_INFOS ?? "[]";
-const envSchema = z // FIXME: electron起動時のものと共通化したい
-  .object({
-    host: z.string(),
-    executionFilePath: z.string(),
-    executionArgs: z.array(z.string()),
-    executionEnabled: z.boolean(),
-  })
-  .passthrough()
-  .array();
-const engineInfos = envSchema.parse(JSON.parse(defaultEngineInfosEnv));
-
-const engineServers = engineInfos
-  .filter((info) => info.executionEnabled)
-  .map((info) => ({
-    command: `${info.executionFilePath} ${info.executionArgs.join(" ")}`,
-    url: `${info.host}/version`,
-    reuseExistingServer: !process.env.CI,
-  }));
 const viteServer = {
   command: "vite --mode test --port 7357",
   port: 7357,
@@ -46,7 +25,7 @@ if (isElectron) {
   webServers = [viteServer];
 } else if (isBrowser) {
   project = { name: "browser", testDir: "./tests/e2e/browser" };
-  webServers = [viteServer, ...engineServers];
+  webServers = [viteServer];
 } else if (isStorybook) {
   project = { name: "storybook", testDir: "./tests/e2e/storybook" };
   webServers = [storybookServer];

src/backend/electron/manager/RuntimeInfoManager.ts

@@ -8,6 +8,7 @@ import AsyncLock from "async-lock";
 import log from "electron-log/main";
 import type { AltPortInfos } from "@/store/type";
 import { EngineId, EngineInfo } from "@/type/preload";
+import { convertToUrlString } from "@/domain/url";
 
 /**
  * ランタイム情報書き出しに必要なEngineInfo
@@ -85,13 +86,14 @@ export class RuntimeInfoManager {
           const altPort: string | undefined =
             this.altportInfos[engineInfo.uuid];
           const port = altPort ?? engineInfo.defaultPort;
-          // NOTE: URLを正規化する
-          const url = new URL(`${engineInfo.protocol}//${engineInfo.hostname}`);
-          url.port = port;
           return {
             uuid: engineInfo.uuid,
-            // NOTE: URLインターフェースは"pathname"が空文字でも"/"を付けるので手動で結合する。
-            url: `${url.origin}${engineInfo.pathname}`,
+            url: convertToUrlString({
+              protocol: engineInfo.protocol,
+              hostname: engineInfo.hostname,
+              port,
+              pathname: engineInfo.pathname,
+            }),
             name: engineInfo.name,
           };
         }),

src/domain/japanese/index.ts

@@ -40,3 +40,18 @@ export const convertLongVowel = (text: string): string => {
     .replace(/(?<=[ん]ー*)ー/g, "ん")
     .replace(/(?<=[っ]ー*)ー/g, "っ");
 };
+
+// 参考：https://github.com/VOICEVOX/voicevox_core/blob/0848630d81ae3e917c6ff2038f0b15bbd4270702/crates/voicevox_core/src/user_dict/word.rs#L83-L90
+export const moraPattern = new RegExp(
+  "(?:" +
+    "[イ][ェ]|[ヴ][ャュョ]|[トド][ゥ]|[テデ][ィャュョ]|[デ][ェ]|[クグ][ヮ]|" + // rule_others
+    "[キシチニヒミリギジビピ][ェャュョ]|" + // rule_line_i
+    "[ツフヴ][ァ]|[ウスツフヴズ][ィ]|[ウツフヴ][ェォ]|" + // rule_line_u
+    "[ァ-ヴー]|" + // rule_one_mora
+    "[い][ぇ]|[ゃゅょ]|[とど][ぅ]|[てで][ぃゃゅょ]|[で][ぇ]|[くぐ][ゎ]|" + // rule_others
+    "[きしちにひみりぎじびぴ][ぇゃゅょ]|" + // rule_line_i
+    "[つふゔ][ぁ]|[うすつふゔず][ぃ]|[うつふゔ][ぇぉ]|" + // rule_line_u
+    "[ぁ-ゔー]" + // rule_one_mora
+    ")",
+  "g",
+);

src/domain/url.ts

@@ -0,0 +1,18 @@
+/** エンジンのURLを構成するパラメータ */
+export type EngineUrlParams = {
+  protocol: string; // `http:`など
+  hostname: string; // `example.com`など
+  port: string; // `50021`など。空文字列もありえる。
+  pathname: string; // `/engine`など。空文字列もありえる。
+};
+
+/**
+ * URLを構成するパラメータから、VOICEVOXエディタが初期から想定しているURL文字列を組み立てる。
+ * pathnameが空文字の場合は末尾にスラッシュを付与しない、などがビルトインのURLクラスと異なる。
+ */
+export function convertToUrlString(params: EngineUrlParams) {
+  const { protocol, hostname, port, pathname } = params;
+  const url = new URL(`${protocol}//${hostname}`); // NOTE: URLを正規化する
+  url.port = port;
+  return `${url.origin}${pathname}`; // NOTE: URLインターフェースは"pathname"が空文字でも"/"を付けるので手動で結合する。
+}

src/sing/convertToWavFileData.ts → src/helpers/convertToWavFileData.ts

@@ -1,4 +1,13 @@
-export const convertToWavFileData = (audioBuffer: AudioBuffer) => {
+export const convertToWavFileData = (
+  audioBuffer:
+    | AudioBuffer
+    | {
+        sampleRate: number;
+        length: number;
+        numberOfChannels: number;
+        getChannelData(channel: number): Float32Array;
+      },
+) => {
   const bytesPerSample = 4; // Float32
   const formatCode = 3; // WAVE_FORMAT_IEEE_FLOAT
 

src/infrastructures/EngineConnector.ts

@@ -1,3 +1,5 @@
+import { convertToUrlString, EngineUrlParams } from "@/domain/url";
+import { createOpenAPIEngineMock } from "@/mock/engineMock";
 import { Configuration, DefaultApi, DefaultApiInterface } from "@/openapi";
 
 export interface IEngineConnectorFactory {
@@ -22,5 +24,35 @@ const OpenAPIEngineConnectorFactoryImpl = (): IEngineConnectorFactory => {
   };
 };
 
+/** WEB APIを持つエンジン用 */
 export const OpenAPIEngineConnectorFactory =
   OpenAPIEngineConnectorFactoryImpl();
+
+const OpenAPIMockEngineConnectorFactoryImpl = (): IEngineConnectorFactory => ({
+  instance: () => createOpenAPIEngineMock(),
+});
+
+/** WEB APIを持つエンジンを模したモック用 */
+export const OpenAPIMockEngineConnectorFactory =
+  OpenAPIMockEngineConnectorFactoryImpl();
+
+/** モック用エンジンのURLは `http://mock` とする */
+export const mockUrlParams = {
+  protocol: "http:",
+  hostname: "mock",
+  port: "",
+  pathname: "",
+} satisfies EngineUrlParams;
+
+/**
+ * WEB API エンジンとモックを使い分ける用。
+ * モック用エンジンのURLのときはモックを返す。
+ */
+export const OpenAPIEngineAndMockConnectorFactory: IEngineConnectorFactory = {
+  instance: (host: string) => {
+    if (host === convertToUrlString(mockUrlParams)) {
+      return OpenAPIMockEngineConnectorFactory.instance(host);
+    }
+    return OpenAPIEngineConnectorFactory.instance(host);
+  },
+};