70 lines
2.3 KiB
TypeScript
70 lines
2.3 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('desktop controls', () => {
|
|
|
|
test.beforeEach(async ({ page }) => {
|
|
console.log(`Running ${test.info().title}`);
|
|
await page.goto('/controls.html');
|
|
});
|
|
|
|
test('should toggle play/pause when clicking the player', async ({ page }) => {
|
|
// Selectors
|
|
const fullPlayer = page.locator('#fluid_video_wrapper_fluid-player-e2e-case');
|
|
const playButton = page.locator('.fluid_button_play');
|
|
const pauseButton = page.locator('.fluid_button_pause');
|
|
|
|
// Initial state checks
|
|
await expect(playButton).toBeVisible();
|
|
await expect(pauseButton).not.toBeVisible();
|
|
|
|
// Video player should start playing
|
|
fullPlayer.click();
|
|
|
|
// Wait for video to start playing
|
|
await page.waitForFunction(() => {
|
|
const video = document.querySelector('video');
|
|
return video && !video.paused;
|
|
});
|
|
|
|
// Verify playing state
|
|
await expect(playButton).not.toBeVisible();
|
|
await expect(pauseButton).toBeVisible();
|
|
|
|
// Wait for 500ms so the browser doesn't reject the click
|
|
await page.waitForTimeout(1000);
|
|
// Video player should pause
|
|
fullPlayer.click();
|
|
|
|
// Wait for video to pause
|
|
await page.waitForFunction(() => {
|
|
const video = document.querySelector('video');
|
|
return video && video.paused;
|
|
});
|
|
|
|
// Verify paused state
|
|
await expect(playButton).toBeVisible();
|
|
await expect(pauseButton).not.toBeVisible();
|
|
});
|
|
|
|
test('mouse should disappear when hovering the video', async ({ page }) => {
|
|
const video = page.locator('video');
|
|
const playButton = page.locator('.fluid_button_play');
|
|
|
|
await playButton.click();
|
|
|
|
// Hover over the video
|
|
await video.hover();
|
|
|
|
await page.waitForTimeout(1500);
|
|
|
|
// Evaluate the cursor CSS property of the video element or its parent
|
|
const isCursorHidden = await video.evaluate((vid) => {
|
|
const computedStyle = window.getComputedStyle(vid);
|
|
return computedStyle.cursor === 'none';
|
|
});
|
|
|
|
expect(isCursorHidden).toBeTruthy(); // Assert that the cursor is hidden
|
|
});
|
|
});
|
|
|