mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-08 17:06:15 -08:00
fix(ui): restore channel and detail keyboard scrolling (#1542)
* fix(ui): restore channel and detail keyboard scrolling * test(ui): drag below the Windows scrollbar arrow
This commit is contained in:
1 parent
0ba5107561
commit
eb602db5fc
44 files changed
+950
-49
No files matched your search
@@ -329,3 +329,88 @@ test.describe('Electron Xtream Responsiveness', () => {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
test('keeps Live TV scrolling, row actions and resizing independently accessible', async ({
|
||||
dataDir,
|
||||
request,
|
||||
}) => {
|
||||
await resetMockServers(request, ['xtream']);
|
||||
const app = await launchElectronApp(dataDir);
|
||||
try {
|
||||
const page = app.mainWindow;
|
||||
await addXtreamPortal(page);
|
||||
await waitForXtreamCatalog(page);
|
||||
await page.getByRole('link', { name: 'Live TV', exact: true }).click();
|
||||
const categories = page.locator('.context-panel .category-item');
|
||||
const category = categories.first();
|
||||
await category.click();
|
||||
const viewport = page.locator('.scroll-viewport-portals');
|
||||
await expect(viewport).toBeVisible();
|
||||
await category.focus();
|
||||
await page.keyboard.press('ArrowRight');
|
||||
await expect(viewport).toBeFocused();
|
||||
await expect(page.locator('app-web-player-view')).toHaveCount(0);
|
||||
await page.keyboard.press('Tab');
|
||||
await expect(
|
||||
viewport.locator('button.channel-content').first()
|
||||
).toBeFocused();
|
||||
await page.keyboard.press('Shift+Tab');
|
||||
await expect(viewport).toBeFocused();
|
||||
await viewport.locator('.channel-name').first().click();
|
||||
await expect(viewport).toBeFocused();
|
||||
await page.keyboard.press('PageDown');
|
||||
await expect
|
||||
.poll(() => viewport.evaluate((el) => el.scrollTop))
|
||||
.toBeGreaterThan(100);
|
||||
const position = await viewport.evaluate((el) => el.scrollTop);
|
||||
await page.keyboard.press('PageDown');
|
||||
await expect
|
||||
.poll(() => viewport.evaluate((el) => el.scrollTop))
|
||||
.toBeGreaterThan(position);
|
||||
await page.keyboard.press('Home');
|
||||
await expect
|
||||
.poll(() => viewport.evaluate((el) => el.scrollTop))
|
||||
.toBe(0);
|
||||
const before = (await viewport.boundingBox())!;
|
||||
const handle = page.locator(
|
||||
'app-live-stream-layout .sidebar > .resize-handle'
|
||||
);
|
||||
const resize = (await handle.boundingBox())!;
|
||||
expect(before.x + before.width).toBeLessThanOrEqual(resize.x);
|
||||
expect(
|
||||
await handle.evaluate((el) =>
|
||||
getComputedStyle(el).getPropertyValue('app-region')
|
||||
)
|
||||
).toBe('no-drag');
|
||||
// Start inside the thumb, below the native Windows up-arrow button.
|
||||
// The 40-channel mock leaves a thumb taller than 100 px here.
|
||||
await page.mouse.move(before.x + before.width - 3, before.y + 40);
|
||||
await page.mouse.down();
|
||||
await page.mouse.move(before.x + before.width - 3, before.y + 160, {
|
||||
steps: 10,
|
||||
});
|
||||
await page.mouse.up();
|
||||
await expect
|
||||
.poll(() => viewport.evaluate((el) => el.scrollTop))
|
||||
.toBeGreaterThan(100);
|
||||
expect((await viewport.boundingBox())!.width).toBe(before.width);
|
||||
await page.mouse.move(resize.x + 2, resize.y + 100);
|
||||
await page.mouse.down();
|
||||
await page.mouse.move(resize.x + 62, resize.y + 100, { steps: 10 });
|
||||
await page.mouse.up();
|
||||
await expect
|
||||
.poll(async () => (await viewport.boundingBox())!.width)
|
||||
.toBeGreaterThan(before.width + 30);
|
||||
await viewport.focus();
|
||||
await page.keyboard.press('ArrowLeft');
|
||||
await expect(category).toBeFocused();
|
||||
await categories.nth(1).focus();
|
||||
await page.keyboard.press('Enter');
|
||||
await expect(categories.nth(1)).toBeFocused();
|
||||
await expect(categories.nth(1)).toHaveAttribute('aria-current', 'true');
|
||||
await page.keyboard.press('ArrowRight');
|
||||
await expect(viewport).toBeFocused();
|
||||
} finally {
|
||||
await closeElectronApp(app);
|
||||
}
|
||||
});
|
||||
@@ -133,3 +133,67 @@ test.describe('Xtream VOD Details', () => {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
for (const theme of ['light', 'dark']) {
|
||||
test(`supports keyboard and mouse scrolling in portal details (${theme})`, async ({
|
||||
dataDir,
|
||||
request,
|
||||
}) => {
|
||||
await resetMockServers(request, ['xtream']);
|
||||
const app = await launchElectronApp(dataDir);
|
||||
try {
|
||||
const page = app.mainWindow;
|
||||
await page.setViewportSize({ width: 1200, height: 540 });
|
||||
await addXtreamPortal(page);
|
||||
await waitForXtreamWorkspaceReady(page);
|
||||
for (const section of ['Movies', 'Series']) {
|
||||
await page
|
||||
.getByRole('link', { name: section, exact: true })
|
||||
.click();
|
||||
await page.locator('app-grid-list mat-card').first().click();
|
||||
const shell = page.locator('app-portal-detail-shell');
|
||||
await expect(shell).toBeFocused();
|
||||
await page.evaluate(
|
||||
(dark) =>
|
||||
document.body.classList.toggle('dark-theme', dark),
|
||||
theme === 'dark'
|
||||
);
|
||||
await expect
|
||||
.poll(() =>
|
||||
shell.evaluate(
|
||||
(el) => el.scrollHeight - el.clientHeight
|
||||
)
|
||||
)
|
||||
.toBeGreaterThan(0);
|
||||
expect(
|
||||
await shell.evaluate(
|
||||
(el) => getComputedStyle(el).scrollbarWidth
|
||||
)
|
||||
).not.toBe('none');
|
||||
await page.keyboard.press('PageDown');
|
||||
await expect
|
||||
.poll(() => shell.evaluate((el) => el.scrollTop))
|
||||
.toBeGreaterThan(0);
|
||||
await page.keyboard.press('Home');
|
||||
await expect
|
||||
.poll(() => shell.evaluate((el) => el.scrollTop))
|
||||
.toBe(0);
|
||||
const box = (await shell.boundingBox())!;
|
||||
await page.mouse.move(
|
||||
box.x + box.width / 2,
|
||||
box.y + box.height / 2
|
||||
);
|
||||
await page.mouse.wheel(0, 300);
|
||||
await expect
|
||||
.poll(() => shell.evaluate((el) => el.scrollTop))
|
||||
.toBeGreaterThan(0);
|
||||
await page.keyboard.press('Tab');
|
||||
await expect(shell.locator('.hero__back-button')).toBeFocused();
|
||||
await page.keyboard.press('Enter');
|
||||
await expect(shell).toHaveCount(0);
|
||||
}
|
||||
} finally {
|
||||
await closeElectronApp(app);
|
||||
}
|
||||
});
|
||||
}
|
||||
Reference in new issue
Block a user