Merge branch 'next'

src/app/components/audioRecorder/AudioRecorderMain.tsx

@@ -28,7 +28,7 @@ const AudioRecorderMain = () => {
     return (
         <>
             <div className="flex justify-center items-center flex-grow flex-col pt-16 lg:gap-8 md:gap-6 gap-4" id="audioRecorder">
-                <span className="font-light text-6xl">{recorderDisplayTime}</span>
+                <span className="font-light text-6xl" id="audioRecorderTime">{recorderDisplayTime}</span>
                 <div className="flex gap-2 flex-row">
                     {!audioRecording && <button id="recordAudio" className="btn flex-col justify-evenly pl-2 2xl:w-60 2xl:h-72 pr-2 lg:w-52 lg:h-60 md:w-44 md:h-52 w-40 h-48" onClick={() => recordAudio()}>
                         <div className="fill-base-content">

tests/settings.spec.ts

@@ -31,7 +31,7 @@ test("disabling initial audio rendering and enabling compatibility mode should w
     const stopButton = page.locator("#stopPlayingButton");
 
     await expect.poll(() => stopButton.isVisible(), {
-        timeout: 2000,
+        timeout: 10000,
         message: "Stop button was not visible as expected"
     }).toBe(true);
 });

tests/voicerecorder.spec.ts

@@ -1,27 +1,108 @@
-import { expect, test } from "@playwright/test";
+import { Page, expect, test } from "@playwright/test";
 import { openPageAndCloseWelcomeModal, openVoiceRecorder } from "./testsutils";
 
+let page: Page;
+
 test.use({
     launchOptions: {
         args: [
             "--use-fake-ui-for-media-stream",
-            "--use-fake-device-for-media-stream",
-            "--use-file-for-fake-audio-capture=path/to/your/audio.wav"
+            "--use-fake-device-for-media-stream"
         ]
     },
     browserName: "chromium",
 });
 
-test.beforeEach(async ({ page }) => {
+test.beforeEach(async ({ browser }) => {
+    page = await browser.newPage();
+
+    const context = await browser.newContext();
+    await context.grantPermissions(["microphone"]);
+
     await openPageAndCloseWelcomeModal(page);
+
+    context.clearPermissions();
 });
 
-test("opening voice recorder should work", async ({ page }) => {
+test.afterAll(async ({ browser }) => {
+    await browser.newContext();
+});
+
+test("opening voice recorder should work", async () => {
     await openVoiceRecorder(page);
 
     const recordButton = page.locator("#recordAudio");
-
-    await page.waitForTimeout(2000);
+
+    await recordButton.waitFor({ state: "visible", timeout: 5000 });
+
+    expect(recordButton).toBeVisible();
+});
+
+test("stop button should be disabled when no audio has been recorded", async () => {
+    await openVoiceRecorder(page);
+
+    const recordButton = page.locator("#recordAudio");
+
+    await recordButton.waitFor({ state: "visible", timeout: 5000 });
+
+    expect(recordButton).toBeVisible();
+
+    const stopButton = page.locator("#stopRecordAudio");
+
+    await stopButton.waitFor({ state: "visible", timeout: 500 });
+
+    expect(stopButton).toBeDisabled();
+});
+
+test("recording then pausing should work", async () => {
+    await openVoiceRecorder(page);
+
+    const recordButton = page.locator("#recordAudio");
+
+    const recordingTime = page.locator("#audioRecorderTime");
+
+    await recordButton.waitFor({ state: "visible", timeout: 5000 });
 
     expect(recordButton).toBeVisible();
+
+    expect(await recordingTime.innerText()).toBe("00:00");
+
+    await recordButton.click();
+
+    await page.waitForTimeout(5500);
+
+    const pauseRecord = page.locator("#pauseRecordAudio");
+
+    await pauseRecord.waitFor({ state: "visible", timeout: 500 });
+
+    expect(await recordingTime.innerText()).toBe("00:05");
+});
+
+test("recording then stopping should open audio editor", async () => {
+    await openVoiceRecorder(page);
+
+    const recordButton = page.locator("#recordAudio");
+
+    await recordButton.waitFor({ state: "visible", timeout: 5000 });
+
+    expect(recordButton).toBeVisible();
+
+    await recordButton.click();
+
+    await page.waitForTimeout(3000);
+
+    const stopButton = page.locator("#stopRecordAudio");
+
+    await stopButton.waitFor({ state: "visible", timeout: 500 });
+
+    expect(stopButton).not.toBeDisabled();
+
+    await stopButton.click();
+
+    const validateButton = page.locator("div > button", { hasText: "Validate settings" });
+
+    await expect.poll(async () => await validateButton.isVisible(), {
+        timeout: 5000,
+        message: "Audio editor wasn't opened which is not expected"
+    }).toBe(true);
 });