{#each routes as route}
{route.icon}
-
{route.label}
+
{route.label}
{/each}
@@ -55,25 +55,41 @@
{/if}
diff --git a/frontend/src/routes/notes/[id]/+page.svelte b/frontend/src/routes/notes/[id]/+page.svelte
index 40929cc..63b6d43 100644
--- a/frontend/src/routes/notes/[id]/+page.svelte
+++ b/frontend/src/routes/notes/[id]/+page.svelte
@@ -56,7 +56,7 @@
{#if note}
-
+
@@ -134,11 +134,3 @@
{/if}
-
-
diff --git a/frontend/tests/notes.test.ts b/frontend/tests/notes.test.ts
new file mode 100644
index 0000000..213f375
--- /dev/null
+++ b/frontend/tests/notes.test.ts
@@ -0,0 +1,109 @@
+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 {};
diff --git a/scripts/pre-commit.sh b/scripts/pre-commit.sh
index f9ef219..cae6c78 100755
--- a/scripts/pre-commit.sh
+++ b/scripts/pre-commit.sh
@@ -54,6 +54,12 @@ $BUN_CMD check || {
exit 1
}
+echo -e "\n${GREEN}Running frontend tests...${NC}"
+$BUN_CMD run test || {
+ echo -e "${RED}Frontend tests failed!${NC}"
+ exit 1
+}
+
echo -e "\n${GREEN}Building frontend...${NC}"
$BUN_CMD run build || {
echo -e "${RED}Frontend build failed!${NC}"