You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
2.9 KiB
58 lines
2.9 KiB
3 weeks ago
|
import { expect, test } from '@playwright/test';
|
||
|
|
|
||
|
|
test.describe('Controles del Jukebox sin cambios en la base de datos', () => {
|
||
|
|
test.skip(process.env.E2E_JUKEBOX !== '1', 'La galería solo existe en desarrollo.');
|
||
|
|
test('Play inicia, pausa y recupera la programación con acciones coherentes', async ({
|
||
|
|
page
|
||
|
|
}) => {
|
||
|
|
await page.goto('/__diseno/reproductor');
|
||
|
|
await page.locator('html[data-hidratado]').waitFor();
|
||
|
|
const barra = page.getByRole('region', { name: 'Reproductor', exact: true });
|
||
|
|
const posicion = barra.getByRole('slider', { name: 'Posición de reproducción' });
|
||
|
|
await page.getByRole('button', { name: 'Play JukeBox', exact: true }).click();
|
||
|
|
await expect.poll(() => posicion.inputValue().then(Number)).toBeGreaterThan(0);
|
||
|
|
const titulo = await barra.getByRole('group', { name: 'Sonando ahora' }).innerText();
|
||
|
|
await page.getByRole('button', { name: 'Pausar Jukebox', exact: true }).click();
|
||
|
|
await expect(barra).toContainText('En pausa');
|
||
|
|
await expect(page.getByRole('button', { name: 'Detener Jukebox', exact: true })).toHaveCount(0);
|
||
|
|
await page.getByRole('button', { name: 'Continuar Jukebox', exact: true }).click();
|
||
|
|
await page.getByRole('button', { name: 'Elegir canción manual', exact: true }).click();
|
||
|
|
await expect(barra).toContainText('Vuelve al terminar');
|
||
|
|
await expect(page.getByRole('button', { name: 'Detener Jukebox', exact: true })).toHaveCount(0);
|
||
|
|
await expect(barra.getByRole('button', { name: 'Cancelar reanudación' })).toBeVisible();
|
||
|
|
await page.getByRole('button', { name: 'Continuar Jukebox', exact: true }).click();
|
||
|
|
await expect(barra.getByRole('group', { name: 'Sonando ahora' })).toHaveText(titulo);
|
||
|
|
await page.getByRole('button', { name: 'Limpiar prueba', exact: true }).click();
|
||
|
|
});
|
||
|
|
|
||
|
|
test('mantiene el transporte centrado con y sin Jukebox, también en escucha manual', async ({
|
||
|
|
page
|
||
|
|
}) => {
|
||
|
|
await page.goto('/__diseno/reproductor');
|
||
|
|
await page.locator('html[data-hidratado]').waitFor();
|
||
|
|
for (const estado of [
|
||
|
|
'Reproducción normal',
|
||
|
|
'Iniciar programación de prueba',
|
||
|
|
'Elegir canción manual'
|
||
|
|
]) {
|
||
|
|
await page.getByRole('button', { name: estado, exact: true }).click();
|
||
|
|
for (const width of [3801, 1920, 1440, 1280, 1024, 838, 768, 390]) {
|
||
|
|
await page.setViewportSize({ width, height: 1000 });
|
||
|
|
const geometria = await page
|
||
|
|
.getByRole('region', { name: 'Reproductor' })
|
||
|
|
.evaluate((barra) => {
|
||
|
|
const r = barra.getBoundingClientRect();
|
||
|
|
const b = barra.querySelector('.principal')!.getBoundingClientRect();
|
||
|
|
return {
|
||
|
|
desvio: Math.abs(b.x + b.width / 2 - r.x - r.width / 2),
|
||
|
|
desborde: document.documentElement.scrollWidth - document.documentElement.clientWidth
|
||
|
|
};
|
||
|
|
});
|
||
|
|
expect(geometria.desvio, `${estado} a ${width}px`).toBeLessThanOrEqual(1);
|
||
|
|
expect(geometria.desborde).toBe(0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
await page.getByRole('button', { name: 'Limpiar prueba', exact: true }).click();
|
||
|
|
});
|
||
|
|
});
|