Add tests for playing and pausing
This commit is contained in:
parent
95c763fb48
commit
521aafe8e0
4 changed files with 88 additions and 28 deletions
Binary file not shown.
|
|
@ -49,7 +49,7 @@ export function DocumentListItem({
|
|||
<Link
|
||||
href={`/${doc.type}/${encodeURIComponent(doc.id)}`}
|
||||
draggable={false}
|
||||
className="flex items-center align-center space-x-4 w-full truncate hover:bg-base rounded-lg p-0.5 sm:p-1 transition-colors"
|
||||
className="document-link flex items-center align-center space-x-4 w-full truncate hover:bg-base rounded-lg p-0.5 sm:p-1 transition-colors"
|
||||
>
|
||||
<div className="flex-shrink-0">
|
||||
{doc.type === 'pdf' ? <PDFIcon /> : <EPUBIcon />}
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@ export default function TTSPlayer({ currentPage, numPages }: {
|
|||
onClick={togglePlay}
|
||||
className="relative p-2 rounded-full text-foreground hover:bg-offbase data-[hover]:bg-offbase data-[active]:bg-offbase/80 transition-colors duration-200 focus:outline-none"
|
||||
aria-label={isPlaying ? 'Pause' : 'Play'}
|
||||
disabled={isProcessing}
|
||||
>
|
||||
{isPlaying ? <PauseIcon /> : <PlayIcon />}
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,63 @@
|
|||
import { test, expect, Page } from '@playwright/test';
|
||||
|
||||
const DIR = './public/';
|
||||
|
||||
// Upload a sample epub or pdf
|
||||
async function uploadFile(page: Page, filePath: string) {
|
||||
const fileChooserPromise = page.waitForEvent('filechooser');
|
||||
await page.getByText('Drop your file here, or click to select').click();
|
||||
const fileChooser = await fileChooserPromise;
|
||||
await fileChooser.setFiles(filePath);
|
||||
await page.waitForSelector('input[type=file]', { timeout: 10000 });
|
||||
await page.setInputFiles('input[type=file]', `${DIR}${filePath}`);
|
||||
}
|
||||
|
||||
test.describe('Document Upload and Display', () => {
|
||||
async function uploadAndDisplay(page: Page, fileName: string) {
|
||||
// Upload the file
|
||||
await uploadFile(page, fileName);
|
||||
|
||||
// Wait for link with document-link class
|
||||
await page.waitForSelector('.document-link', { timeout: 20000 });
|
||||
await page.getByText(fileName).click();
|
||||
|
||||
// Wait for the document to load
|
||||
if (fileName.endsWith('.pdf')) {
|
||||
await page.waitForSelector('.react-pdf__Document', { timeout: 10000 });
|
||||
}
|
||||
else if (fileName.endsWith('.epub')) {
|
||||
await page.waitForSelector('.epub-container', { timeout: 10000 });
|
||||
}
|
||||
}
|
||||
|
||||
async function waitAndClickPlay(page: Page) {
|
||||
// Wait for play button selector without disabled attribute
|
||||
await page.waitForSelector('button[aria-label="Play"]:not([disabled])', { timeout: 20000 });
|
||||
// Play the TTS by aria-label play button
|
||||
await page.locator('button[aria-label="Play"]').click();
|
||||
|
||||
// Wait for buttons to be disabled
|
||||
await Promise.all([
|
||||
page.waitForSelector('button[aria-label="Skip forward"][disabled]'),
|
||||
page.waitForSelector('button[aria-label="Skip backward"][disabled]'),
|
||||
]);
|
||||
|
||||
// Wait for the TTS to stop processing
|
||||
await Promise.all([
|
||||
page.waitForSelector('button[aria-label="Skip forward"]:not([disabled])', { timeout: 30000 }),
|
||||
page.waitForSelector('button[aria-label="Skip backward"]:not([disabled])', { timeout: 30000 }),
|
||||
]);
|
||||
|
||||
await page.waitForFunction(() => {
|
||||
return navigator.mediaSession?.playbackState === 'playing';
|
||||
}, { timeout: 30000 })
|
||||
}
|
||||
|
||||
async function playTTSAndWaitForASecond(page: Page, fileName: string) {
|
||||
// Upload and display the document
|
||||
await uploadAndDisplay(page, fileName);
|
||||
// Wait for play button selector without disabled attribute
|
||||
await waitAndClickPlay(page);
|
||||
// play for 1s
|
||||
await page.waitForTimeout(1000);
|
||||
}
|
||||
|
||||
test.describe('Document flow', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
// Navigate to the home page before each test
|
||||
await page.goto('/');
|
||||
|
|
@ -17,46 +66,56 @@ test.describe('Document Upload and Display', () => {
|
|||
await page.getByText('Done').click();
|
||||
});
|
||||
|
||||
test.describe('PDF handling', () => {
|
||||
test('should upload a PDF document', async ({ page }) => {
|
||||
test.describe('PDF check', () => {
|
||||
test('upload a PDF document', async ({ page }) => {
|
||||
// Upload the file
|
||||
await uploadFile(page, './public/sample.pdf');
|
||||
await uploadFile(page, 'sample.pdf');
|
||||
|
||||
// Verify upload success
|
||||
await expect(page.getByText('sample.pdf')).toBeVisible({ timeout: 10000 });
|
||||
});
|
||||
|
||||
test('should display a PDF document', async ({ page }) => {
|
||||
// Upload the file
|
||||
await uploadFile(page, './public/sample.pdf');
|
||||
|
||||
// Click on the uploaded document
|
||||
await page.getByText('sample.pdf').click({ timeout: 10000 });
|
||||
test('display a PDF document', async ({ page }) => {
|
||||
// Upload and display the PDF document
|
||||
await uploadAndDisplay(page, 'sample.pdf');
|
||||
|
||||
// Verify PDF viewer is displayed
|
||||
await expect(page.locator('.react-pdf__Document')).toBeVisible({ timeout: 10000 });
|
||||
await expect(page.locator('.react-pdf__Page')).toBeVisible({ timeout: 10000 });
|
||||
await expect(page.locator('.react-pdf__Document')).toBeVisible();
|
||||
await expect(page.locator('.react-pdf__Page')).toBeVisible();
|
||||
});
|
||||
|
||||
test('play and pause TTS for a PDF document (naive)', async ({ page }) => {
|
||||
// Play TTS for the PDF document
|
||||
await playTTSAndWaitForASecond(page, 'sample.pdf');
|
||||
// Click pause to stop playback
|
||||
await page.locator('button[aria-label="Pause"]').click();
|
||||
// Check for play button to be visible
|
||||
await expect(page.locator('button[aria-label="Play"]')).toBeVisible({ timeout: 10000 });
|
||||
});
|
||||
});
|
||||
|
||||
test.describe('EPUB handling', () => {
|
||||
test('should upload and display EPUB document', async ({ page }) => {
|
||||
test.describe('EPUB check', () => {
|
||||
test('upload a EPUB document', async ({ page }) => {
|
||||
// Upload the file
|
||||
await uploadFile(page, './public/sample.epub');
|
||||
|
||||
await uploadFile(page, 'sample.epub');
|
||||
// Verify upload success
|
||||
await expect(page.getByText('sample.epub')).toBeVisible({ timeout: 10000 });
|
||||
});
|
||||
|
||||
test('should display an EPUB document', async ({ page }) => {
|
||||
// Upload the file
|
||||
await uploadFile(page, './public/sample.epub');
|
||||
|
||||
// Click on the uploaded document
|
||||
await page.getByText('sample.epub').click({ timeout: 10000 });
|
||||
|
||||
test('display an EPUB document', async ({ page }) => {
|
||||
// Upload and display the EPUB document
|
||||
await uploadAndDisplay(page, 'sample.epub');
|
||||
// Verify EPUB viewer is displayed
|
||||
await expect(page.locator('.epub-container')).toBeVisible({ timeout: 10000 });
|
||||
});
|
||||
|
||||
test('play and pause TTS for an EPUB document (naive)', async ({ page }) => {
|
||||
// Play TTS for the EPUB document
|
||||
await playTTSAndWaitForASecond(page, 'sample.epub');
|
||||
// Click pause to stop playback
|
||||
await page.locator('button[aria-label="Pause"]').click();
|
||||
// Check for play button to be visible
|
||||
await expect(page.locator('button[aria-label="Play"]')).toBeVisible({ timeout: 10000 });
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue