import { test, expect } from '@playwright/test';

test('can create a new note', async ({ page }) => {
	// Reset the database before test
	await page.goto('/');
	await page.request.post('/api/test/reset');

	await page.goto('/notes/new');

	// Fill in the note details
	await page.fill('#title', 'Test Note');
	await page.fill('#content', 'This is a test note');
	await page.click('button[type="submit"]');

	// Should redirect to the note page
	await expect(page).toHaveURL(/\/notes\/[^/]+$/);
	await expect(page.locator('h1')).toHaveText('Test Note');
});

test('can edit an existing note', async ({ page }) => {
	// Reset the database before test
	await page.goto('/');
	await page.request.post('/api/test/reset');

	// Create a note first
	await page.goto('/notes/new');
	await page.fill('#title', 'Original Title');
	await page.fill('#content', 'Original content');
	await page.click('button[type="submit"]');

	// Click edit button and modify the note
	await page.click('button:text("Edit")');
	await page.fill('input.input', 'Updated Title');
	await page.fill('textarea.textarea', 'Updated content');
	await page.click('button:text("Save")');

	// Verify changes
	await expect(page.locator('h1')).toHaveText('Updated Title');
	await expect(page.locator('.content')).toContainText('Updated content');
});

test('can create and navigate note links', async ({ page }) => {
	// Reset the database before test
	await page.goto('/');
	await page.request.post('/api/test/reset');

	// Create first note
	await page.goto('/notes/new');
	await page.fill('#title', 'First Note');
	await page.fill('#content', 'This links to [[Second Note]]');
	await page.click('button[type="submit"]');

	// Wait for redirect and verify we're on the right page
	await expect(page).toHaveURL(/\/notes\/[^/]+$/);
	await expect(page.locator('h1')).toHaveText('First Note');
	const firstNoteUrl = page.url();

	// Create second note
	await page.goto('/notes/new');
	await page.fill('#title', 'Second Note');
	await page.fill('#content', 'This is referenced by First Note');
	await page.click('button[type="submit"]');
	// Wait for second note to be created
	await expect(page).toHaveURL(/\/notes\/[^/]+$/);
	await expect(page.locator('h1')).toHaveText('Second Note');

	// Go back to first note and wait for load
	await page.goto(firstNoteUrl);
	await expect(page.locator('h1')).toHaveText('First Note');
	// Wait for content and links to be rendered
	await page.waitForSelector('.content:not(:empty)');
	await page.waitForSelector('.note-link');

	// Check links
	const noteLink = page.locator('.note-link');
	await expect(noteLink).toBeVisible();
	await expect(noteLink).toHaveText('Second Note');
	await noteLink.click();

	// Verify navigation to second note
	await expect(page).toHaveURL(/\/notes\/[^/]+$/);
	await expect(page.locator('h1')).toHaveText('Second Note');

	// Check backlinks after ensuring they're loaded
	await page.waitForSelector('.tag.is-info');
	await expect(page.locator('.tag.is-info')).toBeVisible();
	await expect(page.locator('.tag.is-info')).toHaveText('First Note');
});

test('handles mobile navigation correctly', async ({ page }) => {
	// Set viewport to mobile size
	await page.setViewportSize({ width: 375, height: 667 });
	await page.goto('/');

	// Check that mobile navigation is visible
	await expect(page.locator('.navbar.is-fixed-bottom')).toBeVisible();

	// Navigate between sections
	await page.click('text=Feeds');
	await expect(page).toHaveURL('/feeds');

	await page.click('text=Read Later');
	await expect(page).toHaveURL('/readlist');

	await page.click('text=Notes');
	await expect(page).toHaveURL('/');
});

export {};