mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-10 01:56:16 -08:00
* feat(settings): split settings into per-section pages with an unsaved-changes bar Replace the single scrolling settings page with routed section pages (/workspace/settings/:section): the context-panel rail links each section, only the active section renders, and unknown or capability-gated sections redirect to General. The shared form lives on the parent component, so staged edits survive section switches; a floating unsaved-changes bar (Save/Discard) replaces the always-visible footer Save button. Rail links navigate with replaceUrl so Back still leaves settings in one step. Along the way: - delete the unreachable settings dialog mode and the dead AppPortalNavigationActionsService with both of its never-injected DI tokens (PORTAL_NAVIGATION_ACTIONS, PLAYLIST_PLAYER_ACTIONS) - delete the scroll-spy directive and pendingScrollTarget plumbing - revive the EPG panel's "Open EPG settings" empty-state button as a deep link to /workspace/settings/epg; the M3U player now reports m3u-needs-setup only when the channel has no programmes and no EPG source exists in settings or on the playlist itself - load TMDB cache stats when the Metadata page opens (the section component now only exists while its page is open) - add SETTINGS.UNSAVED_CHANGES / SETTINGS.DISCARD_CHANGES to all 19 locales Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * feat(settings): confirm before leaving with unsaved changes Add settingsUnsavedChangesGuard (canDeactivate on the :section route) with a three-action dialog: save and leave, leave without saving, keep editing. The guard only intercepts leaving the settings AREA — section switches share the one settings form and pass unconditionally, so the dialog can never nag while moving between pages. A failed save cancels the navigation instead of silently dropping the edits it promised to keep; leaving without saving also reverts the live theme preview. Save-and-leave is disabled while the form is invalid, with a hint explaining why. New SETTINGS.UNSAVED_DIALOG_* keys in all 19 locales. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(settings): stage cover size and EPG view mode; adapt e2e to section pages Cover size and EPG view mode were the only two controls that persisted eagerly on click, which made Discard (and leave-without-saving) unable to revert them: hydrateFromStore() faithfully reloaded the just-persisted edit. They now stage in the form like every other setting and reach the store on Save. Review finding by Greptile (P1) and Codex. E2E suites that walk through settings are updated for one-section-page rendering (epg, backup-roundtrip, xtream-epg, remote-control) and for the staged cover size (downloads asserts the dataset after Save); the EPG icon fallback test saves before leaving settings so the new unsaved-changes dialog does not block its navigation. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
276 lines
8.5 KiB
TypeScript
276 lines
8.5 KiB
TypeScript
import { APIRequestContext, Page } from '@playwright/test';
|
|
import { AddressInfo, createServer as createNetServer } from 'net';
|
|
|
|
import {
|
|
channelItemByTitle,
|
|
closeElectronApp,
|
|
enableRemoteControl,
|
|
expect,
|
|
goToDashboard,
|
|
importM3uPlaylistFromNativeDialog,
|
|
launchElectronApp,
|
|
openSettings,
|
|
openSettingsSection,
|
|
saveSettings,
|
|
test,
|
|
waitForM3uCatalog,
|
|
writeTemporaryM3uFile,
|
|
} from './electron-test-fixtures';
|
|
|
|
type RemoteControlStatus = {
|
|
channelName?: string;
|
|
isLiveView: boolean;
|
|
muted?: boolean;
|
|
portal: 'm3u' | 'xtream' | 'stalker' | 'unknown';
|
|
supportsVolume?: boolean;
|
|
volume?: number;
|
|
};
|
|
|
|
test.describe('Electron Remote Control', () => {
|
|
test('@remote-control @m3u @electron applies remote volume commands to the selected built-in video player', async ({
|
|
dataDir,
|
|
request,
|
|
}) => {
|
|
const remotePort = await reserveFreePort();
|
|
const channelName = 'Remote ArtPlayer Channel';
|
|
const playlistFile = writeTemporaryM3uFile(
|
|
dataDir,
|
|
'remote-control-video.m3u',
|
|
[
|
|
{
|
|
groupTitle: 'Remote',
|
|
name: channelName,
|
|
url: 'https://example.channels/remote-art-player.m3u8',
|
|
},
|
|
]
|
|
);
|
|
const app = await launchElectronApp(dataDir);
|
|
|
|
try {
|
|
await openSettings(app.mainWindow);
|
|
await openSettingsSection(app.mainWindow, 'playback');
|
|
await selectSettingsOption(
|
|
app.mainWindow,
|
|
'select-video-player',
|
|
'artplayer'
|
|
);
|
|
await enableRemoteControl(app.mainWindow, remotePort);
|
|
await saveSettings(app.mainWindow);
|
|
await waitForRemoteControlServer(request, remotePort);
|
|
|
|
await goToDashboard(app.mainWindow);
|
|
await importM3uPlaylistFromNativeDialog(app, playlistFile);
|
|
await waitForM3uCatalog(app.mainWindow);
|
|
await channelItemByTitle(app.mainWindow, channelName)
|
|
.first()
|
|
.click();
|
|
|
|
const playerVideo = app.mainWindow
|
|
.locator('app-art-player video')
|
|
.first();
|
|
await expect(playerVideo).toHaveCount(1, { timeout: 20000 });
|
|
await waitForRemoteStatus(request, remotePort, (status) => {
|
|
return (
|
|
status.portal === 'm3u' &&
|
|
status.channelName === channelName &&
|
|
status.supportsVolume === true &&
|
|
roundVolume(status.volume) === 1
|
|
);
|
|
});
|
|
|
|
await postRemoteCommand(request, remotePort, '/volume/down');
|
|
|
|
await waitForRemoteStatus(request, remotePort, (status) => {
|
|
return (
|
|
status.portal === 'm3u' &&
|
|
status.channelName === channelName &&
|
|
status.supportsVolume === true &&
|
|
roundVolume(status.volume) === 0.9 &&
|
|
status.muted === false
|
|
);
|
|
});
|
|
await expect
|
|
.poll(() =>
|
|
readMediaVolume(app.mainWindow, 'app-art-player video')
|
|
)
|
|
.toBe(0.9);
|
|
} finally {
|
|
await closeElectronApp(app);
|
|
}
|
|
});
|
|
|
|
test('@remote-control @m3u @electron applies remote volume commands to radio audio playback', async ({
|
|
dataDir,
|
|
request,
|
|
}) => {
|
|
const remotePort = await reserveFreePort();
|
|
const channelName = 'Remote Radio Channel';
|
|
const playlistFile = writeTemporaryM3uFile(
|
|
dataDir,
|
|
'remote-control-radio.m3u',
|
|
[
|
|
{
|
|
groupTitle: 'Radio',
|
|
name: channelName,
|
|
radio: true,
|
|
url: 'https://example.channels/remote-radio-stream.mp3',
|
|
},
|
|
]
|
|
);
|
|
const app = await launchElectronApp(dataDir);
|
|
|
|
try {
|
|
await openSettings(app.mainWindow);
|
|
await enableRemoteControl(app.mainWindow, remotePort);
|
|
await saveSettings(app.mainWindow);
|
|
await waitForRemoteControlServer(request, remotePort);
|
|
|
|
await goToDashboard(app.mainWindow);
|
|
await importM3uPlaylistFromNativeDialog(app, playlistFile);
|
|
await waitForM3uCatalog(app.mainWindow);
|
|
await channelItemByTitle(app.mainWindow, channelName)
|
|
.first()
|
|
.click();
|
|
|
|
const audio = app.mainWindow
|
|
.locator('app-audio-player audio')
|
|
.first();
|
|
await expect(audio).toHaveCount(1, { timeout: 20000 });
|
|
await waitForRemoteStatus(request, remotePort, (status) => {
|
|
return (
|
|
status.portal === 'm3u' &&
|
|
status.channelName === channelName &&
|
|
status.supportsVolume === true &&
|
|
roundVolume(status.volume) === 1
|
|
);
|
|
});
|
|
|
|
await postRemoteCommand(request, remotePort, '/volume/down');
|
|
|
|
await waitForRemoteStatus(request, remotePort, (status) => {
|
|
return (
|
|
status.portal === 'm3u' &&
|
|
status.channelName === channelName &&
|
|
status.supportsVolume === true &&
|
|
roundVolume(status.volume) === 0.9 &&
|
|
status.muted === false
|
|
);
|
|
});
|
|
await expect
|
|
.poll(() =>
|
|
readMediaVolume(app.mainWindow, 'app-audio-player audio')
|
|
)
|
|
.toBe(0.9);
|
|
} finally {
|
|
await closeElectronApp(app);
|
|
}
|
|
});
|
|
});
|
|
|
|
async function selectSettingsOption(
|
|
page: Page,
|
|
selectTestId: string,
|
|
optionTestId: string
|
|
): Promise<void> {
|
|
await page.getByTestId(selectTestId).click();
|
|
await page.getByTestId(optionTestId).click();
|
|
}
|
|
|
|
async function reserveFreePort(): Promise<number> {
|
|
return new Promise((resolve, reject) => {
|
|
const server = createNetServer();
|
|
|
|
server.on('error', reject);
|
|
server.listen(0, '127.0.0.1', () => {
|
|
const address = server.address() as AddressInfo | null;
|
|
if (!address) {
|
|
server.close();
|
|
reject(new Error('Could not reserve a remote control port.'));
|
|
return;
|
|
}
|
|
|
|
server.close(() => resolve(address.port));
|
|
});
|
|
});
|
|
}
|
|
|
|
async function waitForRemoteControlServer(
|
|
request: APIRequestContext,
|
|
port: number
|
|
): Promise<void> {
|
|
await waitForRemoteStatus(
|
|
request,
|
|
port,
|
|
(status) => status.portal === 'unknown' && status.isLiveView === false
|
|
);
|
|
}
|
|
|
|
async function waitForRemoteStatus(
|
|
request: APIRequestContext,
|
|
port: number,
|
|
predicate: (status: RemoteControlStatus) => boolean
|
|
): Promise<RemoteControlStatus> {
|
|
let latestStatus: RemoteControlStatus | null = null;
|
|
|
|
await expect
|
|
.poll(
|
|
async () => {
|
|
latestStatus = await getRemoteStatus(request, port);
|
|
return latestStatus ? predicate(latestStatus) : false;
|
|
},
|
|
{ timeout: 20000 }
|
|
)
|
|
.toBe(true);
|
|
|
|
return latestStatus as RemoteControlStatus;
|
|
}
|
|
|
|
async function getRemoteStatus(
|
|
request: APIRequestContext,
|
|
port: number
|
|
): Promise<RemoteControlStatus | null> {
|
|
try {
|
|
const response = await request.get(remoteControlUrl(port, '/status'), {
|
|
timeout: 1000,
|
|
});
|
|
|
|
if (!response.ok()) {
|
|
return null;
|
|
}
|
|
|
|
return (await response.json()) as RemoteControlStatus;
|
|
} catch {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
async function postRemoteCommand(
|
|
request: APIRequestContext,
|
|
port: number,
|
|
path: string
|
|
): Promise<void> {
|
|
const response = await request.post(remoteControlUrl(port, path), {
|
|
data: {},
|
|
});
|
|
|
|
expect(response.ok()).toBe(true);
|
|
}
|
|
|
|
function remoteControlUrl(port: number, path: string): string {
|
|
return `http://127.0.0.1:${port}/api/remote-control${path}`;
|
|
}
|
|
|
|
async function readMediaVolume(page: Page, selector: string): Promise<number> {
|
|
return page.locator(selector).first().evaluate((element) => {
|
|
return Number((element as HTMLMediaElement).volume.toFixed(2));
|
|
});
|
|
}
|
|
|
|
function roundVolume(volume: number | undefined): number | null {
|
|
if (volume === undefined) {
|
|
return null;
|
|
}
|
|
|
|
return Number(volume.toFixed(2));
|
|
}
|