ソング関連のe2eテストを追加

tests/e2e/browser/song/song.test.ts

@@ -0,0 +1,70 @@
+import { test, expect, Page } from "@playwright/test";
+
+import { gotoHome, navigateToMain } from "../../navigators";
+
+test.beforeEach(gotoHome);
+
+async function navigateToSong(page: Page) {
+ await navigateToMain(page);
+ await expect(page.getByText("ソング")).toBeVisible();
+ await page.getByText("ソング").click();
+}
+
+test("再生ボタンを押して再生できる", async ({ page }) => {
+ await navigateToSong(page);
+ // TODO: ページ内のオーディオを検出するテストを追加する
+
+ const getCurrentPlayhead = async () =>
+ await page.locator(".sequencer-playhead").boundingBox();
+
+ // 再生ボタンを押して再生
+ await page.locator(".sequencer-body").click({ position: { x: 107, y: 171 } }); // ノートを追加
+ const beforePosition = await getCurrentPlayhead(); // 再生ヘッドの初期位置
+ await page.getByText("play_arrow").click(); // 再生ボタンを押す
+ await page.waitForTimeout(3000);
+ await page.getByText("stop").click(); // 停止ボタンを押す
+ const afterPosition = await getCurrentPlayhead(); // 再生ヘッドの再生後の位置
+ await expect(afterPosition?.x).not.toEqual(beforePosition?.x);
+ await expect(afterPosition?.y).toEqual(beforePosition?.y);
+});
+
+test("ノートを追加・削除できる", async ({ page }) => {
+ await navigateToSong(page);
+
+ const getCurrentNoteCount = async () => await page.locator(".note").count();
+
+ // ノートの追加
+ await expect(await getCurrentNoteCount()).toBe(0);
+ await page.locator(".sequencer-body").click({ position: { x: 107, y: 171 } });
+ await expect(await getCurrentNoteCount()).toBe(1);
+ await page.locator(".sequencer-body").click({ position: { x: 200, y: 171 } });
+ await expect(await getCurrentNoteCount()).toBe(2);
+
+ // ノートの削除
+ await expect(await getCurrentNoteCount()).toBe(2);
+ await page.locator(".sequencer-body").click({ position: { x: 107, y: 171 } });
+ await page.keyboard.press("Delete");
+ await expect(await getCurrentNoteCount()).toBe(1);
+ await page.locator(".sequencer-body").click({ position: { x: 200, y: 171 } });
+ await page.keyboard.press("Delete");
+ await expect(await getCurrentNoteCount()).toBe(0);
+});
+
+test("ダブルクリックでノートを編集できる", async ({ page }) => {
+ await navigateToSong(page);
+
+ const getCurrentNoteLyric = async () =>
+ await page.locator(".note-lyric").textContent();
+
+ await page.locator(".sequencer-body").click({ position: { x: 107, y: 171 } });
+ const beforeLyric = await getCurrentNoteLyric();
+
+ await page
+ .locator(".sequencer-body")
+ .click({ position: { x: 107, y: 171 }, clickCount: 2 }); // ダブルクリック
+
+ await page.locator(".note-lyric-input").fill("あ");
+ await page.keyboard.press("Enter");
+ const afterLyric = await getCurrentNoteLyric();
+ await expect(afterLyric).not.toEqual(beforeLyric);
+});