feat: visual polish & UX — fade-in, theme toggle, scroll-to-top, footer, cursor, badge
- Add FadeIn component (IntersectionObserver scroll-reveal + load animation) - Add dark/light theme toggle (useSyncExternalStore + localStorage) - Add scroll-to-top button (appears after 300px scroll) - Add configurable footer with social links (gallery.yaml) - Add crosshair cursor on photo grid items - Add 'X photos' count badge on subpage cover images - Add light theme color palette in tokens.css
This commit is contained in:
31
e2e/navigation.spec.ts
Normal file
31
e2e/navigation.spec.ts
Normal file
@@ -0,0 +1,31 @@
|
||||
import { test, expect } from '@playwright/test';
|
||||
|
||||
test.describe('Navigation', () => {
|
||||
test('clicking a hero nav link navigates to a subpage', async ({ page }) => {
|
||||
await page.goto('/');
|
||||
const heroNav = page.locator('.hero__nav .hero__nav-link').first();
|
||||
const href = await heroNav.getAttribute('href');
|
||||
expect(href).toBeTruthy();
|
||||
|
||||
await heroNav.click();
|
||||
await page.waitForURL(`**${href}`);
|
||||
expect(page.url()).toContain(href);
|
||||
});
|
||||
|
||||
test('header About link navigates to /about', async ({ page }) => {
|
||||
await page.goto('/');
|
||||
const aboutLink = page.locator('.header__nav-link', { hasText: 'About' });
|
||||
await aboutLink.click();
|
||||
await page.waitForURL('**/about');
|
||||
expect(page.url()).toContain('/about');
|
||||
});
|
||||
|
||||
test('header Home link navigates back to /', async ({ page }) => {
|
||||
await page.goto('/about');
|
||||
const homeLink = page.locator('.header__nav-link', { hasText: 'Home' });
|
||||
await homeLink.click();
|
||||
await page.waitForURL('**/');
|
||||
// Accept both "/" and "?..." after root
|
||||
expect(new URL(page.url()).pathname).toBe('/');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user