import { expect, test } from '@playwright/test';
const path = 'http://localhost:4173/projects/spotify-beatmap-finder';
test('finder is responsive and validates enhanced submissions', async ({ page }) => {
	await page.setViewportSize({ width: 390, height: 844 });
	await page.goto(path);
	await expect(
		page.getByRole('heading', { name: 'Spotify Map Finder', exact: true })
	).toBeVisible();
	expect(await page.evaluate(() => document.documentElement.scrollWidth <= window.innerWidth)).toBe(
		true
	);
	await page.getByLabel('Song or Spotify URL').fill('spotify:artist:6PUzxtIHkv346yP89NzP9X');
	await page.getByRole('button', { name: 'Search' }).click();
	await expect(page.getByRole('alert')).toContainText('Unsupported Spotify resource');
	await expect(page.getByLabel('Song or Spotify URL')).toHaveValue(
		'spotify:artist:6PUzxtIHkv346yP89NzP9X'
	);
});
test('finder retains native form behavior', async ({ browser }) => {
	const context = await browser.newContext({ javaScriptEnabled: false });
	const page = await context.newPage();
	await page.goto(path);
	await page.getByLabel('Song or Spotify URL').fill('spotify:album:invalid');
	await page.getByRole('button', { name: 'Search' }).click();
	await expect(page.getByRole('alert')).toContainText('Invalid Spotify ID');
	await expect(page.getByLabel('Song or Spotify URL')).toHaveValue('spotify:album:invalid');
	await context.close();
});